Bitwise Operators in JavaScript

bitwise operators in javascript

Bitwise operators work with binary data at the bit level in JavaScript. They process numbers in binary form and return a new number after applying a specific bit rule.

What are Bitwise Operators in JavaScript

Bitwise operators are symbols that act on the binary form of numbers. JavaScript changes each number into a 32-bit integer and runs the operation on each bit.

When JavaScript runs a bitwise operation, it first changes the number to binary. It compares bits from two numbers or flips bits from one number. It then changes the result back to decimal.

Here is a quick example:

let a = 5;  // binary: 0101
let b = 3;  // binary: 0011
let result = a & b; // binary: 0001 => decimal: 1
console.log(result);

In this example, the & operator compares each bit. If both bits are 1, the result bit is 1. Only the last bit matches, so the result is 1.

Here are the reasons to use the bitwise operator in JavaScript:

  • Work with low-level data control in graphics or encryption.
  • Improve speed in some math operations.
  • Pack or unpack multiple values inside one number.

Type of Bitwise Operators in JavaScript

Bitwise AND (&) returns 1 in each bit position only when both bits are 1, otherwise 0. Here is an example:

let result = 5 & 3;  
console.log(result); // 1
  • 5 in binary: 0101
  • 3 in binary: 0011
  • Compare each bit: only the last bit is 1 in both → 0001 (which is 1 in decimal).

Bitwise OR (|) returns 1 in a bit position when at least one of the bits is 1. For example:

let result = 5 | 3;  
console.log(result); // 7
  • 5 → 0101
  • 3 → 0011
  • Bit-by-bit: 0111 → decimal 7.

Bitwise XOR (^) returns 1 when the bits are different, returns 0 when they are the same. Here is an example:

let result = 5 ^ 3;  
console.log(result); // 6
  • 5 → 0101
  • 3 → 0011
  • Compare: 0110 → decimal 6.

Bitwise NOT (~) flips each bit — 1 becomes 0, and 0 becomes 1. Here is an example:

let result = ~5;  
console.log(result); // -6
  • 5 in binary (32-bit signed): 00000000000000000000000000000101
  • Flipped: 11111111111111111111111111111010 → This is -6 in two’s complement form.

Bitwise left shift (<<) moves all bits to the left by the given number of positions. Fills the empty right bits with 0.

For example:

let result = 5 << 1;  
console.log(result); // 10
  • 5 → 0101
  • Shift left 1 place: 1010 → decimal 10.
  • This is the same as when you multiply by 2 once.

Bitwise right shift (>>) moves all bits to the right. It keeps the sign bit (for negative numbers).

For example:

let result = 5 >> 1;  
console.log(result); // 2
  • 5 → 0101
  • Shift right 1 place: 0010 → decimal 2.

For negative numbers:

console.log(-5 >> 1); // -3

The sign bit is preserved, so it rounds toward negative infinity.

Zero-fill right shift (>>>) moves bits to the right and fills the left with 0. It does not keep the sign bit.

let result = -5 >>> 1;  
console.log(result); // 2147483645
  • -5 in 32-bit binary: 11111111111111111111111111111011
  • Shift right 1, fill left with 0: 01111111111111111111111111111101 → decimal 2147483645.

The Difference Between Bitwise and Logical Operators

Bitwise operators look at the binary bits of a number and do calculations on each bit. The result is always another number. While the logical operators work with true or false values. They return true or false based on the logic you apply.

Here is a table that shows you the key differences for each one:

FeatureBitwise OperatorLogical Operator
Data type usedWorks on numbersWorks on Boolean values
Level of operationBit levelLogical condition
Result typeNumberBoolean
Symbol examples&, |, ^, ~, <<, >>, >>>&&, ||, !

Bitwise operators can be used to check or set bits in binary values. Logical operators are used to control program flow with conditions.

Examples

Mask Bits:

let flags = 13; // binary: 1101
let mask = 4;   // binary: 0100
let result = flags & mask;
console.log(result);

This example uses & to check if a specific bit is set. It checks if the third bit from the right is on. The output 4 means the bit is on.

Toggle Bits:

let value = 9;   // binary: 1001
let toggle = 5;  // binary: 0101
let result = value ^ toggle;
console.log(result); // 12

The ^ operator flips bits where the mask has 1. This changes the first and third bits in the binary form of the number.

Fast Multiplication by 2:

let num = 7;
let result = num << 1;
console.log(result); //14

The << operator moves bits to the left. Each left shift by 1 doubles the number. So 7 becomes 14 after one shift.

Force Unsigned Integer:

let num = -5;
let result = num >>> 0;
console.log(result); // 4294967291

This uses >>> to change a signed number into an unsigned 32-bit integer. The result is a large positive number that holds the same bit pattern.

Wrapping Up

In this article, you learned what bitwise operators in JavaScript are and how they work on binary data. You also understood the types of them.

Here is a quick recap:

  • Bitwise operators work on the binary bits inside a number.
  • You can use them in many tasks, such as:
    • Masks
    • Toggles
    • Shifts
    • Low-level data control

FAQs

How do bitwise operators work in JavaScript?

Bitwise operators work on 32-bit signed integers. JavaScript converts numbers to binary before the operation.
  • & - Bitwise AND
  • | - Bitwise OR
  • ^ - Bitwise XOR
  • ~ - Bitwise NOT
Example:

let a = 5;    // 0101
let b = 3;    // 0011
console.log(a & b); // 1 (0001)

What is the difference between bitwise AND and OR in JavaScript?

Bitwise AND (&) returns 1 only if both bits are 1. Bitwise OR (|) returns 1 if at least one bit is 1. Example:

let x = 6; // 0110
let y = 3; // 0011
console.log(x & y); // 2  (0010)
console.log(x | y); // 7  (0111)

How does the bitwise NOT (~) operator work in JavaScript?

Bitwise NOT (~) inverts all bits. It changes 0 to 1 and 1 to 0. In JavaScript, it also flips the sign due to two's complement. Example:

let num = 5; // 00000000000000000000000000000101
console.log(~num); // -6

How to use bitwise shift operators in JavaScript?

Bitwise shifts move bits left or right:
  • << - Left shift
  • >> - Right shift with sign
  • >>> - Right shift zero-fill
Example:

let n = 2; 
console.log(n << 1); // 4 (shift left)
console.log(n >> 1); // 1 (shift right)
console.log(n >>> 1); // 1 (zero-fill right)

Similar Reads

JavaScript Math atan: Arc Tangent of a Number in Radians

Math.atan() function in JavaScript helps you to solve math problems in your code. It turns a number into an angle.…

Math.sign in JavaScript: Check Number Signs

JavaScript includes Math.sign to find out if a number is positive. It also helps detect negative values or zero. It…

JavaScript Logical Operators with Examples

Logical operators in JavaScript let you check conditions and combine multiple checks in your code. In this guide, you will…

JavaScript Popup Boxes: How they Works with Examples

JavaScript uses popup boxes to show quick messages or ask for direct input. These boxes stop the flow of the…

Top 5 Code Editors: The Best IDE for JavaScript

If you are a coder, one of your primary requirements is to have a trustworthy code- editor. A Code editor…

JavaScript Math.random() Returns Numbers 0–1

Math.random() gives a number between 0 and 1 in JavaScript. It helps create random values for colors or other data.…

JavaScript Garbage Collection: How it Works with Examples

JavaScript removes unused memory blocks with garbage collection. It frees memory space so programs run without leaks. What is JavaScript…

Math.cbrt in JavaScript: How to Finds Cube Roots

JavaScript added Math.cbrt to solve cube roots. Before that, developers used custom code or Math.pow with 1/3. It works with…

Flatten an Array in JavaScript: Use flat() to Handle Nested Arrays

Arrays often hold other arrays. This happens with API responses, form data, or nested objects. These layers add extra steps…

JavaScript this Keyword: How It Works in Depth with Examples

The this keyword links code, context, and object reference in JavaScript. You can use it to refer to the owner…

Previous Article

HTML sup Tag: How to Add Superscript in Web Pages

Next Article

PHP array_diff_assoc: How to Compare Arrays with Keys

Write a Comment

Leave a Comment

Your email address will not be published. Required fields are marked *


Subscribe to Get Updates

Get the latest updates on Coding, Database, and Algorithms straight to your inbox.
No spam. Unsubscribe anytime.