Bitwise Operators Part 8

Yes, it’s taking too long, but, better shorter posts than the long ones, am I right? I hope so!

In this post, we’ll start clearing all data. It’s important when you’re testing your implementations.

The clearAllData method

Here is straight forward! We already coded the clearData() in our localStateManager, so, let’s call it, and then, set the currentState to its initial status.

  clearAllData() {
    currentState.stateName = "";
    currentState.value = -1;

Now, let’s call it in our index viewmodel:

import { StateManager } from '../businessLogic/stateManager.js';

const sm = new StateManager();



sm.currentState = 'MyFrstState';

console.log('The current state:', sm.currentState);

Let’s test it!

All clear!

The log is related to line 32 of the localStoreManager.js and it will write true if the length of the array keys is zero.

Line 34

Now you can reload the page without errors!

Moving forward, now it’s time to create our Bitwise Or Rule!

The createBitwiseOrRule method

This method will expect as an argument a rule name and a state array to create the rule.

Let’s imagine we have these data:

const name = "rule01";
const stateArray = ["stateA", "stateC"];

We will retrieve all data stored at the localStore, iterate through the stateArray trying to find a rule with the same name in the localStore object.

A variable named value will receive the value | the object value! Once finish the iteration, we’ll save the rule.

Confusing? Wait!

This is the new method:

createBitwiseOrRule(ruleName, stateArray) {
  let value = undefined;

  const lsObject = lsManager.getObject();
  stateArray.forEach(memberName => {
    const obj = JSON.parse(lsObject[memberName]);
    if (obj.type === 'state') {
      value = value | obj.value;

  lsManager.saveObject(ruleName, JSON.stringify({ type: 'rule', value }));


Let’s create our first rule which means, the future comparison using the Bitwise AND will be true if the current state is ‘MyFrstState’ OR ‘MyThrdState’.

We’ll pass as arguments the values ‘frstOrThrd’ as the rule name and [‘MyFrstState’, ‘MyThrdState’] as the allowed states.

sm.createBitwiseOrRule('frstOrThrd', ['MyFrstState', 'MyThrdState']);

In the function, now you can see the parameters received.

An object with all data is retrieved, and we’ll start iterate through the stateArray, parse the data, check if the type is a state and, if is true, use the value OR the obj.value.

Let’s recap? You can write this code (highlighted) line by line in the console of your browser to check:

let value = undefined | 1
value will be: 1
value = value | 4
value will be: 5
1 | 4

After the first iteration, the value will be One;

This is the second iteration;

The value will be five, after the second pass.

You’ll will ask me: there are three states, and in the example we’ve got the first and the third and the object have three items!

Remember: we are iterating only through the stateArray, which has two items!

Next post, we’ll code che rule check using the Bitwise AND to test something like this:

Current State: MyFrstState (value 1)
Rule to check: frstOrThrd (value 5)
1 & 5 is 1, or, is 'truethy'!

Current State: MyScndState (value 2)
Rule to check: frstOrThrd (value 5)
2 & 5 is 0, or, is 'falsy'!

Stay tuned and, Happy Coding!

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s