What do these JavaScript bitwise operators do?

Question

• x <<= y (x = x << y)
• x >>= y (x = x >> y)
• x >>>= y (x = x >>> y)

Answer 1

Here is an attempt to make things simple for the very beginner.

Prerequisites

You have to be familiar with the binary number system (numbers made of two digits). If you are not then check this link first: https://www.mathsisfun.com/binary-number-system.html. Just in case the previous link breaks, this answer may help a little: https://stackoverflow.com/a/32155850/1636522.

Indeed, in order to figure out how these operators work, you need to know which bit sequence is behind the numbers involved in the operation. After that you should be able to understand the following stuffs.

Reminder

Decimal digits and their binary notations:

0    0 | 5  101
1    1 | 6  110
2   10 | 7  111
3   11 | 8 1000
4  100 | 9 1001

What do >>>, >> and << do?

These operators shift a bit sequence to the left or to the right.

 decimal | binary      decimal | binary 
---------|---------   ---------|---------
       9 |    1001           2 |      10
    >> 2 | >>    2        << 2 | <<    2
     = 2 |  =   10         = 8 |  = 1000

What do &, | and ^ do?

These operators combine the bits of two numbers to create a new number.

 decimal | binary     decimal | binary     decimal | binary
---------|--------   ---------|--------   ---------|--------
       5 |    101           5 |    101           5 |    101
     & 6 |  & 110         | 6 |  | 110         ^ 6 |  ^ 110
     = 4 |  = 100         = 7 |  = 111         = 3 |  = 011

How does & work?

For each pair of bits: If at least one of the two bits is 0, the resulting bit is 0. If none of the two bits is 0, the resulting bit is 1.

  101    bit 3 | bit 2 | bit 1
& 110   -------|-------|-------
= 100      1   |   0   |   1
           &   |   &   |   &
           1   |   1   |   0
           =   |   =   |   =
           1   |   0   |   0

How does | work?

For each pair of bits: If at least one of the two bits is 1, the resulting bit is 1. If none of the two bits is 1, the resulting bit is 0.

  101    bit 3 | bit 2 | bit 1
| 110   -------|-------|-------
= 111      1   |   0   |   1
           |   |   |   |   |
           1   |   1   |   0
           =   |   =   |   =
           1   |   1   |   1

How does ^ work?

For each pair of bits: If the two bits are different, the resulting bit is 1. If the two bits are the same, the resulting bit is 0.

  101    bit 3 | bit 2 | bit 1
^ 110   -------|-------|-------
= 011      1   |   0   |   1
           ^   |   ^   |   ^
           1   |   1   |   0
           =   |   =   |   =
           0   |   1   |   1

Answer 2

Bitwise Operators

Answer 3

<<, >>

Bit shift left and right, respectively. If you imagine the left operand as a binary sequence of bits, you are shifting those to the left or right by the number of bits indicated by the right operand.

&, ^, |

These are bitwise and, xor, and or, respectively. You can think of & and | as the counterparts to && and ||, except that they will treat their operands as bit vectors, and perform the logical operations on each of the bits. There is no ^^ operator, but this operation is "xor" or "exclusive or". You can think of "a xor b" as "a or b, but not both".