JavaScript Bitwise Operations

JavaScript provides several kinds of operators, making it possible to carry out basic operations on simple values such as arithmetic operations, assignment operations, logical operations, bitwise operations.

We often see JavaScript code that contains a mix of assignment operators, arithmetic operators, and logical operators. However, we don’t get to see bitwise operators in use that much.

Bitwise operators treat their operands as a sequence of 32 bits (zeroes and ones), rather than as decimal, hexadecimal, or octal numbers.

For example, the decimal number has a binary representation of 101. Bitwise operators perform their operations on such binary representations, but they return standard JavaScript numerical values.

JavaScript bitwise operators

Examples

Like C, C++, Java, Python, and various other languages, JavaScript also supports bit-wise operations. In JavaScript, a number is stored as a 64-bit floating-point number but the bit-wise operation is performed on a 32-bit binary number i.e. to perform a bit-operation JavaScript converts the number into a 32-bit binary number (signed) and perform the operation and convert back the result to a 64-bit number.

Bit-wise AND ( & )

It is a binary operator i.e. accepts two operands. Bit-wise AND (&) returns 1 if both the bits are set ( i.e 1) and 0 in any other case.

A	B	  OUTPUT ( A & B )
0	0	       0
0	1	       0
1	0	       0
1	1	       1

Bit-Wise OR ( | )

Accepts two operands. Bit-wise OR ( | ) returns 1 if any of the operands is set (i.e. 1) and 0 in any other case.

A	B	    OUTPUT ( A | B )
0	0	          0
0	1	          1
1	0	          1
1	1	          1

Bit-Wise XOR ( ^ )

Accepts two operands. Bit-wise XOR ( ^ ) returns 1 if both the operands are different and 0 in any other case.

A	B	     OUTPUT ( A ^ B )
0	0	            0
0	1	            1
1	0	            1
1	1 	            0

Bit-Wise NOT ( ~ )

accepts single operands. Bit-wise NOT ( ~ ) flips the bits i.e 0 becomes 1 and 1 becomes 0.

A	   OUTPUT ( ~A )
0	       1
1	       0

Left shift

In the left shift operator <<, the left operand specifies the number and the right operand specifies the number to be shifted left. Zero bits are added to the right and excess bits from the left are discarded.

let a = 8;
let  b = 1;

result = a << b;

// 1 ( 00000000000000000000000000010000 )
console.log(result);

Sign-propagating right shift

In the right shift operator >>, the first operand specifies the number and the second operand specifies the number to be shifted right. Excess bits from the right are discarded. The copies of the leftmost bit are shifted in from the left.

let a = 8;
let b = 1;
// 11111111111111111111111111111101
let c = -3;

result = a >> b;
result1 = c >> b;

// 4 (00000000000000000000000000000100)
console.log(result); 

// -1 (11111111111111111111111111111111)
console.log(result1);

Zero-fill right shift

Zero-fill right shift >>> shifts the operand to the right by filling the zero bits to the left. Excess bits from the right are discarded.

let a = 8;
let b = 1;
let c = -3; 

result = a >>> b;
result1 = c >>> b;

// 4 (00000000000000000000000000000100)
console.log(result);

// 1073741823 (00111111111111111111111111111111)
console.log(result);

Resources:

Interesting use cases for JavaScript bitwise operators - LogRocket Blog

JavaScript Bitwise Operations

JavaScript Bitwise Operators