Bit Manipulation Basics AND OR XOR NOT Left Right Shift in DSA Typescript - Execution Trace

Concept Flow - Bit Manipulation Basics AND OR XOR NOT Left Right Shift

Start with two numbers

↓

Apply AND (&)

→Result: bits set only if both bits are 1

↓

Apply OR (|)

→Result: bits set if any bit is 1

↓

Apply XOR (^)

→Result: bits set if bits differ

↓

Apply NOT (~)

→Result: bits flipped

↓

Apply Left Shift (<<)

→Result: bits shifted left, zeros fill right

↓

Apply Right Shift (>>)

→Result: bits shifted right, sign bit fills left

↓

End with final results

Start with two numbers and apply bitwise operations AND, OR, XOR, NOT, Left Shift, and Right Shift step-by-step to see how bits change.

Execution Sample

DSA Typescript

let a = 5;  // 0101 in binary
let b = 3;  // 0011 in binary
console.log(a & b);  // AND
console.log(a | b);  // OR
console.log(a ^ b);  // XOR
console.log(~a);     // NOT
console.log(a << 1); // Left Shift
console.log(a >> 1); // Right Shift

This code applies bitwise AND, OR, XOR, NOT, left shift, and right shift on two numbers 5 and 3.

Execution Table

Step	Operation	Input Values (a, b)	Bitwise Operation	Result (decimal)	Result (binary)
1	AND (&)	a=5 (0101), b=3 (0011)	0101 & 0011	1	0001
2	OR (|)	a=5 (0101), b=3 (0011)	0101 | 0011	7	0111
3	XOR (^)	a=5 (0101), b=3 (0011)	0101 ^ 0011	6	0110
4	NOT (~)	a=5 (0101)	~0101	-6	11111111111111111111111111111010 (32-bit two's complement)
5	Left Shift (<<)	a=5 (0101)	0101 << 1	10	1010
6	Right Shift (>>)	a=5 (0101)	0101 >> 1	2	0010
7	End	-	-	-	-

💡 All bitwise operations completed on inputs a=5 and b=3.

Variable Tracker

Variable	Start	After AND	After OR	After XOR	After NOT	After Left Shift	After Right Shift	Final
a	5 (0101)	5 (0101)	5 (0101)	5 (0101)	5 (0101)	5 (0101)	5 (0101)	5 (0101)
b	3 (0011)	3 (0011)	3 (0011)	3 (0011)	3 (0011)	3 (0011)	3 (0011)	3 (0011)
result	-	1 (0001)	7 (0111)	6 (0110)	-6 (11111111111111111111111111111010)	10 (1010)	2 (0010)	2 (0010)

Key Moments - 3 Insights

Why does NOT (~) of 5 result in -6 instead of a positive number?

Because NOT flips all bits including the sign bit in two's complement representation, resulting in -6 as shown in step 4 of the execution_table.

Why does left shift (<<) multiply the number by 2?

Left shift moves bits to the left, adding a zero on the right, effectively doubling the number as seen in step 5 where 5 << 1 becomes 10.

Why does right shift (>>) of 5 result in 2 and not 2.5?

Right shift moves bits to the right, dropping the least significant bit, which is integer division by 2, so 5 >> 1 equals 2 as in step 6.

Visual Quiz - 3 Questions

Look at the execution_table at step 3, what is the binary result of XOR operation?

A 0110

B 0001

C 0111

D 1010

💡 Hint

Check the 'Result (binary)' column for step 3 in execution_table.

At which step does the result become negative due to bitwise operation?

A Step 2

B Step 4

C Step 5

D Step 6

💡 Hint

Look for negative decimal values in the 'Result (decimal)' column in execution_table.

If we change 'a' from 5 to 4, what would be the result of 'a & b' at step 1?

A 0

B 1

C 4

D 5

💡 Hint

Perform bitwise AND of 4 (0100) and 3 (0011) and check the result.

Concept Snapshot

Bit Manipulation Basics:
- AND (&): sets bit if both bits are 1
- OR (|): sets bit if any bit is 1
- XOR (^): sets bit if bits differ
- NOT (~): flips all bits (two's complement)
- Left Shift (<<): shifts bits left, multiplies by 2
- Right Shift (>>): shifts bits right, divides by 2 (integer)

Full Transcript

This lesson shows how to use basic bitwise operations on two numbers. We start with numbers 5 and 3, represented in binary. We apply AND, OR, XOR, NOT, left shift, and right shift operations step-by-step. Each operation changes bits in a specific way. AND keeps bits set only if both bits are 1. OR sets bits if any bit is 1. XOR sets bits if bits differ. NOT flips all bits, which can produce negative numbers due to two's complement. Left shift moves bits left, doubling the number. Right shift moves bits right, halving the number by dropping the least significant bit. The execution table tracks each step's input, operation, and result in decimal and binary. Variable tracker shows how variables change after each operation. Key moments clarify common confusions about negative results and shifts. The quiz tests understanding of bit results and effects of changing inputs.

Practice

1. What is the result of the bitwise AND operation between 5 and 3? (5 = 0101, 3 = 0011 in binary)

easy

A. 1

B. 7

C. 6

D. 0

Solution

1. Step 1: Convert numbers to binary

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

2. Step 2: Perform bitwise AND operation

   0101 AND 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 operation

2. Which of the following is the correct TypeScript syntax to perform a bitwise XOR between variables a and b?

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 TypeScript

   The bitwise XOR operator is the caret symbol (^).

2. Step 2: Check each option for correct syntax

   let result = a ^ b; uses ^ correctly. let result = a && b; uses logical AND (&&), let result = a | b; uses bitwise OR (|), let result = a % b; uses modulus (%).

3. Final Answer:

   let result = a ^ b; -> Option D

4. Quick Check:

   Bitwise XOR uses ^ operator [OK]

Hint: XOR operator is ^ in TypeScript [OK]

Common Mistakes:

• Using logical operators instead of bitwise
• Confusing OR (|) with XOR (^)
• Using modulus operator (%) by mistake

3. What is the output of the following TypeScript code?

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

medium

A. 0

B. 2

C. 1

D. 4

Solution

1. Step 1: Understand right shift operation

   Right shift (>>) moves bits to the right by the specified number, dropping rightmost bits.

2. Step 2: Apply right shift to 8 (1000 binary)

   Shifting 1000 right by 2 bits gives 0010 binary, which is 2 in decimal.

3. Final Answer:

   2 -> Option B

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. Identify the error in this TypeScript code snippet:

let a = 5;
let b = 3;
let c = a <<< b;
console.log(c);

medium

A. <<< is not a valid bitwise operator

B. Variables a and b must be strings

C. Missing semicolon after variable declarations

D. Bitwise operators cannot be used with let variables

Solution

1. Step 1: Check the bitwise operators in TypeScript

   Valid bitwise shift operators are << (left shift) and >> (right shift). There is no <<< operator.

2. Step 2: Identify the invalid operator usage

   The code uses <<< which is invalid syntax and will cause an error.

3. Final Answer:

   <<< is not a valid bitwise operator -> Option A

4. Quick Check:

   Only << and >> are valid shift operators [OK]

Hint: Use only << or >> for shifts, not <<< or >>> [OK]

Common Mistakes:

• Using triple shift operator like in some other languages
• Assuming semicolons are mandatory for correctness
• Thinking bitwise operators require specific variable types

5. Given n = 29 (binary 11101), which expression will toggle the 3rd bit (counting from 0 at right) using bitwise XOR in TypeScript?
Choose the correct code snippet.

hard

A. let result = n | (1 << 3);

B. let result = n & (1 << 3);

C. let result = n ^ (1 << 3);

D. let result = ~n ^ (1 << 3);

Solution

1. Step 1: Understand toggling a bit with XOR

   XOR with 1 flips the bit; XOR with 0 leaves it unchanged.

2. Step 2: Create mask for 3rd bit

   1 << 3 shifts 1 to the 3rd bit position (binary 1000).

3. Step 3: Apply XOR to toggle the bit

   n ^ (1 << 3) flips the 3rd bit of n.

4. Final Answer:

   let result = n ^ (1 << 3); -> Option C

5. Quick Check:

   XOR with mask toggles bit [OK]

Hint: XOR with 1 at bit toggles it, 0 leaves it same [OK]

Common Mistakes:

• Using AND or OR instead of XOR to toggle bits
• Incorrect bit position shift
• Using NOT operator incorrectly with XOR