JavaScript · Lesson 16 / 32 · English

JavaScript Numbers

Understand the idea. Change the code. Build confidence with one focused experiment.

Detailed notesRunnable JavaScriptPractice + answer

01 / Understand

Start with the idea

JavaScript Number uses floating-point arithmetic. Formatting controls presentation; it does not make floating-point values exact. Use integer minor units when appropriate for simple money calculations.

Learning goal: Explain what the example does, predict its result, and change it to solve the practice task.

02 / Explore

Step-by-step lesson notes

Numbers in JavaScript

JavaScript has a single Number type based on the IEEE 754 double-precision floating-point standard. This means integers and floats are the same type.

Number Basics

JavaScript reference fragmentCODE

const integer = 42;
const float = 3.14;
const negative = -7;
const hex = 0xFF;          // 255
const octal = 0o77;        // 63
const binary = 0b1010;     // 10
const scientific = 1.5e6;  // 1500000

// Special values
console.log(Infinity);          // Infinity
console.log(-Infinity);         // -Infinity
console.log(NaN);               // Not a Number
console.log(Number.MAX_SAFE_INTEGER); // 9007199254740991
console.log(Number.MIN_SAFE_INTEGER); // -9007199254740991

Common Pitfalls

JavaScript reference fragmentCODE

// Floating point precision issue
console.log(0.1 + 0.2);         // 0.30000000000000004
console.log(0.1 + 0.2 === 0.3); // false!

// Fix with toFixed
console.log((0.1 + 0.2).toFixed(1)); // "0.3" (string!)
console.log(+(0.1 + 0.2).toFixed(1)); // 0.3 (number)

// NaN is not equal to anything, including itself
console.log(NaN === NaN);  // false
console.log(isNaN(NaN));   // true
console.log(Number.isNaN(NaN)); // true (more reliable)

Number Methods

JavaScript reference fragmentCODE

const n = 3.14159;
n.toFixed(2);        // "3.14" (string)
n.toPrecision(4);    // "3.142" (string)
n.toString();        // "3.14159"
n.toString(2);       // convert to binary string

// Converting to number
Number("42");        // 42
Number("3.14");      // 3.14
Number("");          // 0
Number("abc");       // NaN
Number(true);        // 1
Number(false);       // 0
Number(null);        // 0
Number(undefined);   // NaN

parseInt("42px");    // 42 (stops at non-digit)
parseFloat("3.14kg"); // 3.14
parseInt("10", 2);   // 2 (parse binary string)

03 / Read & predict

A complete example

Run this complete index.js program in the JavaScript console editor below. The earlier reference fragments may need a browser page or other surrounding setup.

index.js · complete exampleCODE

const unitPaise = 1999;
const quantity = 3;
const rupees = (unitPaise * quantity) / 100;
console.log(rupees.toFixed(2));
console.log(typeof rupees.toFixed(2));

Predict first. Reveal the expected result.

59.97
string

04 / Experiment

Make one change. See what happens.

Load the example, change a value, predict the output, and run it again. Use the console output to check your reasoning.

Open editor ↗

Wait for the editor to load, then load this example and press Run.

Powered by the free OneCompiler editor. Code you run is sent to that external service. Keep personal data and secret keys out of your examples.

05 / Your turn

Put the idea to work

Practice challenge

Change quantity to 2 and format to two decimal places.

Reveal the answer and reasoning

The displayed result is "39.98". toFixed returns text.

One mistake to avoid: 0.1 + 0.2 is not exactly 0.3 in binary floating point. Do not use formatted strings as if they were numbers.

Your learning checkpoint

Explain the example in your own words.
Complete the challenge before revealing its answer.
Describe the common mistake and how to avoid it.