Binary & Base Conversion: Bitwise Ops to Encoding

Number System Fundamentals

The Four Common Bases

Base	Radix	Digits	Prefix	Example
Binary	2	0,1	`0b`	`0b1010` = 10
Octal	8	0-7	`0o`	`0o12` = 10
Decimal	10	0-9	None	`10`
Hexadecimal	16	0-9,A-F	`0x`	`0xA` = 10

Conversion Methods

Any base → decimal

Binary 1010 → 1×2³ + 0×2² + 1×2¹ + 0×2⁰ = 8 + 0 + 2 + 0 = 10
Hex FF → 15×16¹ + 15×16⁰ = 240 + 15 = 255

Decimal → any base

10 → binary:
10 ÷ 2 = 5 remainder 0
5 ÷ 2 = 2 remainder 1
2 ÷ 2 = 1 remainder 0
1 ÷ 2 = 0 remainder 1
Read bottom to top: 1010

255 → hexadecimal:
255 ÷ 16 = 15 remainder 15
15 ÷ 16 = 0 remainder 15
Read bottom to top: FF

Base Conversion in JavaScript

// parseInt converts to decimal
parseInt('1010', 2)    // 10
parseInt('FF', 16)     // 255
parseInt('12', 8)      // 10

// toString converts to the target base
(10).toString(2)       // "1010"
(255).toString(16)     // "ff"
(255).toString(8)      // "377"

// Literals
0b1010   // 10
0o12     // 10
0xFF     // 255

Bitwise Operations in Practice

The Six Bitwise Operators

Operation	Symbol	Example	Result
AND	`&`	`0b1100 & 0b1010`	`0b1000` (8)
OR	`\|`	`0b1100 \| 0b1010`	`0b1110` (14)
XOR	`^`	`0b1100 ^ 0b1010`	`0b0110` (6)
NOT	`~`	`~0b1100`	`-0b1101` (-13)
Left shift	`<<`	`0b0011 << 2`	`0b1100` (12)
Right shift	`>>`	`0b1100 >> 2`	`0b0011` (3)

Use Case 1: Permission Systems

const PERMISSIONS = {
  READ:    1 << 0,  // 0b0001 = 1
  WRITE:   1 << 1,  // 0b0010 = 2
  DELETE:  1 << 2,  // 0b0100 = 4
  ADMIN:   1 << 3,  // 0b1000 = 8
};

// Combining permissions
const editor = PERMISSIONS.READ | PERMISSIONS.WRITE;  // 0b0011 = 3
const admin = PERMISSIONS.READ | PERMISSIONS.WRITE | PERMISSIONS.DELETE | PERMISSIONS.ADMIN;  // 0b1111 = 15

// Checking permissions
function hasPermission(userPermissions: number, permission: number): boolean {
  return (userPermissions & permission) === permission;
}

hasPermission(editor, PERMISSIONS.READ);    // true
hasPermission(editor, PERMISSIONS.DELETE);  // false
hasPermission(admin, PERMISSIONS.ADMIN);    // true

// Adding a permission
function addPermission(userPermissions: number, permission: number): number {
  return userPermissions | permission;
}

// Removing a permission
function removePermission(userPermissions: number, permission: number): number {
  return userPermissions & ~permission;
}

Use Case 2: Flag Bits

const FLAGS = {
  BOLD:      1 << 0,  // 1
  ITALIC:    1 << 1,  // 2
  UNDERLINE: 1 << 2,  // 4
  STRIKETHROUGH: 1 << 3, // 8
};

// Set: bold + italic
let style = FLAGS.BOLD | FLAGS.ITALIC;  // 3

// Toggle underline
style ^= FLAGS.UNDERLINE;  // 7 (underline added)
style ^= FLAGS.UNDERLINE;  // 3 (underline removed)

Use Case 3: RGB Colors

// RGB → number
function rgbToNumber(r: number, g: number, b: number): number {
  return (r << 16) | (g << 8) | b;
}

// Number → RGB
function numberToRgb(n: number): { r: number; g: number; b: number } {
  return {
    r: (n >> 16) & 0xFF,
    g: (n >> 8) & 0xFF,
    b: n & 0xFF,
  };
}

rgbToNumber(255, 128, 0);     // 0xFF8000 = 16744448
numberToRgb(0xFF8000);        // { r: 255, g: 128, b: 0 }

Use Case 4: Fast Arithmetic

// Multiply by powers of 2
n * 2     === n << 1
n * 4     === n << 2
n * 8     === n << 3

// Divide by powers of 2 (floored)
n / 2     === n >> 1  // positive numbers
Math.floor(n / 2) === n >> 1

// Odd/even check
n & 1     // 0 = even, 1 = odd

// Modulo by powers of 2
n % 4     === n & 3
n % 8     === n & 7
n % 16    === n & 15

// Swap two numbers (no temp variable)
a ^= b; b ^= a; a ^= b;

IEEE 754 Floating Point

Double-Precision (64-bit) Structure

Sign bit(1)  Exponent(11)     Mantissa(52)
S            EEEEEEEEEEE      MMMMMMMMMMMM...MMMM

Example: -12.375
Sign: 1 (negative)
Exponent: 10000000010 (1026, which is 3 after bias removal)
Mantissa: 1001001100000000...0

Precision Issues

// The classic problem
0.1 + 0.2 === 0.3   // false!
0.1 + 0.2            // 0.30000000000000004

// Why: 0.1 and 0.2 are infinite repeating fractions in binary
// 0.1 = 0.0001100110011... (repeating)
// 0.2 = 0.0011001100110... (repeating)

// Solutions
// 1. Use integer arithmetic
(0.1 * 10 + 0.2 * 10) / 10  // 0.3

// 2. Use toFixed
(0.1 + 0.2).toFixed(1)       // "0.3"

// 3. Compare with EPSILON
Math.abs(0.1 + 0.2 - 0.3) < Number.EPSILON  // true

Special Values

Number.MAX_SAFE_INTEGER    // 9007199254740991 (2^53 - 1)
Number.MIN_SAFE_INTEGER    // -9007199254740991
Number.MAX_VALUE           // 1.7976931348623157e+308
Number.EPSILON             // 2.220446049250313e-16
Infinity                   // positive infinity
-Infinity                  // negative infinity
NaN                        // Not a Number

Base64 Encoding and Binary

How It Works

3 bytes (24 bits) → 4 Base64 characters (6 bits each)

Example: "Man"
M = 77  = 01001101
a = 97  = 01100001
n = 110 = 01101110

Concatenated: 010011010110000101101110
Regrouped:    010011 010110 000101 101110
Indexes:        19      22      5      46
Characters:     T       W       F       u

Result: "TWFu"

Encoding/Decoding with ToolsKu

Open the Base64 Encoder/Decoder
Enter text or a Base64 string
Click "Encode" or "Decode"
Base64 conversion for files and images is also supported

Hex Encoding

Binary → Hex Cheat Sheet

0000 = 0    0100 = 4    1000 = 8    1100 = C
0001 = 1    0101 = 5    1001 = 9    1101 = D
0010 = 2    0110 = 6    1010 = A    1110 = E
0011 = 3    0111 = 7    1011 = B    1111 = F

Common Uses

Use	Example
Color values	`#FF8000`
MAC addresses	`00:1A:2B:3C:4D:5E`
Hash values	`a1b2c3d4e5f6...`
Memory addresses	`0x7fff5fbff8c0`
Viewing binaries	`xxd file.bin`

Converting Bases with ToolsKu

Open the Base Converter
Enter a value
Select the input base
See the converted result in every base

FAQ

Why do JavaScript bitwise operations only support 32 bits?

JavaScript bitwise operators convert numbers to 32-bit signed integers; anything beyond 32 bits is truncated:

0xFFFFFFFF          // 4294967295 (normal number)
0xFFFFFFFF | 0      // -1 (overflows after int32 conversion)

// Big numbers need BigInt for bitwise ops
(0xFFFFFFFFFn & 0xFFn).toString(16)  // "ff"

How do I view a file's binary content?

# hex dump
xxd file.bin

# Or use the ToolsKu Hex viewer
# Upload a file → view its hex/binary content

Summary

Binary is the foundation of computing — permission systems, color encoding, floating-point precision, and Base64 encoding all rely on it. Master base conversion and bitwise operations, and you'll write faster, lower-level code. ToolsKu provides tools like the Base Converter and Base64 Encoder/Decoder to help you handle bases and encodings quickly.