JavaScript Operators

Arithmetic operators

JavaScript uses arithmetic operators ( + - * / ) to compute values

(5 + 6) * 10

JavaScript Expressions

The values can be of various types, such as numbers and strings.

For example, “John” + ” ” + “Doe”, evaluates to “John Doe”:

JavaScript Keywords

JavaScript keywords are used to identify actions to be performed.

The var keyword tells the browser to create variables:

var x, y;
x = 5 + 6;
y = x * 10;

JavaScript is Case Sensitive

All JavaScript identifiers are case sensitive

The variables lastName and lastname, are two different variables:

var lastname, lastName;
lastName = "Doe";
lastname = "Peterson";

More Variables

var price1 = 5;
var price2 = 6;
var total = price1 + price2;

The Assignment Operator

In JavaScript, the equal sign (=) is an “assignment” operator, not an “equal to” operator.

x = x + 5

It assigns the value of x + 5 to x

It calculates the value of x + 5 and puts the result into x. The value of x is incremented by 5.

The “equal to” operator is written like == in JavaScript

Brain Teaser

var x = 6 + 1 + 9; what will be the value of x? Ans is 16

var x = “John” + ” ” + “Doe”; what will be the value of x?  Ans is John Doe

var x = “6” + 1 + 9; what will be the value of x?  Ans is 619

var x = 2 + 3 + “5”; what will be the value of x?  Ans is 55

JavaScript Assignment Operators

Assignment operators assign values to JavaScript variables.

OperatorExampleSame As
=x = yx = y
+=x += yx = x + y
-=x -= yx = x – y
*=x *= yx = x * y
/=x /= yx = x / y
%=x %= yx = x % y
**=x **= yx = x ** y

Example

var x = 7;
x += 3;

JavaScript String Operators

The + operator can also be used to add (concatenate) strings.

Example
var exp1 = "Hello";
var exp2 = "World";
var exp3 = exp1 + " " + exp2;
var exp1 = "Hello there, how ";
exp1 += "are You?";

JavaScript Comparison Operators

OperatorDescription
==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

OperatorDescription
&&logical and
||logical or
!logical not

JavaScript Type Operators

OperatorDescription
TypeofReturns the type of a variable
InstanceofReturns true if an object is an instance of an object type

JavaScript Bitwise Operators

Bit operators work on 32 bits numbers.

Any numeric operand in the operation is converted into a 32 bit number. The result is converted back to a JavaScript number.

OperatorDescriptionExampleSame asResultDecimal
&AND5 & 10101 & 00010001 1
|OR5 | 10101 | 00010101 5
~NOT~ 5 ~01011010 10
^XOR5 ^ 10101 ^ 00010100 4
<< Zero fill left shift5 << 10101 << 11010 10
>> Signed right shift5 >> 10101 >> 10010  2
>>> Zero fill right shift5 >>> 10101 >>> 10010  2

The examples above uses 4 bits unsigned examples. But JavaScript uses 32-bit signed numbers.
Because of this, in JavaScript, ~ 5 will not return 10. It will return -6.
~00000000000000000000000000000101 will return 11111111111111111111111111111010

Incrementing

The increment operator (++) increments numbers.

Example

Example
var x = 5;
x++;
var z = x; 

Decrementing

The decrement operator (--) decrements numbers.

Example
var x = 5;
x--;
var z = x;

Exponentiation

The exponentiation operator (**) raises the first operand to the power of the second operand.

Example
var x = 5;
var z = x ** 2;          // result is 25 
x ** y produces the same result as Math.pow(x,y):
Example
var x = 5;
var z = Math.pow(x,2);   // result is 25 

Operator Precedence

Operator precedence describes the order in which operations are performed in an arithmetic expression.

Example
var x = 100 + 50 * 3; 

Is the result of example above the same as 150 * 3, or is it the same as 100 + 150?

Is the addition or the multiplication done first?

As in traditional school mathematics, the multiplication is done first.

Multiplication (*) and division (/) have higher precedence than addition (+) and subtraction (-).

And (as in school mathematics) the precedence can be changed by using parentheses:

Example
var x = (100 + 50) * 3;

When using parentheses, the operations inside the parentheses are computed first.

When many operations have the same precedence (like addition and subtraction), they are computed from left to right:

Example
var x = 100 + 50 - 3;

Assignment

The += assignment operator adds a value to a variable

var x = 13;
x += 7;

The -= assignment operator subtracts a value from a variable

var x = 18;
x -= 2;

The *= assignment operator multiplies a variable

var x = 6;
x *= 5;

The /= assignment divides a variable.

var x = 10;
x /= 8;

The %= assignment operator assigns a remainder to a variable

var x = 7;
x %= 3;