Adding numbers using Boolean operations in JavaScript

Photo by Crissy Jarvis on Unsplash

You know how to add numbers progmatically, right?
1 + 1 will basically give you 2.

Numbers are added in binary form down in machine level.
But how do numbers get added underneath the hood?

I will show how to add “positive” integers (no floating) using boolean operations.

💭 Assumption

I will assume the knowledge of binary numbers and Boolean operations.

And you can follow along on CodeSandbox.

📊 AND & XOR Truth Tables

Below is the truth table of all possible XOR & AND operations I will refer back to.

1️⃣ Adding one bit

When you add two one-bit numbers, you get either 0 or 1 for the sum and 0 or 1 for the carry.

Did you notice that, carry output looks the same as output of AND truth table, and sum equal to that of XOR?

The operation can be represented using logical XOR & AND gates as shown here.

A circuit formed that way is called half-adder.
Armed with the knowledge and we can now implement the addition using XOR & AND.

• xor returns true (or 1) when both input are different.
• and was used using built-in JavaScript && operator.
• xorBit & andBit return 1 or 0 depending on whether result is true or false.
  • Think of andBit as an AND gate and xorBit as XOR gate in the Half-adder figure above.
• “s” refers to “sum”, while “c” means “carry”.

When we run the half adder on combination of one bit addition, the result looks like below.

OK, that wasn’t interesting enough as we can’t do anything by adding just one bit.
Let’s spice it up by adding two bits.

2️⃣ Adding two bits

We got the carry from the half-adder but to calculate the next bit we need to pass the carry to the next adder.
But the problem is that, half-adder accepts only two inputs and doesn’t accept a carry.

We can solve the problem by combining two half-adders, making it a full-adder.

Logic looks like following.

1. You calculate the first (least significant) bit using the half-adder and feed the carry from it to the full adder.
2. The full adder will calculate the 2nd bit and then sum again in the half adder with the carry as the input
3. Lastly, output carry of the full adder is the OR of carries from two-half adders in the full-adder.

Simply put, you perform two operations. One for the current bit, and another with the carry.

Let’s take a look at an example of adding 11 and 01 to get 100.

I apologize for the 💩 illustration 😅.
And thank you @MarkN_LP for catching the error.

The diagram shows the result of first carry being fed into the 2nd half-adder, which is used to calculate sum.

Let’s implement the full-adder & add two bit numbers.

Full-adder is implemented in line#4~8 using newly created orBit method to calculate the carry.

It uses two half-adders and uses the carry from the “first” operation in the second half-adder.
And the carry is the result of two carries in the two half-adders as shown in the diagram.

11 + 01 correctly returns { c1: 1, b1: 0, b0: 0 }.

Still useless right? Let’s add more bits.

Adding N-bits

When you add one bit, you need just a half-adder. For two bits, 1 half-adder & 1 full-adder.
For 3 bits, you would need 1 half-adder & 2 full-adders.

So for N-bit addition, you need 1 half-adder & N-1 full-adders.

I could’ve shown 3-bit operation but decided to share a method that works on any N-bits instead (unlike how microprocessors are physically constrained).

This code assumes that length of two digits have the same length.
I initially was going to change the length dynamically but it made the demo code too convoluted so left it out.

Line #2 & #3 converts strings into array of numbers
and #7 uses reduceRight to start working on the least significant (right-most) bit.

On first iteration, we calculate the sum using half-adder on line #14, and then we use the full-adder for the rest.

Carry passed to the full-adder is retrieved from the first item in the array because we are prepending new digit ([{c, s}, ...acc]) on each iteration.

Lastly, we are returning a text representation of the sum for demo purpose only.

Sorry about abusing && there 😜.
I got excited after reading “Mastering JavaScript’s && and || logical operators” by Nicolas Marcora today. 🙂

Let’s check out the demo result.

Values within parenthesis shows operations in base 10.

Parting Words

We’ve looked at how positive numbers are added under the hood.
I am also just learning about this thus the explanation might lack much.

The source I am learning from is “The Manga Guide to Microprocessors“.

I still haven’t finished the book but it has been delightful.

Resources

• The Manga Guide to Microprocessors - No Starch Press
• Adder Wikipedia article
• Diagram & Truth tables for
  • Full-adder
  • Half-adder
• Demo program is available on CodeSandbox
• Full-adder diagram on Google Slides.
• Half-adder on Wikipedia.