Work with binary option flags (flipping bits)
|= bitwise or&= bitwise and~= not, negation<=>= “if and only if”, aka left and right are both true under same conditions.setorsetting a flagmeans we want the flag to be 1.unset/clearorclearing a flagmeans we want it to be 0.
1) Set options
Set all 3 options: OPTION_1 | OPTION_2 | OPTION_3.
For example: 001 | 010 | 100 = 111, so all 3 options are set.
Or, set a new option and add it to the current options: CURRENT_OPTIONS | NEW_OPTION.
For example, if the 1st/2nd bit options are already set and we want to also set the 3rd bit option: 011 | 100 = 111.
2) Unset options
CURRENT_OPTIONS & ~OPTION_1.
For example: 101 & ~001 <=> 101 & 100 = 100.
We get he same result even if OPTION_1 is not already set. For example, 100 & ~001 <=> 100 & 100 = 100.
3) Check if an option is set
See if OPTION_2 is set: CURRENT_OPTIONS & OPTION_2.
For example: 101 & 010 = 000 (falsey, not set), or 110 & 010 = 010 (OPTION_2, truthy and set).
The above means that you can use it inside an if control flow: if (CURRENT_OPTIONS & OPTION_1) {}. If it’s not set, it will be 0, if it’s not set it will be truthy and equal to OPTION_1.
Other things to read
Popular
- Reveal animations on scroll with react-spring
- Gatsby background image example
- Extremely fast loading with Gatsby and self-hosted fonts