codescracker


javascript

JavaScript Operators



« Previous Tutorial Next Tutorial »


Operators in JavaScript, are used to perform some mathematical or logical manipulations. There are following types of operators available in JavaScript:

JavaScript Arithmetic Operators

JavaScript arithmetic operators are used to perform arithmetical task. Here, the following table lists the arithmetic operators available in JavaScript:

Operator Meaning
+ This operator adds two operands
- This operator subtracts second operand from the first
/ This operator divide numerator by denominator
* This operator multiply both operands
% This is a modulus operator, used to calculate the remainder
-- This is a decrement operator, decreases integer value by one
++ This is a increment operator, increases integer value by one

Important - JavaScript addition operator (+) works for numeric as well as strings. For example, "a" + 20 will give "a20"

Example

Here is an example, uses all JavaScript arithmetic operators:

<!DOCTYPE html>
<html>
<head>
	<title>JavaScript Arithmetic Operators Example</title>
	<script type="text/javascript">
		function operator_fun1()
		{
			var num1 = 22;
			var num2 = 10;
			var res;
			res = num1 + num2;
			document.getElementById("operator_sp1").innerHTML = res;
			res = num1 - num2;
			document.getElementById("operator_sp2").innerHTML = res;
			res = num1 * num2;
			document.getElementById("operator_sp3").innerHTML = res;
			res = num1 / num2;
			document.getElementById("operator_sp4").innerHTML = res;
			res = num1 % num2;
			document.getElementById("operator_sp5").innerHTML = res;
			res = ++num1;
			document.getElementById("operator_sp6").innerHTML = res;
			res = --num1
			document.getElementById("operator_sp7").innerHTML = res;
			res = num1++;
			document.getElementById("operator_sp8").innerHTML = res;
			res = num1--;
			document.getElementById("operator_sp9").innerHTML = res;
		}
	</script>
</head>
<body>

<p>
	<span id="operator_sp1">Output 1</span><br/>
	<span id="operator_sp2">Output 2</span><br/>
	<span id="operator_sp3">Output 3</span><br/>
	<span id="operator_sp4">Output 4</span><br/>
	<span id="operator_sp5">Output 5</span><br/>
	<span id="operator_sp6">Output 6</span><br/>
	<span id="operator_sp7">Output 7</span><br/>
	<span id="operator_sp8">Output 8</span><br/>
	<span id="operator_sp9">Output 9</span>
</p>
<input type="button" onclick="operator_fun1()" value="Click Here" />

</body>
</html>

Here is the output produced by the above JavaScript Arithmetic Operator example program. This is the initial output:

javascript operators

Now click on the Click Here button, you will watch the output as shown in the following snapshot:

javascript operators example

Here is the live demo output of the above arithmetic operators example code in JavaScript.

Output 1
Output 2
Output 3
Output 4
Output 5
Output 6
Output 7
Output 8
Output 9

JavaScript Assignment Operators

Assignment operators in JavaScript, are used to assign the values of right side operand to the left side operand. Here, this table lists the assignment operators available in JavaScript:

Operator Meaning
= This operator Assigns values from the right side operands to left side operand
-= This operator subtracts right operand from the left operand and assign the result to the left operand
+= This operator adds right operand to the left operand and assign the result to the left operand
/= This operator divides left operand with the right operand and assign the result to the left operand
*= This operator multiplies right operand with the left operand and assign the result to the left operand
%= This operator takes modulus using two operands and assign the result to the left operand

JavaScript typeof Operator

JavaScript typeof operators helps in finding the type of JavaScript variable. Here is an example:

<!DOCTYPE html>
<html>
<head>
	<title>JavaScript Operators Example</title>
</head>
<body>

<p id="operator_para2"></p>
<script>
		document.getElementById("operator_para2").innerHTML = typeof "Sagar" + "<br>" + 
													typeof 3.14 + "<br>" + 
													typeof false + "<br>" + 
													typeof [1,2,3,4] + "<br>" + 
													typeof {name:'Sagar', age:19};
</script>
	
</body>
</html>

Here is the output produced by the above JavaScript typedef example program.

operators in JavaScript

To learn about all these data types, refer JavaScript Data Types tutorial.

JavaScript Conditional (Ternary) Operator

Conditional operators in JavaScript, are used to assign a value to a variable based on some condition. Here is the general form to use JavaScript conditional operators:

variable_name = (condition) ? value1:value2 

Let's look at the following example:

<!DOCTYPE html>
<html>
<head>
	<title>JavaScript Operators Example</title>
</head>
<body>

<p>Enter your Marks in Computer out of 100</p>
<input id="mark" value="79" />
<button onclick="operator_fun3()">Remarks ?</button>
<p id="operator_para3"></p>
<script>
	function operator_fun3()
	{
		var mark, remark;
		mark = document.getElementById("mark").value;
		remark = (mark < 80) ? "You have to do hard work for improving your performance":"Good, keep it up";
		document.getElementById("operator_para3").innerHTML = remark;
	}
</script>

</body>
</html>

Here is the output produced by the above JavaScript conditional operator or ternary operator example program. This is the initial output:

javascript operators program

Now click on the Remarks ? button, you will watch the output as shown in the figure given below:

javascript arithmetic ternary operators

Here is the live demo output of the above ternary operator example code in JavaScript.

Enter your Marks in Computer out of 100

JavaScript Bitwise Operators

Bit operators in JavaScript, work on 32-bit numbers. Any numeric operand in the operation is converted into a 32-bit number. Let's look at the following table, lists bitwise operators available in JavaScript with examples:

Operator Name Expression is same as Result In Decimal
| OR x = 5 | 1 0101 | 0001 0101 5
& AND x = 5 & 1 0101 & 0001 0001 1
^ XOR x = 5 ^ 1 0101 ^ 0001 0100 4
~ NOT x = ~ 5 ~0101 1010 10
>> Right shift x = 5 >> 1 0101 >> 1 0010 2
<< Left shift x = 5 << 1 0101 << 1 1010 10

JavaScript Operator Precedence

The following table describes the operators in the decreasing order of their precedence:

Operator Name Operator
Highest Precedence
member operator .
[]
new operator new
function call operator ()
increment operator ++
decrement operator --
logical NOT operator !
bitwise NOT operator ~
unary plus operator +
unary negation operator -
typedef operator typedef
void operator void
delete operator delete
multiplication operator *
division operator /
modulus operator %
addition operator +
subtraction operator -
bitwise shift operator <<
>>
>>>
relational operator <
<=
>
>=
in operator in
instanceof operator instanceof
equality operator ==
!=
===
!==
bitwise AND operator &
bitwise XOR operator ^
bitwise OR operator |
logical AND operator &&
logical OR operator ||
conditional operator ?:
assignment operator =
+=
-=
*=
/=
%=
<<=
>>=
>>>=
&=
^=
|=
comma operator ,
Lowest Precedence

« Previous Tutorial Next Tutorial »



Tools
Calculator

Quick Links
Signup - Login - Give Online Test