JavaScript Variables and Constants

JavaScript Variables
In programming, a variable is a container (storage area) to hold data. For example,

let num = 5;

Here, num is a variable. It's storing 5.

JavaScript Declare Variables

In JavaScript, we use either var or let keyword to declare variables. For example,

var x;
let y;

Here, x and y are variables.

JavaScript var Vs let

Both var and let are used to declare variables. However, there are some
differences between them.
var let

let is the new way of declaring variables

var is used in the older versions of JavaScript
starting ES6 (ES2015).

var is function scoped (will be discussed in later let is block scoped (will be discussed in
tutorials). later tutorials).

For example, var x; For example, let y;

Note: It is recommended we use let instead of var . However, there are a few
browsers that do not support let .
JavaScript Initialize Variables

We use the assignment operator = to assign a value to a variable.

let x;
x = 5;

Here, 5 is assigned to variable x .

You can also initialize variables during its declaration.

let x = 5;
let y = 6;

In JavaScript, it's possible to declare variables in a single statement.

let x = 5, y = 6, z = 7;

If you use a variable without initializing it, it will have an undefined value.

let x; // x is the name of the variable

console.log(x); // undefined

Here x is the variable name and since it does not contain any value, it will be
undefined.

Change the Value of Variables

It's possible to change the value stored in the variable. For example,

// 5 is assigned to variable x
let x = 5;
console.log(x); // 5

// vaue of variable x is changed

x = 3;
console.log(x); // 3
Run Code

The value of a variable may vary. Hence, the name variable.

Rules for Naming JavaScript Variables

The rules for naming variables are:

1. Variable names must start with either a letter, an underscore _ , or the dollar
sign $ . For example,

//valid
let a = 'hello';
let _a = 'hello';

let $a = 'hello';

2. Variable names cannot start with numbers. For example,

//invalid

Let 1a = 'hello'; // this gives an error

3. JavaScript is case-sensitive. So y and Y are different variables. For example,

let y = "hi";
let Y = 5;

console.log(y); // hi
console.log(Y); // 5

Keywords cannot be used as variable names. For example,

//invalid

let new = 5; // Error! new is a keyword.

Notes:
• Though you can name variables in any way you want, it's a good practice to
give a descriptive variable name. If you are using a variable to store the
number of apples, it better to use apples or numberOfApples rather than x or n .
• In JavaScript, the variable names are generally written in camelCase if it has
multiple words. For example, firstName , annualSalary , etc.
JavaScript Constants
The const keyword was also introduced in the ES6(ES2015) version to create
constants. For example,

const x = 5;

Once a constant is initialized, we cannot change its value.

const x = 5;
x = 10; // Error! constant cannot be changed.
console.log(x)

Simply, a constant is a type of variable whose value cannot be changed.

Also, you cannot declare a constant without initializing it. For example,

const x; // Error! Missing initializer in const declaration.

x = 5;
console.log(x)
 JavaScript Data Types

There are different types of data that we can use in a JavaScript program. For
example,

const x = 5;
const y = "Hello";

Here,

• 5 is an integer data.
• "Hello" is a string data.
JavaScript Data Types
There are eight basic data types in JavaScript. They are:

Data Types Description Example

'hello' , "hello world!"

String represents textual data
etc

an integer or a floating-point
Number 3 , 3.234 , 3e-2 etc.
number

an integer with arbitrary 900719925124740999n , 1n

BigInt
precision etc.

Boolean Any of two values: true or false true and false

a data type whose variable is not

undefined let a;
initialized

null denotes a null value let a = null;

data type whose instances are let value =

Symbol
unique and immutable Symbol('hello');

key-value pairs of collection of

Object let student = { };
data
Here, all data types except Object are primitive data types, whereas Object is non-
primitive.

Note: The Object data type (non-primitive type) can store collections of data,
whereas primitive data type can only store a single data.

JavaScript String
String is used to store text. In JavaScript, strings are surrounded by double or
single quotes:
• Single quotes: 'Hello'

• Double quotes: "Hello"

• Backticks: `Hello`

For example,

//strings example
const name = 'ram';
const name1 = "hari";
const result = `The names are ${name} and ${name1}`;

Single quotes and double quotes are practically the same and you can use either
of them.

Backticks are generally used when you need to include variables or expressions
into a string. This is done by wrapping variables or expressions with ${variable or

expression} as shown above.

JavaScript Number
Number represents integer and floating numbers (decimals and exponentials). For
example,

const number1 = 3;
const number2 = 3.433;
const number3 = 3e5 // 3 * 10^5
A number type can also be +Infinity , -Infinity , and NaN (not a number). For
example,
const number1 = 3/0;
console.log(number1); // Infinity

const number2 = -3/0;

console.log(number2); // -Infinity

// strings can't be divided by numbers

const number3 = "abc"/3;
console.log(number3); // NaN
Run Code

JavaScript BigInt
In JavaScript, Number type can only represent numbers less than (253 - 1) and more
than -(253 - 1). However, if you need to use a larger number than that, you can use
the BigInt data type.
A BigInt number is created by appending n to the end of an integer. For example,
// BigInt value
const value1 = 900719925124740998n;

// Adding two big integers

const result1 = value1 + 1n;
console.log(result1); // "900719925124740999n"

const value2 = 900719925124740998n;

// Error! BitInt and number cannot be added

const result2 = value2 + 1;
console.log(result2);

Output

900719925124740999n
Uncaught TypeError: Cannot mix BigInt and other types

Note: BigInt was introduced in the newer version of JavaScript and is not
supported by many browsers including Safari. Visit JavaScript BigInt support to
learn more.
JavaScript Boolean
This data type represents logical entities. Boolean represents one of two
values: true or false . It is easier to think of it as a yes/no switch. For example,

const dataChecked = true;

const valueCounted = false;

You will learn more about booleans in the JavaScript Comparison and Logical
Operators tutorial.

JavaScript undefined
The undefined data type represents value that is not assigned. If a variable is
declared but the value is not assigned, then the value of that variable will
be undefined . For example,
let name;
console.log(name); // undefined
Run Code

It is also possible to explicitly assign a variable value undefined . For example,

let name = undefined;
console.log(name); // undefined
Run Code

Note: It is recommended not to explicitly assign undefined to a variable.

Usually, null is used to assign 'unknown' or 'empty' value to a variable.
JavaScript null
In JavaScript, null is a special value that represents empty or unknown value.
For example,

const number = null;

The code above suggests that the number variable is empty.

Note: null is not the same as NULL or Null.
JavaScript Symbol
This data type was introduced in a newer version of JavaScript (from ES2015).

A value having the data type Symbol can be referred to as a symbol value. Symbol is
an immutable primitive value that is unique. For example,

// two symbols with the same description

const value1 = Symbol('hello');

const value2 = Symbol('hello');

Though value1 and value2 both contain 'hello' , they are different as they are of
the Symbol type.
JavaScript Object
An object is a complex data type that allows us to store collections of data. For
example,

const student = {
firstName: 'ram',
lastName: null,
class: 10
};

JavaScript Type
JavaScript is a dynamically typed (loosely typed) language. JavaScript
automatically determines the variables' data type for you.
It also means that a variable can be of one data type and later it can be changed to
another data type. For example,

// data is of undefined type

let data;

// data is of integer type

data = 5;

// data is of string type

data = "JavaScript Programming";

JavaScript typeof
To find the type of a variable, you can use the typeof operator. For example,

const name = 'ram';

typeof(name); // returns "string"

const number = 4;
typeof(number); //returns "number"

const valueChecked = true;

typeof(valueChecked); //returns "boolean"

const a = null;
typeof(a); // returns "object"
JavaScript Operators
In this tutorial, you will learn about different operators available in JavaScript and
how to use them with the help of examples.

What is an Operator?
In JavaScript, an operator is a special symbol used to perform operations on
operands (values and variables). For example,

2 + 3; // 5

Here + is an operator that performs addition, and 2 and 3 are operands.

JavaScript Operator Types
Here is a list of different operators you will learn in this tutorial.

• Assignment Operators

• Arithmetic Operators

• Comparison Operators

• Logical Operators

• Bitwise Operators

• String Operators

• Other Operators
 1. JavaScript Assignment Operators
Assignment operators are used to assign values to variables. For example,

const x = 5;

Here, the = operator is used to assign value 5 to variable x .

Here's a list of commonly used assignment operators:

Operator Name Example

= Assignment operator a = 7; // 7

+= Addition assignment a += 5; // a = a + 5

-= Subtraction Assignment a -= 2; // a = a - 2

*= Multiplication Assignment a *= 3; // a = a * 3

/= Division Assignment a /= 2; // a = a / 2

%= Remainder Assignment a %= 2; // a = a % 2

**= Exponentiation Assignment a **= 2; // a = a**2

Note: The commonly used assignment operator is = . You will understand other
assignment operators such as += , -= , *= etc. once we learn arithmetic operators.

2. JavaScript Arithmetic Operators

Arithmetic operators are used to perform arithmetic calculations. For example,

const number = 3 + 5; // 8

Here, the + operator is used to add two operands.

Operator Name Example

+ Addition x + y
- Subtraction x - y

* Multiplication x * y

/ Division x / y

% Remainder x % y

++ Increment (increments by 1) ++x or x++

-- Decrement (decrements by 1) --x or x--

** Exponentiation (Power) x ** y

Example 1: Arithmetic operators in JavaScript

let x = 5;
let y = 3;

// addition
console.log('x + y = ', x + y); // 8

// subtraction
console.log('x - y = ', x - y); // 2

// multiplication
console.log('x * y = ', x * y); // 15

// division
console.log('x / y = ', x / y); // 1.6666666666666667

// remainder
console.log('x % y = ', x % y); // 2

// increment
console.log('++x = ', ++x); // x is now 6
console.log('x++ = ', x++); // prints 6 and then increased to 7
console.log('x = ', x); // 7

// decrement
console.log('--x = ', --x); // x is now 6
console.log('x-- = ', x--); // prints 6 and then decreased to 5
console.log('x = ', x); // 5

//exponentiation
console.log('x ** y =', x ** y);
Run Code
Visit ++ and -- operator to learn more.

Note: The ** operator was introduced in ECMAScript 2016 and some browsers
may not support them.

3. JavaScript Comparison Operators

Comparison operators compare two values and return a boolean value,
either true or false . For example,
const a = 3, b = 2;
console.log(a > b); // true
Run Code

Here, the comparison operator > is used to compare whether a is greater than b .
Operator Description Example

== Equal to: returns true if the operands are equal x == y

!= Not equal to: returns true if the operands are not equal x != y

Strict equal to: true if the operands are equal and of the
=== x === y
same type

Strict not equal to: true if the operands are equal but of
!== x !== y
different type or not equal at all

Greater than: true if left operand is greater than the

> x > y
right operand

Greater than or equal to: true if left operand is greater

>= x >= y
than or equal to the right operand

Less than: true if the left operand is less than the right
< x < y
operand

Less than or equal to: true if the left operand is less

<= x <= y
than or equal to the right operand
Example 2: Comparison operators in JavaScript
// equal operator
console.log(2 == 2); // true
console.log(2 == '2'); // true

// not equal operator

console.log(3 != 2); // true
console.log('hello' != 'Hello'); // true

// strict equal operator

console.log(2 === 2); // true
console.log(2 === '2'); // false

// strict not equal operator

console.log(2 !== '2'); // true
console.log(2 !== 2); // false

Comparison operators are used in decision-making and loops.

4. JavaScript Logical Operators

Logical operators perform logical operations and return a boolean value,

either true or false . For example,

const x = 5, y = 3;
(x < 6) && (y < 5); // true

Here, && is the logical operator AND. Since both x < 6 and y < 5 are true , the result
is true .

Operator Description Example

Logical AND: true if both the operands are true , else

&& x && y
returns false

Logical OR: true if either of the operands is true ;

|| x || y
returns false if both are false

! Logical NOT: true if the operand is false and vice- !x

 versa.

Example 3: Logical Operators in JavaScript

// logical AND
console.log(true && true); // true
console.log(true && false); // false

// logical OR
console.log(true || false); // true

// logical NOT
console.log(!true); // false
Run Code

Output

true
false
true
false

Logical operators are used in decision making and loops.

5. JavaScript Bitwise Operators

Bitwise operators perform operations on binary representations of numbers.

Operator Description

& Bitwise AND

| Bitwise OR

^ Bitwise XOR

~ Bitwise NOT

<< Left shift

>> Sign-propagating right shift

>>> Zero-fill right shift

Bitwise operators are rarely used in everyday programming

6. JavaScript String Operators

In JavaScript, you can also use the + operator to concatenate (join) two or more
strings.
Example 4: String operators in JavaScript
// concatenation operator
console.log('hello' + 'world');

let a = 'JavaScript';

a += ' tutorial'; // a = a + ' tutorial';

console.log(a);
Run Code

Output

helloworld
JavaScript tutorial

Note: When + is used with strings, it performs concatenation. However, when + is

used with numbers, it performs addition.

7. Other JavaScript Operators

Here's a list of other operators available in JavaScript. You will learn about these
operators in later tutorials.

Operator Description Example

evaluates multiple operands and

, let a = (1, 3 , 4); // 4
returns the value of the last operand.

(5 > 3) ? 'success' :
?: returns value based on the condition
'error'; // "success"
 deletes an object's property, or an
delete delete x
element of an array

returns a string indicating the data

typeof typeof 3; // "number"
type

void discards the expression's return value void(x)

returns true if the specified property

in prop in object
is in the object

instanc returns true if the specified object is object instanceof

eof of of the specified object type object_type
JavaScript Type Conversions
In programming, type conversion is the process of converting data of one type to
another. For example: converting String data to Number .

There are two types of type conversion in JavaScript.

• Implicit Conversion - automatic type conversion

• Explicit Conversion - manual type conversion
JavaScript Implicit Conversion
In certain situations, JavaScript automatically converts one data type to another (to
the right type). This is known as implicit conversion.

Example 1: Implicit Conversion to String

// numeric string used with + gives string type
let result;

result = '3' + 2;
console.log(result) // "32"

result = '3' + true;

console.log(result); // "3true"

result = '3' + undefined;

console.log(result); // "3undefined"

result = '3' + null;

console.log(result); // "3null"
Run Code

Note: When a number is added to a string, JavaScript converts the number to a

string before concatenation.

Example 2: Implicit Conversion to Number

// numeric string used with - , / , * results number type

let result;

result = '4' - '2';

console.log(result); // 2
result = '4' - 2;
console.log(result); // 2

result = '4' * 2;
console.log(result); // 8

result = '4' / 2;
console.log(result); // 2
Run Code

Example 3: Non-numeric String Results to NaN

// non-numeric string used with - , / , * results to NaN

let result;

result = 'hello' - 'world';

console.log(result); // NaN

result = '4' - 'hello';

console.log(result); // NaN
Run Code

Example 4: Implicit Boolean Conversion to Number

// if boolean is used, true is 1, false is 0

let result;

result = '4' - true;

console.log(result); // 3

result = 4 + true;
console.log(result); // 5

result = 4 + false;
console.log(result); // 4
Run Code

Note: JavaScript considers 0 as false and all non-zero number as true . And,
if true is converted to a number, the result is always 1.
Example 5: null Conversion to Number
// null is 0 when used with number
let result;

result = 4 + null;
console.log(result); // 4

result = 4 - null;
console.log(result); // 4
Run Code

Example 6: undefined used with number, boolean or null

// Arithmetic operation of undefined with number, boolean or null gives NaN

let result;

result = 4 + undefined;
console.log(result); // NaN

result = 4 - undefined;
console.log(result); // NaN

result = true + undefined;

console.log(result); // NaN

result = null + undefined;

console.log(result); // NaN
Run Code

JavaScript Explicit Conversion

You can also convert one data type to another as per your needs. The type
conversion that you do manually is known as explicit type conversion.

In JavaScript, explicit type conversions are done using built-in methods.

Here are some common methods of explicit conversions.

1. Convert to Number Explicitly

To convert numeric strings and boolean values to numbers, you can use Number() .

For example,
let result;

// string to number
result = Number('324');
console.log(result); // 324

result = Number('324e-1')
console.log(result); // 32.4

// boolean to number
result = Number(true);
console.log(result); // 1

result = Number(false);
console.log(result); // 0
Run Code

In JavaScript, empty strings and null values return 0. For example,

let result;
result = Number(null);
console.log(result); // 0

let result = Number(' ')

console.log(result); // 0

If a string is an invalid number, the result will be NaN . For example,

let result;
result = Number('hello');
console.log(result); // NaN

result = Number(undefined);
console.log(result); // NaN

result = Number(NaN);
console.log(result); // NaN

Note: You can also generate numbers from strings using parseInt() , parseFloat() ,

unary operator + and Math.floor() . For example,

let result;
result = parseInt('20.01');
console.log(result); // 20

result = parseFloat('20.01');
console.log(result); // 20.01

result = +'20.01';
console.log(result); // 20.01

result = Math.floor('20.01');
console.log(result); // 20

2. Convert to String Explicitly

To convert other data types to strings, you can use either String() or toString() . For
example,
//number to string
let result;
result = String(324);
console.log(result); // "324"

result = String(2 + 4);

console.log(result); // "6"

//other data types to string

result = String(null);
console.log(result); // "null"

result = String(undefined);
console.log(result); // "undefined"

result = String(NaN);
console.log(result); // "NaN"

result = String(true);
console.log(result); // "true"

result = String(false);
console.log(result); // "false"

// using toString()
result = (324).toString();
console.log(result); // "324"

result = true.toString();
console.log(result); // "true"
Run Code
Note: String() takes null and undefined and converts them to string.
However, toString() gives error when null are passed.

3. Convert to Boolean Explicitly

To convert other data types to a boolean, you can use Boolean().

In JavaScript, undefined , null , 0 , NaN , '' converts to false . For example,

let result;
result = Boolean('');
console.log(result); // false

result = Boolean(0);
console.log(result); // false

result = Boolean(undefined);
console.log(result); // false

result = Boolean(null);
console.log(result); // false

result = Boolean(NaN);
console.log(result); // false
Run Code

All other values give true . For example,

result = Boolean(324);
console.log(result); // true

result = Boolean('hello');
console.log(result); // true

result = Boolean(' ');

console.log(result); // true
Run Code

JavaScript Type Conversion Table

The table shows the conversion of different values to String, Number, and Boolean
in JavaScript.
 String Number Boolean
Value
Conversion Conversion Conversion

1 "1" 1 true

0 "0" 0 false

"1" "1" 1 true

"0" "0" 0 true

"ten" "ten" NaN true

true "true" 1 true

false "false" 0 false

null "null" 0 false

undefined "undefined" NaN false

'' "" 0 false

'' "" 0 true

You will learn about the conversion of objects and arrays to other data types in
later tutorials.