What are Bitwise Operators in JavaScript?
In this blog post, we will learn about bitwise operators in JavaScript. If you are new to programming, don't worry! We will try to explain everything in simple terms and provide examples to help you understand better.
Table of Contents
- Bitwise AND
- Bitwise OR
- Bitwise XOR
- Bitwise NOT
- Left Shift
- Sign-propagating Right Shift
- Zero-fill Right Shift
1. What are Bitwise Operators?
Bitwise operators are special operators in JavaScript that perform operations directly on the binary (base-2) representation of numbers. In other words, they work with the individual bits (the smallest unit of data in a computer) that make up a number.
Before we dive into the details, let's quickly understand the concept of binary numbers. In the decimal (base-10) number system, we have ten digits (0-9). However, in the binary (base-2) number system, we only have two digits: 0 and 1. Each digit in a binary number is called a bit.
For example, the number 7 in binary is represented as 0111
. Here, we have four bits, and each bit is either 0 or 1.
Now that we understand binary numbers let's see how bitwise operators work with them.
2. Types of Bitwise Operators
JavaScript has seven bitwise operators:
- Bitwise AND (
&
) - Bitwise OR (
|
) - Bitwise XOR (
^
) - Bitwise NOT (
~
) - Left Shift (
<<
) - Sign-propagating Right Shift (
>>
) - Zero-fill Right Shift (
>>>
)
Let's understand each of these operators with examples.
2.1 Bitwise AND
Bitwise AND (&
) is a binary operator that takes two numbers as operands and performs a logical AND operation on each pair of corresponding bits in their binary representation.
Here's how it works:
- If both bits are 1, the result is 1.
- Otherwise, the result is 0.
Let's consider an example. We will perform a bitwise AND on the numbers 5 and 3:
5: 0101 (in binary)
3: 0011 (in binary)
Performing the bitwise AND operation, we get:
0101
& 0011
------
0001 (in binary) = 1 (in decimal)
So, 5 & 3
equals 1.
console.log(5 & 3); // Output: 1
2.2 Bitwise OR
Bitwise OR (|
) is another binary operator that takes two numbers as operands and performs a logical OR operation on each pair of corresponding bits in their binary representation.
Here's how it works:
- If at least one of the bits is 1, the result is 1.
- Otherwise, the result is 0.
Let's perform a bitwise OR on the numbers 5 and 3:
5: 0101 (in binary)
3: 0011 (in binary)
Performing the bitwise OR operation, we get:
0101
| 0011
------
0111 (in binary) = 7 (in decimal)
So, 5 | 3
equals 7.
console.log(5 | 3); // Output: 7
2.3 Bitwise XOR
Bitwise XOR (^
) is a binary operator that takes two numbers as operands and performs a logical XOR (exclusive OR) operation on each pair of corresponding bits in their binary representation.
Here's how it works:
- If the bits are different, the result is 1.
- If the bits are the same, the result is 0.
Let's perform a bitwise XOR on the numbers 5 and 3:
5: 0101 (in binary)
3: 0011 (in binary)
Performing the bitwise XOR operation, we get:
0101
^ 0011
------
0110 (in binary) = 6 (in decimal)
So, 5 ^ 3
equals 6.
console.log(5 ^ 3); // Output: 6
2.4 Bitwise NOT
Bitwise NOT (~
) is a unary operator that takes a single number as its operand and inverts (flips) all the bits in its binary representation.
Here's how it works:
- If the bit is 1, it becomes 0.
- If the bit is 0, it becomes 1.
Let's perform a bitwise NOT on the number 5:
5: 0101 (in binary)
Performing the bitwise NOT operation, we get:
~0101
------
1010 (in binary) = -6 (in decimal)
So, ~5
equals -6.
console.log(~5); // Output: -6
You might be wondering why the result is -6 instead of 10. This is because JavaScript uses a system called two's complement to represent negative numbers in binary. In this system, the leftmost bit (also known as the most significant bit) is the sign bit. If the sign bit is 1, the number is negative; if it is 0, the number is positive.
2.5 Left Shift
Left Shift (<<
) is a binary operator that takes two numbers as operands. It shifts the bits of the first number (the left operand) to the left by the number of positions specified