Operators and Type Conversion

Objectives

By the end of this chapter, you should be able to:

• Use arithmetic, comparison, logical, and assignment operators
• Explain the difference between == and ===, and why this course uses ===
• Convert values between types on purpose with Number(), String(), and Boolean()
• Recognize implicit type conversion (coercion) when JavaScript does it for you

💡 Why this matters: Operators are how you combine and compare values. Type conversion decides what actually happens when those values aren’t the same type, which trips up a lot of beginners if it isn’t concrete.

Arithmetic Operators

These work on numbers the way you’d expect from math class.

console.log(5 + 2);
// 7

console.log(5 - 2);
// 3

console.log(5 * 2);
// 10

console.log(5 / 2);
// 2.5

console.log(5 % 2);
// 1

% is the remainder operator (also called modulo): it returns what’s left over after division. 5 % 2 is 1 because 2 goes into 5 twice with 1 left over. It’s commonly used to check whether a number is even:

console.log(4 % 2);
// 0

console.log(7 % 2);
// 1

Comparison Operators

Comparison operators compare two values and produce a boolean (true or false).

console.log(5 > 2);
// true

console.log(5 < 2);
// false

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

console.log(5 <= 4);
// false

For equality, JavaScript gives you two different operators, and the difference matters.

== (loose equality) converts the two values to the same type before comparing them:

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

=== (strict equality) compares both value and type, with no conversion:

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

5 and "5" hold the same digit, but one is a number and the other is a string. == hides that difference by converting one side; === respects it. The conversion rules behind == are easy to get wrong and have caused real bugs in real programs, so this course uses === (and !== for “not equal”) everywhere. Treat == as something to recognize in other people’s code, not something to write yourself.

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

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

Logical Operators

Logical operators combine or invert booleans.

&& (AND) is true only if both sides are true:

console.log(true && true);
// true

console.log(true && false);
// false

|| (OR) is true if at least one side is true:

console.log(true || false);
// true

console.log(false || false);
// false

! (NOT) flips a boolean:

console.log(!true);
// false

console.log(!false);
// true

These become especially useful once you combine them with comparisons:

const age = 20;
console.log(age >= 13 && age <= 19);
// false

Assignment Operators

= assigns a value. JavaScript also has shorthand operators that combine an operation with assignment.

let total = 10;

total += 5;
console.log(total);
// 15

total -= 3;
console.log(total);
// 12

total *= 2;
console.log(total);
// 24

total /= 4;
console.log(total);
// 6

total += 5 is shorthand for total = total + 5. The other three work the same way, with -, *, and /.

Explicit Type Conversion

Sometimes you need a value in a different type on purpose: turning user-entered text into a number, for example. JavaScript gives you three conversion functions for that.

Number() converts to a number:

console.log(Number("42"));
// 42

console.log(Number("42") + 1);
// 43

console.log(Number("not a number"));
// NaN

NaN stands for “Not a Number.” It’s what you get when a conversion to a number fails. NaN is itself technically of type number, which is another JavaScript quirk worth knowing about but not dwelling on.

String() converts to a string:

console.log(String(42));
// 42

console.log(typeof String(42));
// string

Boolean() converts to a boolean. Most values convert to true; a short list of “falsy” values convert to false: 0, "" (empty string), null, undefined, and NaN.

console.log(Boolean(1));
// true

console.log(Boolean(0));
// false

console.log(Boolean(""));
// false

console.log(Boolean("hello"));
// true

Implicit Type Conversion (Coercion)

Coercion is when JavaScript converts a type for you, automatically, without you calling Number(), String(), or Boolean() yourself. It happens most often with +, and the results surprise a lot of beginners.

console.log("5" + 1);
// 51

+ between a string and a number converts the number to a string and joins them as text, because + doubles as both addition and string concatenation, and JavaScript picks concatenation whenever either side is a string.

Compare that to -:

console.log("5" - 1);
// 4

- has no meaning for text, so JavaScript converts "5" to the number 5 and subtracts normally. Same starting value, same second operand, two completely different results depending on the operator. This is exactly why explicit conversion matters: if you want a number, call Number() yourself instead of relying on which operator happens to coerce which way.

console.log(Number("5") + 1);
// 6

Try It

1. Use % to check whether 17 is even or odd, and log the result.
2. Compare 10 == "10" and 10 === "10", and log both. Explain in a comment why they differ.
3. Log the result of "3" + 4 and, separately, "3" - 4. Explain in a comment why they differ.
4. Convert the string "100" to a number with Number(), add 1 to it, and log the result.
5. Log Boolean("") and Boolean("false"). Both look empty or negative at a glance. Are they?

Recap

• Arithmetic operators (+ - * / %) work on numbers; % gives you the remainder.
• === compares value and type with no conversion; == converts first. This course uses ===.
• &&, ||, and ! combine and invert booleans.
• Number(), String(), and Boolean() convert types explicitly, on purpose.
• Coercion converts types implicitly. "5" + 1 becomes "51" (string), while "5" - 1 becomes 4 (number), because + and - coerce differently.

Next lesson: console.log() and its siblings, comments, coding conventions, and strict mode.