Binary and Bit Operations is a 17-lesson interactive course that turns “binary” from an abstract idea into switches you can touch: type a number and its binary, octal, decimal and hexadecimal forms change together; flip a bit on or off and the value updates at once; run AND, OR, XOR or a shift on two numbers and see the result aligned bit by bit; type a fraction and watch it split into sign, exponent and mantissa fields and find out which decimal fraction it is exactly equal to in double precision. Each lesson has one concrete goal — convert a number, build 200, write the two's complement of −5, work out 5 << 3 — and the checker responds immediately.

The course has four parts: base conversion (binary ↔ decimal, powers of two, and why hexadecimal and octal are “shorthand”); signed numbers (how two's complement turns subtraction into addition, and why overflow makes 127 + 1 become −128); bit operations (AND as a mask, OR to set bits, XOR to flip them, shifts to multiply and divide, and their direct use in Linux permission bits like 755); and floating point (the IEEE 754 field layout, and the real reason 0.1 + 0.2 !== 0.3).

It takes about 45 minutes. It is for people starting to program, developers preparing for interviews, and anyone who has to look up 0x1F, & 0xFF or chmod 644 every time. No mathematics background is needed — addition is enough.

1. 01Read the goal and the paneleach lesson states its goal at the top, and the panel below changes with the lesson — the “Value” panel has an input box, readings in four bases and a row of clickable bit switches with a signed/unsigned toggle; the “Operations” panel takes two operands and an operator and shows the result aligned bit by bit; the “Permissions” panel has nine rwx switches and an octal reading; the “Float” panel takes a fraction and shows the 32-bit and 64-bit field breakdowns and the exact decimal expansion.
2. 02Act and observechange the input, click bit switches, switch the bit width — every reading updates live. Observing is part of the learning: switch 128 to the signed reading and watch it become −128.
3. 03Answermost lessons take a decimal number, a binary string, hexadecimal or octal in the answer box; the “bit switch” lessons ask you to build the value by clicking only; the final floating-point lesson is multiple choice.
4. 04Checkthe result bar immediately says whether you passed or where you went wrong; binary answers may use leading zeros (except in the lessons that require exactly 8 bits), and hexadecimal is case-insensitive and may include 0x.
5. 05Hints, answers and progress“Hint” gives the idea and “Show answer” reveals a reference answer that can be filled in; progress is stored in the local browser, and ?lesson=n jumps straight to a lesson.

Lesson 9, “find the two's complement”, asks for the 8-bit two's complement of −5:

Lesson 16, “IEEE 754 fields”, takes 0.15625 and the panel shows:

Absolute value   5         0 0 0 0 0 1 0 1
Bitwise NOT               1 1 1 1 1 0 1 0
Add one                   1 1 1 1 1 0 1 1      ← answer 11111011
Check      unsigned 251, signed 251 − 256 = −5   ✓

0.15625 = 0.00101₂ = 1.01₂ × 2⁻³
Sign      0
Exponent  −3 + 127 = 124 = 01111100      ← answer 124
Mantissa  01000000000000000000000 (implicit leading 1)
32-bit    0 01111100 01000000000000000000000 = 0x3E200000

Lessons 1–2: place value and conversion

Every base is “a sum of place values”. Decimal 203 = 2×100 + 0×10 + 3×1; binary 1011 = 1×8 + 0×4 + 1×2 + 1×1 = 11. From right to left the place values are 1, 2, 4, 8, 16, 32, 64, 128 and so on. Binary to decimal means adding up the place values of the 1 bits; decimal to binary means repeatedly dividing by 2 and recording the remainders, or greedily subtracting powers of two from the largest down (the bit switches in lesson 7 visualise exactly that).

Lesson 3: why 1024

$2^{10} = 1024$, only 2.4% away from 1000, which is why KB was used for 1024 bytes early on. That is the source of the confusion that persists today: drive manufacturers label 1 GB as $10^9$ bytes while operating systems compute with $2^{30}$, so a 500 GB disk shows 465 GiB. The IEC defined KiB, MiB and GiB (binary prefixes) for this, and Linux and macOS have largely adopted them, while Windows still prints GB but computes in GiB. Worth remembering: $2^8 = 256$, $2^{10} = 1024$, $2^{16} = 65536$, $2^{32} \approx 4.29 \times 10^9$.

Lessons 4–6: hexadecimal and octal

Binary is too long for people to read. Hexadecimal (0–9 plus A–F) uses one symbol for 4 bits, so a byte is exactly two symbols: 11111111 = FF, 10110110 = B6. The conversion does not go through decimal — split the binary into groups of 4 from the right and look each group up, which is what lesson 5 practises. Octal uses one symbol for 3 bits, historically for machines with 12-, 24- and 36-bit words, and today it lives mainly in Linux permissions (755) and C's \012 escapes. The prefixes in code are 0x for hexadecimal, 0o for octal and 0b for binary.

Lesson 7: a bit is a switch

Every non-negative integer has exactly one binary spelling, so an 8-bit number can serve as eight independent switches (flag bits): flags = READ | WRITE, if (flags & EXEC). CSS font-weight, Unix file permissions and the flag fields in network protocol headers are all packed this way. Lesson 7 asks you to build 200 with the switches only — greedily from the top: 200 ≥ 128 so switch it on, 72 left ≥ 64 so switch it on, 8 left = 2³ so switch that one, giving 11001000.

Lessons 8–9: two's complement

How are negative numbers stored? The intuitive answer is to give one bit to the sign, but then there are two zeros, “+0” and “−0”, and the adder has to handle cases. Two's complement says: a leading 1 means negative, and the value equals the unsigned value minus $2^n$. In 8 bits 11111111 is 255 and also 255 − 256 = −1; 10000000 is −128. To find the two's complement of a negative number: write the absolute value, invert every bit, add one — for −5 that is 00000101 → 11111010 → 11111011.

The elegance of two's complement is that addition does not need to know the signs: −5 + 5 = 11111011 + 00000101 = 1 00000000, and once the carry out of the 9th bit is discarded the result is exactly 0. Subtraction therefore becomes “add the complement”, and the CPU needs only one adder. The 8-bit two's complement range is −128 to 127: one more negative than positive, because 0 takes a place on the positive side.

Lesson 10: overflow

The bit width is finite, so going past the end wraps around. In int8, 127 = 01111111; add one and you get 10000000, which reads as −128 in two's complement. Integer overflow in C, Java and Go happens silently like this; JavaScript's ordinary Number is a float so it does not overflow, but Int8Array, |0 and every bit operation run on 32-bit two's complement, and (2 ** 31) | 0 gives −2147483648. The famous year 2038 problem is a 32-bit signed second count overflowing to negative at 2038-01-19 03:14:07 UTC; the “score went negative” and “coins reset to zero” bugs in old games are the same thing.

Lessons 11–13: AND, OR, XOR

The three bitwise logical operations each have established uses:

Clearing a bit is AND combined with NOT: flags & ~FLAG. The two identities $x \oplus x = 0$ and $x \oplus 0 = x$ are the root of every use: a ^= b; b ^= a; a ^= b swaps two numbers, and finding the single value that appears an odd number of times in an array is just XOR-ing everything together.

Lesson 14: shifts

Shifting left by n multiplies by $2^n$ (filling the low bits with 0) and shifting right by n divides by $2^n$, rounding down. 5 << 3 = 101000 = 40. Shifting is the cheapest multiply and divide, but its more common use is packing small fields into one integer: (r << 16) | (g << 8) | b combines three 0–255 values into a 24-bit colour, and (rgb >> 8) & 0xFF takes the G back out. Note that there are two right shifts: arithmetic >> keeps the sign bit (a negative stays negative) and logical >>> fills with 0. JavaScript shifts happen on 32 bits, so 1 << 31 gives −2147483648 and 1 << 32 equals 1 << 0 = 1, because the shift count is taken modulo 32.

Lesson 15: chmod 755

Linux file permissions are nine bits: three each for owner, group and others, in the order read r = 4, write w = 2, execute x = 1. The sum of each triplet is one octal digit: rwxr-xr-x = 7, 5, 5 → 755; rw-r--r-- = 644. This is the most direct everyday use of place values and masks: chmod u+x is OR-ing in 0o100 and chmod o-w is AND-ing with ~0o002. There can also be bits 10–12 (setuid, setgid, sticky), which is why you sometimes see a four-digit 4755.

Lesson 16: the three IEEE 754 fields

A float is scientific notation in binary:

Single precision is 32 bits = 1 sign bit s + 8 exponent bits e (bias 127) + 23 mantissa bits f; double precision is 1 + 11 (bias 1023) + 52. The mantissa stores only the fractional part — the leading 1 of the integer part is implicit, which buys an extra bit of precision for free. The exponent is stored with a bias so that comparing floats bitwise is as monotonic as comparing integers. 0.15625 = $0.00101_2$ = $1.01_2 \times 2^{-3}$, so the exponent field is −3 + 127 = 124 = 01111100 and the mantissa field is 01 followed by zeros.

A few special encodings: an all-zero exponent means a subnormal (used for values extremely close to 0 and for ±0); an all-one exponent with an all-zero mantissa is ±∞; an all-one exponent with a non-zero mantissa is NaN — which is why 0/0 is NaN while 1/0 is Infinity, and why NaN has many bit patterns yet never equals itself.

Lesson 17: 0.1 + 0.2

A binary fraction can only represent sums of negative powers of two exactly: 0.5, 0.25, 0.125 and so on. $\tfrac{1}{10}$ in binary is the repeating fraction $0.0\overline{0011}$, so a 52-bit mantissa has to round it. The double-precision 0.1 is therefore exactly

which is slightly more than 0.1; 0.2 is also slightly more; adding the two and rounding gives 0.3000000000000000444…, while the nearest double to the literal 0.3 is 0.29999999999999998889… — two different binary numbers, so 0.1 + 0.2 === 0.3 is false. This is not a JavaScript bug; every language that uses IEEE 754 (Python, Java, C, Go) behaves the same way.

What to do depends on the situation: for money, use integer cents or a decimal library (decimal, BigDecimal, Decimal.js); for comparison, use a tolerance, Math.abs(a − b) < ε; for display, use toFixed(2) only at the very last step; for counting, use integers — double precision represents every integer up to $\pm 2^{53}$ exactly, and beyond that BigInt is the answer. The last multiple-choice question in the course asks whether the stored 0.1 is larger or smaller than the true value, and the answer is “larger” — the 55511… after the 18th digit of the exact expansion shows why.

Bit width

the value panel supports 8, 16 and 32 bits; 64-bit integers and BigInt bit operations are not covered.

Floating point

it covers the field layout and exact decimal expansion of IEEE 754 binary32 and binary64 only; rounding modes, subnormal performance, Math.fround, half precision and bfloat16 are not covered.

Bit-operation semantics

shifts are explained as JavaScript defines them (32-bit signed); left-shifting a negative number and over-wide shifts are undefined behaviour in C and are not explored here.

Permission bits

only the nine basic bits and their octal form are covered; setuid, setgid, sticky and ACLs are mentioned in the text but not offered in the panel.

Checking

numeric answers are compared exactly; binary allows leading zeros (except where the lesson states “8 bits”); hexadecimal is case-insensitive and may include 0x.

What it does not do

it is not a batch conversion tool (use “Number Base Converter” or “chmod Calculator” for real data), does not analyse floating-point error, and does not cover instruction-level CPU implementation.

• “1 KB = 1000 bytes” or “= 1024 bytes”: both are in use. Drives and networks use 1000, while memory and operating systems mostly use 1024 (which the IEC calls KiB). Read the context, or look for the i.
• “A negative number is just a positive one with the top bit set”: that is sign-magnitude, and almost no hardware stores numbers that way. In two's complement 10000000 is −128, not −0, and −1 is all ones.
• “>> is division by 2”: for negatives it rounds down rather than towards zero: −5 >> 1 gives −3 while Math.trunc(−5 / 2) gives −2.
• “Floating point is imprecise”: every float is exactly equal to some binary fraction; what is inexact is the conversion from decimal to binary. 0.5, 0.25 and 3.0 are all exact.
• “toFixed solves the money problem”: toFixed only rounds for display, and the error from the intermediate arithmetic has already accumulated; money should use integer cents from the start.
• “JavaScript has no integers, so it cannot overflow”: bit operations, Int32Array and |0 all run on 32-bit two's complement and do overflow; a Number above $2^{53}$ loses integer precision.

The whole course runs locally in the browser: base conversion, bit operations and the float field breakdown and exact expansion are all pure in-page calculations with no server request, and progress is stored in local localStorage.

• IEEE, IEEE 754-2019, IEEE Standard for Floating-Point Arithmetic — field layouts, biases, special values and rounding rules for binary32 and binary64: https://standards.ieee.org/ieee/754/6210/（访问日期：2026-09-09）
• David Goldberg, What Every Computer Scientist Should Know About Floating-Point Arithmetic, ACM Computing Surveys 23(1), 1991 — the classic paper on rounding error, exact expansion and why 0.1 cannot be stored exactly: https://docs.oracle.com/cd/E19957-01/806-3568/ncg_goldberg.html（访问日期：2026-09-09）
• ECMA-262, ECMAScript Language Specification, The Number Type and the ToInt32 / ToUint32 abstract operations — the specification basis for JavaScript bit operations running on 32-bit two's complement: https://tc39.es/ecma262/#sec-ecmascript-language-types-number-type（访问日期：2026-09-09）
• IEEE / The Open Group, POSIX.1-2024, the chmod utility — the definitions of symbolic and octal modes: https://pubs.opengroup.org/onlinepubs/9799919799/utilities/chmod.html（访问日期：2026-09-09）
• IEC 80000-13:2008, Quantities and units — Part 13: Information science and technology — the definitions of the binary prefixes KiB, MiB and GiB: https://www.iso.org/standard/31898.html（访问日期：2026-09-09）
• Charles Petzold, Code: The Hidden Language of Computer Hardware and Software, 2nd ed., Microsoft Press, 2022 — an accessible walk from switches to adders to two's complement.