I’m third of the way along on The Isles of the Gods. I’m enjoying it. The story jumps from one person’s point of view to another and another. So this drives me up the wall since I have to remember the other person’s story when we return to that person later in the book. I need to speed up my reading. I have a few days before the book is returned to the library.
I had to bring Kel, her blood sugar monitor, to work, so I stopped at Walmart to pick up my medications. I then checked the mailbox. We didn’t get any mail, either, or I just came to the mailbox too early.
In therapy, we talked about how to gain my own identity. So, I have some steps from treatment that may help me:
Trying to gain my own identity is going to be a long project, and I feel a bit overwhelmed by it all.
JavaScript notes…
————————————
Decimal to Binary converter steps 16 –
Step 16
Within your checkUserInput function, remove the console.log() statement. Then, call the decimalToBinary function and pass in the value of numberInput as an argument. Also, make sure to use the parseInt() function to convert the input into a number.
decimalToBinary(parseInt(numberInput.value));
Step 17
Finally, you should clear the number input by setting its value to an empty string. Then later when you convert several numbers in a row, you won’t have to delete the previous number before entering the next one.
Set the value property of numberInput to an empty string.
numberInput.value = "";
Step 18
Now that your function is set up, it’s time to learn about binary numbers.
Binary numbers are a base-2 number system. Unlike the base-10 or decimal number system we use every day that uses 10 digits (0-9) to form numbers, the binary number system only has two digits, 0 and 1. In computer science, these binary digits are called bits, and are the smallest unit of data computers can process. For computers, 0 represents false or “off”, and 1 represents true or “on”.
In your decimalToBinary function, use the return keyword to return a string of the binary number representation of true.
Note: Binary numbers can be long sequences that start with 0, so they are often represented as strings.
return "1";
Step 19
In the base-2 number system, the rightmost digit represents the ones place, the next digit to the left represents the twos place, then the fours place, then the eights place, and so on. In this system, each digit’s place value is two times greater than the digit to its right.
Here are numbers zero to nine in the base-10 and base-2 number systems:
| Base-10 | Base-2 |
| ——- | —— |
| 0 | 0 |
| 1 | 1 |
| 2 | 10 |
| 3 | 11 |
| 4 | 100 |
| 5 | 101 |
| 6 | 110 |
| 7 | 111 |
| 8 | 1000 |
| 9 | 1001 |
Notice that binary numbers are formed from left to right, from the digit with the greatest place value on the left, to the least significant on the right. For example, the number 3 in binary is 11, or 1 in the twos place and 1 in the ones place. Then for the number 4, a digit to represent the fours place is included on the left and set to 1, the twos place is 0, and the ones place is 0.
In your decimalToBinary function, convert the number 10 into binary and return it as a string.
return "1010";
Step 20
Bits are often grouped into an octet, which is an 8-bit set known as a byte. A byte can represent any number between 0 and 255. Here are the placement values for each bit in a byte:
128 | 64 | 32 | 16 | 8 | 4 | 2 | 1
Because bits are often grouped into bytes, it’s common to see binary numbers represented in groups of eight, sometimes with leading zeros. For example, the number 52 can be represented as 110100, or 00110100 with leading zeros. Here’s how that breaks down with the placement values:
128 | 64 | 32 | 16 | 8 | 4 | 2 | 1
0 | 0 | 1 | 1 | 0 | 1 | 0 | 0
In your decimalToBinary function, convert the number 118 into binary with leading zeros and return it as a string.
return "01110110";
Step 21
Now that you’re familiar with binary numbers, it’s time to finish building the function to do the conversion for you. You’ll start off with a simpler solution first, then refactor that into a recursive solution.
First, you need to create some arrays to store the inputs and results of the division you’ll do in the following steps. These will make it easier to see how the decimal to binary conversion works.
Remove the return statement from your decimalToBinary function. Then, declare variables named inputs, quotients, and remainders, and assign an empty array to each of them.
const inputs = []; const quotients = []; const remainders = [];
Step 22
Set input equal to the number 0 for now. We’ll change this in the next few steps.
input = 0;
Step 23
For the decimal to binary conversion, you need to divide input by 2 until the quotient, or the result of dividing two numbers, is 0. But since you don’t know how many times you need to divide input by 2, you can use a while loop to run a block of code as long as input is greater than 0 and can be divided.
As a reminder, a while loop is used to run a block of code as long as the condition evaluates to true, and the condition is checked before the code block is executed. For example:
let i = 0;
while (i < 5) { console.log(i); i++; } Create a while loop that runs as long as input is greater than 0. Leave the body of the loop empty for now.
while (input > 0) {
}
Step 24
The tricky part about while loops is that, if you’re not careful, they can run forever. This is called an infinite loop, and can cause your browser to crash.
To avoid infinite loops, you need to make sure that the condition for the while loop eventually becomes false. In this case, you want to make sure that the input variable eventually becomes 0.
Move the input = 0 statement into the body of the while loop. This will make it so that the loop will only run up to one time.
while (input > 0) {
input = 0;
}
Step 25
To divide numbers in JavaScript, use the division operator (/). For example:
const quotient = 5 / 2; // 2.5
In the example above, 5 is the dividend, or the number to be divided, and 2 is the divisor, or the number to divide by. The result, 2.5, is called the quotient.
Inside your while loop, create a variable named quotient and assign it the value of input divided by 2.
const quotient = input / 2;
Step 26
Like you saw in the last step, division can lead to a floating point number, or a number with a decimal point. The best way to handle this is to round down to the nearest whole number.
Use the Math.floor() function to round down the quotient of input divided by 2 before it’s assigned to quotient.
const quotient = Math.floor(input / 2);
Step 27
Now that you have an operation that will lower the value of input each time the loop runs, you don’t have to worry about the loop running forever.
Update the last line of your while loop and assign quotient to input.
input = quotient;
Step 28
Next, you need to calculate the remainder of input divided by 2. You can do this by using the remainder operator (%), which returns the remainder of the division of two numbers. For example:
const remainder = 5 % 2; // 1
In other words, the dividend, 5, can be divided by the divisor, 2, multiple times. Then you’re left with a remainder of 1.
Inside your while loop, create a variable named remainder and use the remainder operator to assign it the remainder of input divided by 2.
const remainder = input % 2;
Step 29
Inside your while loop, use the .push() method to append input to the inputs array. This will help you get a better idea of how the conversion works later when you log the contents of your arrays to the console.
inputs.push(input);
Step 30
Use .push() to append the quotient variable to the quotients array. Also, append the remainder variable to the remainders array.
inputs.push(input);
quotients.push(quotient);
remainders.push(remainder);
Step 31
Now’s a good time to check your work.
Log the text Inputs: , followed by a comma, followed by the inputs array to the console.
console.log("Inputs: ", inputs)
Step 32
Next, log the text Quotients: , followed by a comma, followed by the quotients array to the console. Also, log the text Remainders: , followed by a comma, followed by the remainders array.
console.log("Inputs: ", inputs);
console.log("Quotients: ", quotients);
console.log("Remainders: ", remainders);
Step 33
Now if you enter in the number 6 and click the Convert button, you’ll see the following output:
Inputs: [ 6, 3, 1 ]
Quotients: [ 3, 1, 0 ]
Remainders: [ 0, 1, 1 ]
Notice that the remainders array is the binary representation of the number 6, but in reverse order.
Use the .reverse() method to reverse the order of the remainders array, and .join() with an empty string as a separator to join the elements into a binary number string. Then, set result.innerText equal to the binary number string.
result.innerText = remainders.reverse().join("");
tep 34
Your decimalToBinary function works well, but there is an issue – because of the condition in your while loop, it only works for numbers greater than 0. If you try to convert 0 to binary, nothing will get added to the page.
To fix this, add an if statement to check if input is equal to 0. Leave the body of the if statement empty for now.
if (input === 0) {
}
Step 35
Within the body of the if statement, set the innerText property of result equal to the string 0. Then, use an early return statement to break out of the function early.
Category: Uncategorized
