⬅ Back

COMPARISON OPERATORS, EQUALITY, NUMBER CONVERSION, MATH, AND FLOATING-POINT NUMBERS

This complete note explains the topic in simple language and in a better learning order.

It removes repeated parts, keeps the important information, and adds helpful beginner-friendly examples.

1. What are comparison operators?

Comparison operators compare two values.

The result of every comparison is always a Boolean value: true or false.

This is very important in programming because programs often need to check conditions.

For example, a program may need to check:

Diagram 1. How comparison works

1. Take two values
2. Compare them
3. Get true or false

Example:
10 > 5 -> true
3 > 8 -> false

2. Main comparison operators

JavaScript has these basic comparison operators:

Example

const a = 2;
const b = 5;

console.log(a > b);  // false
console.log(b > a);  // true
console.log(a >= b); // false
console.log(b >= a); // true

console.log(a < b);  // true
console.log(b < a);  // false
console.log(a <= b); // true
console.log(b <= a); // false

3. What each operator means

>

Checks if the left value is bigger than the right value.

console.log(7 > 3); // true
console.log(2 > 6); // false

<

Checks if the left value is smaller than the right value.

console.log(2 < 6); // true
console.log(7 < 3); // false

>=

Checks if the left value is bigger than or equal to the right value.

console.log(5 >= 5); // true
console.log(8 >= 5); // true
console.log(2 >= 5); // false

<=

Checks if the left value is smaller than or equal to the right value.

console.log(5 <= 5); // true
console.log(2 <= 5); // true
console.log(8 <= 5); // false

4. Why comparison operators are useful

Comparison operators are often used in:

Example: users aged 18 or older can access a certain product category.

const age = 20;
console.log(age >= 18); // true

5. Task example: isAdult

You had a task: declare a variable isAdult and assign to it the result of checking the value of the variable age.

Correct solution

const age = 20;
const isAdult = age >= 18;

console.log(isAdult); // true

How it works

Diagram 2. How isAdult works

1. Take age
2. Compare with 18
3. Save the result in isAdult

age = 14
14 >= 18 -> false

age = 20
20 >= 18 -> true

6. What are equality operators?

Equality operators check whether two values are equal or not equal.

There are two groups:

  1. non-strict equality
  2. strict equality

This difference is very important in JavaScript.

7. Non-strict equality operators

These are:

Example

console.log(5 == 5); // true
console.log(5 == 3); // false
console.log(5 != 3); // true
console.log(5 != 5); // false

At first they look simple, but they can be dangerous.

8. The problem with == and !=

Non-strict equality can do implicit type conversion.

That means JavaScript may change one value into another type before comparing.

Examples

console.log(5 == "5");  // true
console.log(5 != "5");  // false
console.log(1 == true); // true
console.log(1 != true); // false

This can be confusing.

Why?

Example 1

5 == "5"

JavaScript changes "5" into 5, so it becomes:

5 == 5

Result:

true

Example 2

1 == true

JavaScript changes true into 1, so it becomes:

1 == 1

Result:

true

Diagram 3. Why non-strict equality is risky

1. JavaScript sees different types
2. It converts one of them automatically
3. Then it compares the values
4. The result may surprise you

Example:
5 == "5"
becomes
5 == 5

9. Strict equality operators

These are:

Strict operators compare:

  1. the value
  2. the data type

Example

console.log(5 === 5);    // true
console.log(5 === "5");  // false
console.log(5 !== "5");  // true
console.log(5 !== 5);    // false
console.log(1 === true); // false
console.log(1 !== true); // true

Here JavaScript does not convert types first.

10. Why strict equality is better

Strict equality is safer because it avoids hidden conversions.

Good practice

Use:

Avoid using:

Example

console.log(10 === "10"); // false
console.log(10 == "10");  // true

The strict version is clearer and more reliable.

Diagram 4. Best rule for equality

Use === and !==

Why?
1. No hidden type conversion
2. Easier to understand
3. Fewer mistakes

11. What is number conversion?

Sometimes values are changed into numbers.

This can happen in two ways:

  1. explicit conversion - the programmer does it
  2. implicit conversion - JavaScript does it automatically

12. Explicit conversion with Number()

To convert a value to a number manually, use the Number() function.

Examples

console.log(Number("5"));    // 5
console.log(Number(true));   // 1
console.log(Number(false));  // 0
console.log(Number(null));   // 0

Important conversions

13. When conversion gives NaN

If JavaScript cannot convert the value to a number, the result is NaN.

NaN means Not a Number.

Examples

console.log(Number(undefined)); // NaN
console.log(Number("Jacob"));   // NaN
console.log(Number("25px"));    // NaN

So not every string can become a number.

14. Read the code example

console.log(Number(true));

Result:

1

Because true becomes 1.

Diagram 5. Common conversions to number

Number("5")       -> 5
Number(true)      -> 1
Number(false)     -> 0
Number(null)      -> 0
Number(undefined) -> NaN
Number("Jacob")   -> NaN

15. Arithmetic operations can convert types automatically

Arithmetic operators can automatically convert values to numbers.

Examples

console.log("5" * 2);   // 10
console.log("10" - 5);  // 5
console.log(5 + true);  // 6
console.log(5 - true);  // 4

Why?

16. Important exception: the + operator

The + operator is special.

It can mean:

If a string is involved, + often creates a string.

Example

console.log("5" + 2); // "52"

This is not 7. This is string concatenation.

Compare

console.log("5" * 2); // 10
console.log("5" - 2); // 3
console.log("5" / 2); // 2.5
console.log("5" + 2); // "52"

So remember:

17. Implicit conversion in comparison operators

Comparison operators can also convert values.

Examples

console.log("10" > 5);   // true
console.log(10 > "5");   // true
console.log(5 > true);   // true
console.log(5 < true);   // false
console.log("5" < true); // false

Why?

Example:

5 > true

becomes:

5 > 1

Result:

true

18. Important detail about string comparisons

If both values are strings, JavaScript compares them as strings, not as numbers.

Example

console.log("20" > "5"); // false

This may look strange.

Why? Because JavaScript compares character by character:

So the result is false.

If you want numeric comparison, convert the values first:

console.log(Number("20") > Number("5")); // true

This is a very useful thing to remember.

19. Number.parseInt()

Number.parseInt() converts a string to an integer.

It reads from left to right and stops when it finds the first invalid character.

Examples

console.log(Number.parseInt("5"));          // 5
console.log(Number.parseInt("5.5"));        // 5
console.log(Number.parseInt("5cm"));        // 5
console.log(Number.parseInt("12qwe74"));    // 12
console.log(Number.parseInt("12.46qwe79")); // 12
console.log(Number.parseInt("cm5"));        // NaN
console.log(Number.parseInt(""));           // NaN
console.log(Number.parseInt("qweqwe"));     // NaN

Important idea: parseInt() only reads the integer part from the beginning of the string.

20. How parseInt() works step by step

Example:

Number.parseInt("12.46qwe79")

JavaScript reads:

Result:

12

Example:

Number.parseInt("cm5")

JavaScript reads:

Result:

NaN

21. Second argument in parseInt()

Number.parseInt() can also take a second argument: the numeral system.

Example:

console.log(Number.parseInt("101", 2)); // 5

Here 2 means binary.

For normal beginner work, you will usually use decimal numbers.

22. Number.parseFloat()

Number.parseFloat() is similar to parseInt(), but it can read decimal numbers too.

Examples

console.log(Number.parseFloat("5"));          // 5
console.log(Number.parseFloat("5.5"));        // 5.5
console.log(Number.parseFloat("3.14"));       // 3.14
console.log(Number.parseFloat("5cm"));        // 5
console.log(Number.parseFloat("5.5cm"));      // 5.5
console.log(Number.parseFloat("12qwe74"));    // 12
console.log(Number.parseFloat("12.46qwe79")); // 12.46
console.log(Number.parseFloat("cm5"));        // NaN
console.log(Number.parseFloat(""));           // NaN
console.log(Number.parseFloat("qweqwe"));     // NaN

23. parseInt() vs parseFloat()

parseInt()

Returns only the integer part.

console.log(Number.parseInt("8.99")); // 8

parseFloat()

Returns the decimal value too.

console.log(Number.parseFloat("8.99")); // 8.99

Diagram 6. Difference between Number(), parseInt(), and parseFloat()

1. Number("25")        -> 25
2. Number("25px")      -> NaN

3. parseInt("25px")    -> 25
4. parseInt("8.7")     -> 8

5. parseFloat("25px")  -> 25
6. parseFloat("8.7")   -> 8.7

24. The Math object

JavaScript has a built-in Math object with useful methods for working with numbers.

It helps with:

25. Math.floor()

Math.floor(num) returns the nearest integer that is less than or equal to the number.

It always rounds down.

Examples

console.log(Math.floor(1.3)); // 1
console.log(Math.floor(1.7)); // 1
console.log(Math.floor(9.9)); // 9

26. Math.ceil()

Math.ceil(num) returns the nearest integer that is greater than or equal to the number.

It always rounds up.

Examples

console.log(Math.ceil(1.3)); // 2
console.log(Math.ceil(1.7)); // 2
console.log(Math.ceil(9.1)); // 10

27. Math.round()

Math.round(num) rounds to the nearest integer.

Rules:

Examples

console.log(Math.round(1.3)); // 1
console.log(Math.round(1.7)); // 2
console.log(Math.round(1.5)); // 2

28. Math.max()

Math.max() returns the largest number from the given values.

console.log(Math.max(20, 10, 50, 40)); // 50

29. Math.min()

Math.min() returns the smallest number from the given values.

console.log(Math.min(20, 10, 50, 40)); // 10

30. Math.random()

Math.random() returns a random number from 0 inclusive up to 1 exclusive.

That means the result can be 0.2, 0.73, 0.999..., but never exactly 1.

Example

console.log(Math.random());

Possible output:

0.9166353649342294

Every time the result is different.

31. Useful extra example with Math.random()

A common beginner pattern is getting a random whole number from 1 to 10.

const randomNumber = Math.floor(Math.random() * 10) + 1;
console.log(randomNumber);

How it works:

  1. Math.random() gives a number from 0 to <1
  2. * 10 changes it to 0 up to <10
  3. Math.floor() removes the decimal part
  4. + 1 changes the range from 0..9 to 1..10

Diagram 7. Useful Math methods

Math.floor(1.8) -> 1
Math.ceil(1.2)  -> 2
Math.round(1.5) -> 2
Math.max(...)   -> biggest value
Math.min(...)   -> smallest value
Math.random()   -> random number from 0 to less than 1

32. What are floating-point numbers?

Floating-point numbers are numbers with a decimal part.

Examples:

These numbers can sometimes cause precision problems in JavaScript.

33. The classic floating-point problem

Example:

console.log(0.1 + 0.2 === 0.3); // false
console.log(0.1 + 0.2); // 0.30000000000000004

This surprises many beginners.

You expect 0.3, but JavaScript gives 0.30000000000000004.

34. Why does this happen?

Computers store numbers in binary form.

Some decimal numbers, like 0.1 and 0.2, cannot be stored exactly in binary.

So JavaScript stores close approximations.

When these approximations are added, a small error appears.

This is not only a JavaScript problem. Many programming languages have the same issue.

Diagram 8. Why 0.1 + 0.2 is not exact

1. 0.1 is stored approximately
2. 0.2 is stored approximately
3. JavaScript adds the approximations
4. Small error appears

Result:
0.30000000000000004

35. Approach 1: multiply, calculate, divide

One simple way to reduce the problem is:

  1. multiply by 10, 100, or another suitable number
  2. do the calculation
  3. divide back

Example

console.log(0.1 * 10 + 0.2 * 10); // 3
console.log((0.1 * 10 + 0.2 * 10) / 10); // 0.3

This works well in many simple cases.

36. Approach 2: toFixed()

Another common way is using toFixed().

It rounds the number to a fixed number of digits after the decimal point.

Examples

console.log((0.1 + 0.2).toFixed(1)); // "0.3"
console.log((5).toFixed(2)); // "5.00"
console.log((8.762195).toFixed(4)); // "8.7622"

37. Important: toFixed() returns a string

This is easy to forget.

const result = (0.1 + 0.2).toFixed(1);
console.log(result); // "0.3"
console.log(typeof result); // "string"

If you need a number again, convert it:

const result = Number((0.1 + 0.2).toFixed(1));
console.log(result); // 0.3
console.log(typeof result); // "number"

38. Basic comparisons

const age = 22;

console.log(age > 18);  // true
console.log(age < 18);  // false
console.log(age >= 22); // true
console.log(age <= 21); // false

39. Strict equality

console.log(10 === 10);   // true
console.log(10 === "10"); // false

40. Number conversion

console.log(Number("42"));    // 42
console.log(Number(false));   // 0
console.log(Number("hello")); // NaN

41. Parsing values with units

console.log(Number.parseInt("50px"));     // 50
console.log(Number.parseFloat("19.99$")); // 19.99

42. Rounding

console.log(Math.floor(7.9)); // 7
console.log(Math.ceil(7.1));  // 8
console.log(Math.round(7.5)); // 8

43. Floating-point fix

const sum = Number((0.1 + 0.2).toFixed(1));
console.log(sum); // 0.3

44. Using == instead of ===

console.log(5 == "5"); // true

Better:

console.log(5 === "5"); // false

45. Forgetting that + may join strings

console.log("5" + 2); // "52"

This is not 7.

46. Thinking Number("25px") will work

console.log(Number("25px")); // NaN

If you need the number at the beginning, use:

console.log(Number.parseInt("25px"));   // 25
console.log(Number.parseFloat("25px")); // 25

47. Forgetting that toFixed() gives a string

const value = (5.678).toFixed(2);
console.log(typeof value); // "string"

48. Comparing floating-point results directly

console.log(0.1 + 0.2 === 0.3); // false

Direct comparison with decimal calculations can be unreliable.

49. Main ideas

Comparison operators

Used to compare values and return true or false.

>

Greater than.

<

Less than.

>=

Greater than or equal to.

<=

Less than or equal to.

== and !=

Non-strict equality operators. They can convert types automatically.

=== and !==

Strict equality operators. They compare both value and type.

Number()

Converts a value to a number.

NaN

Means "Not a Number".

Number.parseInt()

Reads an integer from a string.

Number.parseFloat()

Reads a decimal number from a string.

Math.floor()

Rounds down.

Math.ceil()

Rounds up.

Math.round()

Rounds to the nearest integer.

Math.max()

Returns the largest value.

Math.min()

Returns the smallest value.

Math.random()

Returns a random number from 0 to less than 1.

Floating-point numbers

Decimal numbers that may cause precision problems.

toFixed()

Rounds a number to a fixed number of digits after the decimal point and returns a string.

50. Revision block

1. Comparison operators return true or false
2. >, <, >=, <= compare values
3. Use === and !== instead of == and !=
4. Number() converts values to numbers
5. Invalid conversion gives NaN
6. parseInt() reads integers from strings
7. parseFloat() reads decimal numbers from strings
8. + may concatenate instead of add
9. Math.floor() rounds down
10. Math.ceil() rounds up
11. Math.round() rounds normally
12. Math.max() gives the biggest value
13. Math.min() gives the smallest value
14. Math.random() gives a random number
15. 0.1 + 0.2 is not exactly 0.3
16. toFixed() returns a string

51. Final conclusion

This topic is very important because it teaches you how JavaScript:

If you understand this well, you will avoid many beginner mistakes.

This knowledge is also very useful later in:

⬅ Back