Bit Manipulation Basics AND OR XOR NOT Left Right Shift in DSA Javascript - Build from Scratch

Bit Manipulation Basics AND OR XOR NOT Left Right Shift

📖 Scenario: You are working with a simple device that stores settings as bits in a number. Each bit can be turned on or off to control different features.To manage these settings, you need to learn how to use bit manipulation operations like AND, OR, XOR, NOT, and bit shifts.

🎯 Goal: Build a small program that uses bit manipulation operations on two numbers to understand how each operation changes the bits.

📋 What You'll Learn

Create two variables with exact values

Create a variable for a bit mask

Use bitwise AND, OR, XOR, NOT, left shift, and right shift operations

Print the results of each operation

💡 Why This Matters

🌍 Real World

Bit manipulation is used in low-level programming, device control, and performance optimization where settings or flags are stored as bits.

💼 Career

Understanding bitwise operations is important for roles in embedded systems, game development, network programming, and systems programming.

1

Create initial numbers for bit manipulation

Create two variables called num1 and num2 with values 13 and 7 respectively.

DSA Javascript

// Your code here
// Create num1 and num2 with values 13 and 7

Hint

Use const to create variables and assign the exact numbers.

2

Create a bit mask for operations

Create a variable called mask and set it to 1 << 2 (which means 1 shifted left by 2 bits).

DSA Javascript

const num1 = 13;
const num2 = 7;
// Create mask as 1 shifted left by 2 bits
// Your code here

Hint

Use the left shift operator << to shift 1 by 2 bits.

3

Apply bitwise operations

Create variables andResult, orResult, xorResult, notResult, leftShiftResult, and rightShiftResult to store the results of applying bitwise AND, OR, XOR between num1 and num2, bitwise NOT on num1, left shift num1 by 2, and right shift num1 by 2 respectively.

DSA Javascript

const num1 = 13;
const num2 = 7;
const mask = 1 << 2;
// Calculate andResult, orResult, xorResult, notResult, leftShiftResult, rightShiftResult
// Your code here

Hint

Use & for AND, | for OR, ^ for XOR, ~ for NOT, << for left shift, and >> for right shift.

4

Print the results of bitwise operations

Print the values of andResult, orResult, xorResult, notResult, leftShiftResult, and rightShiftResult each on a new line using console.log.

DSA Javascript

const num1 = 13;
const num2 = 7;
const mask = 1 > 2;

// Print all results below
// Your code here

Hint

Use console.log to print each result on its own line.

Practice

1. What is the result of the bitwise AND operation between 5 and 3? (5 & 3)

easy

A. 1

B. 7

C. 0

D. 8

Solution

1. Step 1: Convert numbers to binary

   5 in binary is 0101, 3 in binary is 0011.

2. Step 2: Perform bitwise AND

   0101 & 0011 = 0001 (only bits set in both numbers remain set).

3. Final Answer:

   1 -> Option A

4. Quick Check:

   5 & 3 = 1 [OK]

Hint: AND keeps bits set in both numbers only [OK]

Common Mistakes:

• Confusing AND with OR operation
• Not converting numbers to binary before operation
• Assuming decimal addition instead of bitwise

2. Which of the following is the correct syntax for performing a bitwise XOR operation between variables a and b in JavaScript?

easy

A. let result = a | b;

B. let result = a && b;

C. let result = a % b;

D. let result = a ^ b;

Solution

1. Step 1: Identify bitwise XOR operator in JavaScript

   The XOR operator is represented by the caret symbol (^).

2. Step 2: Check syntax correctness

   let result = a ^ b; uses a ^ b, which is the correct syntax for bitwise XOR.

3. Final Answer:

   let result = a ^ b; -> Option D

4. Quick Check:

   XOR operator is ^ in JavaScript [OK]

Hint: XOR uses ^ symbol in JavaScript [OK]

Common Mistakes:

• Using && which is logical AND, not bitwise
• Using | which is bitwise OR, not XOR
• Using % which is modulo, unrelated to bits

3. What will be the output of the following JavaScript code?

let x = 8; // binary 1000
let y = x >> 2;
console.log(y);

medium

A. 2

B. 4

C. 1

D. 0

Solution

1. Step 1: Understand right shift operation

   Right shift by 2 means move bits 2 places to the right, dropping the rightmost bits.

2. Step 2: Apply right shift on binary 1000

   1000 >> 2 becomes 0010, which is decimal 2.

3. Final Answer:

   2 -> Option A

4. Quick Check:

   8 >> 2 = 2 [OK]

Hint: Right shift divides by 2 for each shift [OK]

Common Mistakes:

• Confusing right shift with left shift
• Not converting binary to decimal after shift
• Assuming shift adds zeros on left without dropping bits

4. Find the error in the following code snippet that attempts to flip all bits of a number n using bitwise NOT:

let n = 5;
let flipped = ~n;
console.log(flipped);

What is the issue?

medium

A. Missing parentheses around ~n

B. Bitwise NOT returns a negative number due to two's complement representation

C. Variable n must be a string for bitwise NOT

D. Bitwise NOT operator (~) is not supported in JavaScript

Solution

1. Step 1: Understand bitwise NOT in JavaScript

   Bitwise NOT flips all bits and returns the two's complement negative number.

2. Step 2: Explain why output is negative

   For 5 (00000101), ~5 flips bits to 11111010 which is -6 in two's complement.

3. Final Answer:

   Bitwise NOT returns a negative number due to two's complement representation -> Option B

4. Quick Check:

   ~n flips bits and returns negative number [OK]

Hint: Bitwise NOT flips bits and returns negative in JS [OK]

Common Mistakes:

• Expecting positive flipped bits as output
• Thinking ~ is unsupported operator
• Assuming input must be string for bitwise ops

5. You want to set the 3rd bit (0-indexed from right) of a number num to 1 without changing other bits. Which expression correctly does this in JavaScript?

hard

A. num = num ^ (1 << 3);

B. num = num & (1 << 3);

C. num = num | (1 << 3);

D. num = num << 3;

Solution

1. Step 1: Understand setting a bit using OR and shift

   Left shift 1 by 3 gives 00001000, which targets the 3rd bit.

2. Step 2: Use OR to set the bit without changing others

   OR with this mask sets the 3rd bit to 1, keeping others unchanged.

3. Final Answer:

   num = num | (1 << 3); -> Option C

4. Quick Check:

   Use OR with shifted 1 to set bit [OK]

Hint: Use OR with (1 << bit_position) to set bit [OK]

Common Mistakes:

• Using AND which clears bits instead of setting
• Using XOR which toggles bits and may unset
• Using left shift alone which changes number value