Bitwise operators and Logical operators in JavaScript
by Milindi Senevirathne / February 23, 2021
Introduction to JavaScript
JavaScript is a dynamic programming language for computers. It is lightweight and most frequently used as part of web pages whose implementations allow the user to interact with the client side script and build dynamic pages. It is an interpreted programming language with capabilities that are object-oriented.
Bitwise operators
Bitwise operators are used to modify individual bits in an operand. When interpreted as 8 bits, a single byte of computer memory will indicate the true/false status of 8 flags, since each bit can be used as a Boolean variable that can hold one of two values: true or false.
Bit operators operate on numbers of 32 bits. Any numeric operand is translated into a 32 bit number inside the process. The output is translated back to a number in JavaScript.
There are six main bitwise operators are supported to JavaScript.
1. & — AND
2. | — OR
3. ~ — NOT
4. ^ — XOR
5. << -Zero fill left shift
6. >> — Signed right shift
& -AND operator
AND operator compares that first operand with second operand. If both operands are equal to ‘1’, result bit set to ‘1’. And if both operands equal to ‘0’, the result bit set as ‘0’.
a. 0 & 0 = 0
b. 0 & 1 = 0
c. 1 & 0 = 0
d. 1 & 1 = 1
Ex: 5 & 1
0101 & 0001 = 0001 = 1(decimal)
| — OR operator
OR operator compares that first operand with second operand. If first or second operator is equal to ‘1’, the result bit always equal to ‘1’ otherwise ‘0’.
a. 0 |0 = 0
b. 0 |1 = 1
c. 1 |0 = 1
d. 1 |1 = 1
Ex: 4 | 2
0100 | 0010 = 0110 = 6 (decimal)
~ — NOT operator
NOT operand gives result bit as opposite version of current bit. It means that if operand is equal to ‘1’, the result always will be ‘0’.
a. ~0 = 1
b. ~1 = 0
Ex: ~4
~0100 = 1011 = 11(decimal)
The operands are translated and represented by a sequence of bits to 32-bit integers (zeroes and ones). Numbers with more than 32 bits have discarded their most significant bits. For instance, the following integer will be converted to a 32 bit integer with more than 32 bits.
Bitwise NOT any number x yields -(x + 1). For example, ~4 yields -5.
^ — XOR operator
XOR gate gives output as ‘1’ only if both operands are not equal.
a. 0 ^0 = 0
b. 0 ^1 = 1
c. 1 ^0 = 1
d. 1 ^1 = 0
Ex: 4 ^ 3
0100 ^ 0011 = 0111 = 7(decimal)
<< — Zero fill left shift operator
The left shift operator transfers the bits of the number to a given number of positions to the left. For this operator, the symbol is <<. When you write x<<n, the meaning is to move the x bits to the specified positions on the left.
Ex: 5 << 1
0101 << 1 = 1010 = 10(decimal)
>> — Signed right shift operator
The Right Shift Operator moves the bits of the number to a given number of positions to the right. The right shift operator is defined by the >> symbol, read as more than double. When you type x>>n, the meaning is to pass the x-bits to the specified n-positions on the right.
Ex: 5 >> 1
0101 >> 1 = 0010 = 2(decimal)
Logical operators
For Boolean (logical) values, logical operators are usually used; when they are, they return a Boolean value. There are three types of logical operators in JavaScript.
1. && — Logical AND
2. || — Logical OR
3. ! — Logical NOT
However, && and || operators actually return the value of one of the specified operands, so they can return a non-Boolean value if these operators are used for non-Boolean values.
&& — Logical AND operator
If the two expressions are true, the Logical AND operator (&&) returns true, otherwise it returns false.
Ex: Let’s consider x = 4, y = 7;
1. (x < 5 && y > 5)
Ø (x < 5) is ‘true’
Ø (y > 5) is ‘true”
Ø Both sides are ‘true’, so output is also ‘true’
2. (x < 5 && y < 5)
Ø (x < 5) is ‘true’
Ø (y < 5) is ‘false”
Ø Both sides are not ‘true’, so output is ‘false’
|| — Logical OR operator
If either or both expressions are true, the OR operator (||) returns true, otherwise it returns false.
Ex: Let’s consider x = 4, y = 7;
1. (x > 5|| y > 5)
Ø (x > 5) is ‘false’
Ø (y > 5) is ‘true”
Ø One side is ‘true’, so output is also ‘true’
2. (x > 5|| y < 5)
Ø (x >5) is ‘false’
Ø (y < 5) is ‘false”
Ø Both side are ‘false’, so output is also ‘false’
! — Logical NOT operator
The NOT operator (!) returns true for false statements and false for true statements.
Ex: x = 4, y = 7;
1. ! (x > y)
x is not greater than y. So, output should be ‘true’.
Hope readers get some knowledge from this article.
Thank you.
