Bitwise : Using numbers as switches for options and configs.

Here at SupplyHog.com, we have some interesting challenges to solve and try to do so in interesting ways. We already had a working system, but the building supply and hardware space can pose some challenges of their own. I decided to unearth the idea of using bitwise for our local shipping options. We already have options in place that I didn’t want to touch, so I decided to use Bitwise to solve this issue. If you are considering bitwise as a solution, I’m going to assume you know the difference in binary and decimal numbers. With binary numbers, you can consider each bit as a switch for your options.

I set a range between 128 and 255 for the different options. This would be 10000000–11111111 in binary. The 128 (decimal) bit will just indicate the beginning and ending of the range. There’s really no magic there. The other bits will indicate if the option is selected or not. When you think about it, it is a pretty simple concept. Let’s look at an example of this concept in setting crazy shipping options. Here are the available options for our example:

Expedited Shipping : 10000001
Regular Truck : 10000001
Monster Truck : 10000100
U Carry : 10001000
Ninja’s Unload : 10010000
Include Lunch : 10100000
Fully Automated with Robots : 11000000

This example is a bit out of the ordinary. Hey, that’s how I keep it interesting.

Let’s say that someone wanted the following options:

  • Expedited Shipping
  • Delivered by Monster Truck
  • Unloaded by Ninja’s
  • Bring lunch as well

With these selected, the binary would be:

#FYI:Not_Actual_Code
Exp:MT:Ninj:Lun -> 10110101.

In decimal format, this number would be 181. We can save this configuration to our database as an integer. With me so far? How did we get this number? With bitwise operators. Most languages have operators to handle such things. [JS, PHP, Ruby] I will be writing this example in JavaScript and posting on CodePen.

First, we will define our options. They will be the decimal form of the binary above.

var expedited     = 129, // 10000001
regularTruck = 130, // 10000010
monsterTruck = 132, // 10000100
uCarry = 136, // 10001000
ninjaUnload = 144, // 10010000
includeLunch = 160, // 10100000
fullyAutomate = 192; // 11000000

Let’s say we have the following form in our HTML ( I know it is ugly, but there is a CodePen.):

<form id="bitwiseForm" name="bitwiseForm">
<div class="radio">
<label>
<input checked name="expeditedOption" type="radio" value="0"> Nope
</label><br>
<label>
<input name="expeditedOption" type="radio" value="129"> Yes, time machine if you got it.
</label>
</div>
<div class="radio">
<label>
<input checked name="truckOption" type="radio" value="130"> Regular Truck
</label><br>
<label>
<input name="truckOption" type="radio" value="132"> Monster Truck
</label>
</div>
<div class="radio">
<label>
<input checked name="unloadOption" type="radio" value="136"> I'm Strong. I'll Carry.
</label><br>
<label>
<input name="unloadOption" type="radio" value="144"> Ninja's, of course.
</label>
</div>
<div class="radio">
<label>
<input checked name="lunchOption" type="radio" value="0"> I'm on a diet.
</label><br>
<label>
<input name="lunchOption" type="radio" value="160"> Absolutely!
</label>
</div>
<div class="radio">
<label>
<input checked name="automateOption" type="radio" value="0"> No, I like interacting with humans.
</label><br>
<label>
<input name="automateOption" type="radio" value="192"> Yes, how else would you do it?
</label>
</div>
<button class="btn btn-default" type="submit">Calculate</button>
</form>

We will obtain the selections and use the OR (|) bitwise operator to essentially combine the selections down to a single number. The | operator will set the bit to 1 if it is set in at least one of the options.

var selection = expeditedOption | truckOption | unloadOption | lunchOption | automateOption;
// Example: 10000001 | 10000010 | 10000100 would result in 10000111

There is no need to convert to and from binary to use these operators, so we can now save the “selection” to our database or file to retrieve later AS AN INTEGER!!!

To obtain the individual selections back, we use the AND (&) bitwise operator to test against the option. The & operator will only set the outcome value’s bit to 1 if the corresponding bits are both 1. In our case, we have set the options to begin at 128 (10000000). Because of this, we need to subtract 128 from our selection before doing our AND operations. If we didn’t do this, we could not do the operation in a simple if statement.

selection -= 128;
if(selection & ninjaUnload) {
console.log("Ninja's were selected to unload the shipment.");
}
// Example: 0001111 & 0001000 results in 0001000 which is not 0, so the option was selected.
// Example: 0001111 & 0010000 results in 0000000 which is 0, so the option was NOT selected.

That’s all there is to it in using numbers and bitwise operations to save configurations or option selections.

There are many other uses and operators for using bitwise as a solution. If you are using bitwise, please share your experiences, so we can all learn from each other.