Visual bit-shifting

December 27, 2012

I find it very interesting that you can draw patterns with bits that make up a 32bit integer and then move them around by some simple bit shifting.

Select some cells in the grid below and see how the integer value changes as you move the bits around

8 bit
16 bit
24 bit
32 bit

 

I did have some trouble when I was shifting the most significant bit (first cell in lower row) which led me to ask this question on Stack Overflow:

Why does 0x80000000 >> 1 in JavaScript produce a negative value?

As you can see from the accepted answer I was using the >> operand which performs an arithmetic shift Changing the operand to >>> solved the issue as in this case I needed to perform a logical shift