Introduction to JavaScript
JavaScript is a scripting language that is used to create and manage dynamic web pages,
basically anything that moves on your screen without requiring you to refresh your browser. It
can be anything from animated graphics to an automatically generated Facebook timeline.
When most people get interested in web development, they start with good old HTML
and CSS. From there, they move on to JavaScript, which makes sense, because, these three
elements together form the backbone of web development.
HTML is the structure of your page like the headers, the body text, any images you
want to include. It basically defines the contents of a web page.
CSS controls how that page looks (it’s what you’ll use to customize fonts, background
colors, etc.).
JavaScript is the third element. Once you’ve created your structure (HTML) and your
aesthetic vibe (CSS), JavaScript makes your site dynamic (automatically updateable).
Features of JavaScript
There are following features of JavaScript:
1. All popular web browsers support JavaScript as they provide built-in execution
environments.
2. JavaScript follows the syntax and structure of the C programming language. Thus,
it is a structured programming language.
3. JavaScript is a weakly typed language, where certain types are implicitly cast
(depending on the operation).
4. JavaScript is an object-oriented programming language that uses prototypes
rather than using classes for inheritance.
5. It is a light-weighted and interpreted language.
6. It is a case-sensitive language.
7. JavaScript is supportable in several operating systems including, Windows,
macOS, etc.
8. It provides good control to the users over the web browsers.
JavaScript Variable
1. JavaScript variable
2. JavaScript Local variable
3. JavaScript Global variable
A JavaScript variable is simply a name of storage location. There are two types of
variables in JavaScript : local variable and global variable.
There are some rules while declaring a JavaScript variable (also known as identifiers).
1. Name must start with a letter (a to z or A to Z), underscore( _ ), or dollar( $ ) sign.
2. After first letter we can use digits (0 to 9), for example value1.
3. JavaScript variables are case sensitive, for example x and X are different variables.
Correct JavaScript variables
1. var x = 10;
2. var _value="sonoo";
Incorrect JavaScript variables
1. var 123=30;
2. var *aa=320;
Example of JavaScript variable
<script>
var x = 10;
var y = 20;
var z=x+y;
document.write(z);
</script>
JavaScript local variable
A JavaScript local variable is declared inside block or function. It is accessible within the
function or block only. For example:
<script>
function abc(){
var x=10;//local variable
}
</script>
OR
<script>
If(10<13){
var y=20;//JavaScript local variable
}
</script>
JavaScript global variable
A JavaScript global variable is accessible from any function. A variable i.e. declared
outside the function or declared with window object is known as global variable. For
example:
<html>
<body>
<script>
var value=50;//global variable
function a(){
alert(value);
}
function b(){
alert(value);
}
</script>
<button onclick="a()">press</button>
</body>
</html>
Internals of global variable in JavaScript
When you declare a variable outside the function, it is added in the window object
internally. You can access it through window object also. For example:
<html>
<body>
<script>
function m(){
window.value=100;//declaring global variable by window object
}
function n(){
alert(window.value);//accessing global variable from other function
}
m();
</script>
<button onclick="n()">press</button>
</body>
</html>
4 Ways to Declare a JavaScript Variable:
Using var
Using let
Using const
Using nothing
1)var:
<script>
var x = 10;
var y = 20;
var z=x+y;
document.write(z);
</script>
2)let:
<script>
let x = 10;
// Here x is 10
{
let x = 2;
}
document.write(z);
// Here x is 10
</script>
3)Const:
The const keyword was introduced in ES6 (2015).
Variables defined with const cannot be Redeclared.
Variables defined with const cannot be Reassigned.
Variables defined with const have Block Scope.
EX: - const PI = 3.14159265359;
When to use JavaScript const?
Always declare a variable with const when you know that the value
should not be changed.
Use const when you declare:
A new Array
A new Object
A new Function
A new RegExp
Javascript Data Types
JavaScript provides different data types to hold different types of values. There are two
types of data types in JavaScript.
1. Primitive data type
2. Non-primitive (reference) data type
JavaScript is a dynamic type language, means you don't need to specify type of the
variable because it is dynamically used by JavaScript engine. You need to use var here
to specify the data type. It can hold any type of values such as numbers, strings etc. For
example:
1. var a=40;//holding number
2. var b="Rahul";//holding string
JavaScript primitive data types
There are five types of primitive data types in JavaScript. They are as follows:
Data Type Description
String represents sequence of characters e.g. "hello"
Number represents numeric values e.g. 100
Boolean represents boolean value either false or true
Undefined represents undefined value
Null represents null i.e. no value at all
JavaScript non-primitive data types
The non-primitive data types are as follows:
Data Type Description
Object represents instance through which we can access members
Array represents group of similar values
RegExp represents regular expression
Types of JavaScript Operators
There are different types of JavaScript operators:
Arithmetic Operators
Assignment Operators
Comparison Operators
Logical
Operator Description Operators
Condition
al
Operators
+ Addition Type
Operators
- Subtraction
* Multiplication
** Exponentiation (ES2016)
/ Division
% Modulus (Division Remainder)
++ Increment
-- Decrement
JavaScript Arithmetic Operators
Arithmetic Operators are used to perform arithmetic on numbers:
JavaScript Assignment Operators
Assignment operators assign values to JavaScript variables.
Operator Example Same As
= x=y x=y
+= x += y x=x+y
-= x -= y x=x-y
*= x *= y x=x*y
/= x /= y x=x/y
%= x %= y x=x%y
**= x **= y x = x ** y
Adding JavaScript Strings
The + operator can also be used to add (concatenate) strings
JavaScript Comparison Operators
Operator Description
== equal to
=== equal value and equal type
!= not equal
!== not equal value or not equal type
> greater than
< less than
>= greater than or equal to
<= less than or equal to
? ternary operator
JavaScript Logical Operators
Operator Description
&& logical and
|| logical or
! logical not
JavaScript Type Operators
Operator Description
typeof Returns the type of a variable
instanceof Returns true if an object is an instance of an object type
JavaScript Bitwise Operators
Bit operators work on 32 bits numbers.
Operator Description Example Same as Result Decimal
& AND 5&1 0101 & 0001 0001 1
| OR 5|1 0101 | 0001 0101 5
~ NOT ~5 ~0101 1010 10
^ XOR 5^1 0101 ^ 0001 0100 4
<< left shift 5 << 1 0101 << 1 1010 10
>> right shift 5 >> 1 0101 >> 1 0010 2
>>> unsigned right shift 5 >>> 1 0101 >>> 1 0010 2