Bitwise Operators in Typescript

Bitwise operators convert their operands into binary numbers and operate on each bit. There are several operators available Bitwise AND (&), Bitwise OR (|), Bitwise XOR (^), Bitwise NOT (~), Left Shift (<<), Sign-propagating right shift (>>), and Zero-fill right shift (>>>).

Bitwise operators & Binary numbers

Bitwise operators operate on Binary numbers, i.e., zeros & ones. Hence it is essential to understand how they are stored to understand the Bitwise operators

A binary number is a number expressed in the base-2 numeral system or binary numeral system. It uses 0 (zero) and 1 (one) to represent the numbers.

For Example, the number 20 is represented as follows in the binary system

You can convert a decimal number to a binary number using the toString method and passing the 2 as the radix.

In Typescript, numbers are represented as the 64 bit floating point numbers. But when we use the Bitwise Operators, it converts them to 32-bit signed integers, performs the Bitwise operations, and converts them back to floating-point representation.

Signed 32-bit integers use the first bit to store the sign, and the remaining 31 bits to represent the numeric value of the integer. Hence number 20 in signed 32-bit binary is represented as below.

Since the most significant bit (leftmost) is the sign bit, which gives you only 31 bits for the number value. Hence the max value that can use with the Bitwise operators is 2147483647, above which you will not get the correct results.

Negative Numbers

The positive number is stored in a true binary format. But Negative numbers are stored in a format called two’s complement.

To get the two’s complement of an integer,

1. Write out the positive number in binary
2. Invert the digits
3. Add one to the result.

For Example to get the number 20, start with binary representation of 20

Invert the digits

Add 1 to the result

The result is how -20 is stored as binary number in two complement

You can refer to the Binary to the Decimal converter to check the result. Make sure to choose the signed 32 bit in the dropdown.

If the number has more than 32-bit integers get their most significant bits discarded. For example, the following integer with more than 32 bits will be converted to a 32-bit integer

Bitwise AND &

The Bitwise AND operator accept two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are 1, then it returns 1, else returns 0. The following table shows how the digits are compared

Example

Bitwise OR |

The Bitwise OR operator accepts two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are 0, then it returns 0, else returns 1. The following table shows how the digits are compared

Example

Bitwise XOR ^

The Bitwise XOR operator accepts two operands. It compares each binary digit of the left operand with the digit at the corresponding position in the right operand. If both the bits are different then it returns 1, else 0. The following table shows how the digits are compared

Examples

Bitwise NOT ~

Bitwise NOT ~ is a unary operator, hence takes only one operand. It just flips the binary digits from 1 to 0 & 0 to 1.

Left Shift <<

The left Shift operator shift (<<) the specified number of digits of the first operand to the left. The right operand specifies the number of digits to shift

Syntax

• The bits are shifted to the left
• Excess bits shifted off to the left are discarded
• Zero bits are added from the right

Example

Right shift >>

The Right Shift operator (>>) shifts the specified number of digits of the first operand to the right. The right operand specifies the number of digits to shift

• The bits are shifted to the right
• Excess bits shifted off to the right are discarded
• Copy of the leftmost bit is added to the left. The leftmost bit is the sign bit. The +ve numbers have 0 as their left most bit, and -ve numbers have 1 as their left most bit. Hence they preserve their sign.

Unsigned right shift >>>

The Unsigned right Shift (also known as zero-fill right shift) operator (>>>) shift the specified number of digits of the first operand to the right. The right operand specifies the number of digits to shift

• The bits are shifted to the right
• Excess bits shifted off to the right are discarded
• Zero bits are added from the left. Hence the the sign bit becomes 0, so the result is always non-negative

Bitwise assignment operators

Bitwise Assignment operators assign values to a Typescript variable after performing the bitwise operation between the variable & the right operand.

Example

List of Bitwise assignment Operators

• &= (bitwise AND assignment)
• |= (bitwise OR assignment)
• ^= (bitwise XOR assignment)
• <<= (bitwise left shift and assignment)
• >>= (bitwise right shift and assignment)
• >>>= (bitwise unsigned right shift and assignment)

Reference

1. Expressions & Operators
2. Precedency & Associativity

Read More

1. Complete Typescript Tutorial
2. Typescript Operators
3. Arithmetic Operators
4. Unary plus / Unary minus Operators
5. Increment/Decrement Operators
6. Comparison / Relational Operators
7. Equality Operator / Strict Equality Operators
8. Ternary Conditional Operators
9. Logical Operators
10. Bitwise Operators
11. Assignment Operators
12. Nullish coalescing operator
13. Comma Operator in Typescript
14. Operator Precedence