JavaScript: Operators

JavaScript Operators and Type Conversions

javascript
operators
type-conversion
JavaScript Operators - Arithmetic, Assignment, Comparison, and Type Conversions
Author

Pedro GeoGIS

Published

Monday, January 13, 2025

Modified

Monday, October 13, 2025

1 Overview

📘 Operators

Operators are symbols that perform operations on values and variables in JavaScript. They include arithmetic operators (+, -, *, /), assignment operators (=, +=, -=), comparison operators (==, ===, !=), logical operators (&&, ||, !), and more. JavaScript also performs automatic type conversions when operators are applied to different data types, which is important to understand for writing correct code.

2 Terms: Unary, Binary, Operand

Before we dive into operators, let’s understand some terminology:

  • Operand: What operators are applied to. In 5 * 2, there are two operands: 5 (left) and 2 (right)
  • Unary operator: Has a single operand. Example: -x (negation)
  • Binary operator: Has two operands. Example: x - y (subtraction)

2.1 Unary Operator Example

let x = 1;
x = -x;
alert(x); // -1, unary negation was applied

2.2 Binary Operator Example

let x = 1, y = 3;
alert(y - x); // 2, binary minus subtracts values

3 Arithmetic Operators

The following math operations are supported:

  • Addition: +
  • Subtraction: -
  • Multiplication: *
  • Division: /
  • Remainder: %
  • Exponentiation: **

3.1 Basic Operations

alert(5 + 2);  // 7  (addition)
alert(5 - 2);  // 3  (subtraction)
alert(5 * 2);  // 10 (multiplication)
alert(5 / 2);  // 2.5 (division)

3.2 Remainder %

The remainder operator % returns the remainder of integer division:

alert(5 % 2);  // 1 (remainder of 5 divided by 2)
alert(8 % 3);  // 2 (remainder of 8 divided by 3)
alert(10 % 5); // 0 (no remainder)

3.3 Exponentiation **

The exponentiation operator ** raises a number to a power:

alert(2 ** 2); // 4  (2 squared)
alert(2 ** 3); // 8  (2 cubed)
alert(2 ** 4); // 16 (2 to the power of 4)

It also works with non-integer powers:

alert(4 ** (1/2)); // 2 (square root of 4)
alert(8 ** (1/3)); // 2 (cube root of 8)

4 String Concatenation with Binary +

Usually, the plus operator + sums numbers. But if the binary + is applied to strings, it merges (concatenates) them:

let s = "my" + "string";
alert(s); // mystring

4.1 String + Number

If any of the operands is a string, the other one is converted to a string too:

alert('1' + 2);  // "12"
alert(2 + '1');  // "21"

4.2 Order Matters

alert(2 + 2 + '1'); // "41" and not "221"

Here, operators work left to right. First 2 + 2 = 4, then 4 + '1' = "41".

alert('1' + 2 + 2); // "122" and not "14"

Here, the first operand is a string, so all operands are treated as strings: '1' + 2 = "12", then "12" + 2 = "122".

Important

The binary + is the only operator that supports strings this way. Other arithmetic operators work only with numbers and always convert their operands to numbers.

alert(6 - '2');   // 4, converts '2' to a number
alert('6' / '2'); // 3, converts both operands to numbers

5 Numeric Conversion: Unary +

The unary plus + applied to a single value doesn’t do anything to numbers. But if the operand is not a number, it converts it into a number:

// No effect on numbers
let x = 1;
alert(+x); // 1

let y = -2;
alert(+y); // -2

// Converts non-numbers
alert(+true);  // 1
alert(+"");    // 0
alert(+"123"); // 123

It does the same thing as Number(...), but is shorter.

5.1 Practical Example

let apples = "2";
let oranges = "3";

alert(apples + oranges); // "23", the binary plus concatenates strings

// Convert and then sum
alert(+apples + +oranges); // 5

// Longer variant
alert(Number(apples) + Number(oranges)); // 5

6 Assignment Operator

The assignment operator = assigns a value to a variable:

let x = 5;
let y = 10;

6.1 Assignment Returns a Value

The assignment = returns a value. The call x = value writes the value into x and then returns it:

let a = 1;
let b = 2;

let c = 3 - (a = b + 1);

alert(a); // 3
alert(c); // 0

6.2 Chaining Assignments

let a, b, c;

a = b = c = 2 + 2;

alert(a); // 4
alert(b); // 4
alert(c); // 4

Chained assignments evaluate from right to left: c = 4, then b = 4, then a = 4.

7 Modify-in-Place

We often need to apply an operator to a variable and store the result in that same variable:

let n = 2;
n = n + 5;
n = n * 2;

This can be shortened using += and *=:

let n = 2;
n += 5; // now n = 7 (same as n = n + 5)
n *= 2; // now n = 14 (same as n = n * 2)
alert(n); // 14

7.1 All Modify-and-Assign Operators

Short “modify-and-assign” operators exist for all arithmetic operators:

let n = 10;

n += 5;  // n = n + 5  → 15
n -= 3;  // n = n - 3  → 12
n *= 2;  // n = n * 2  → 24
n /= 4;  // n = n / 4  → 6
n %= 4;  // n = n % 4  → 2
n **= 3; // n = n ** 3 → 8

8 Increment/Decrement

Increasing or decreasing a number by one is very common, so there are special operators:

  • Increment ++: increases a variable by 1
  • Decrement --: decreases a variable by 1
let counter = 2;
counter++;        // works the same as counter = counter + 1
alert(counter);   // 3

counter--;        // works the same as counter = counter - 1
alert(counter);   // 2
Warning

Increment/decrement can only be applied to variables. Using it on a value like 5++ will give an error.

8.1 Prefix vs Postfix

The operators ++ and -- can be placed either before or after a variable:

  • Postfix form: counter++ (operator after variable)
  • Prefix form: ++counter (operator before variable)

Both increase counter by 1, but there’s a difference in the returned value.

8.2 Prefix Form

The prefix form returns the new value:

let counter = 1;
let a = ++counter; // prefix increments and returns new value
alert(a); // 2

8.3 Postfix Form

The postfix form returns the old value (prior to increment):

let counter = 1;
let a = counter++; // postfix increments but returns old value
alert(a); // 1
alert(counter); // 2

8.4 When to Use Which

  • If you don’t use the returned value, both forms are the same:
let counter = 0;
counter++;
++counter;
alert(counter); // 2
  • Use prefix if you want to increase and immediately use the new value:
let counter = 0;
alert(++counter); // 1
  • Use postfix if you want to use the old value:
let counter = 0;
alert(counter++); // 0
alert(counter);   // 1

9 Operator Precedence

If an expression has more than one operator, the execution order is defined by their precedence.

From highest to lowest:

Precedence Operator Description
14 ++, -- Increment/Decrement (prefix)
13 ** Exponentiation
12 *, /, % Multiplication, Division, Remainder
11 +, - Addition, Subtraction
2 = Assignment

9.1 Example

let x = 2 * 2 + 1;
alert(x); // 5 (multiplication first, then addition)

let y = 2 + 2 * 2;
alert(y); // 6 (multiplication first, then addition)

10 Type Conversions

JavaScript automatically converts types when needed. This is called implicit type conversion or type coercion.

10.1 String Conversion

Occurs when we output something. Can be performed explicitly with String(value):

let value = true;
alert(typeof value); // boolean

value = String(value); // now value is a string "true"
alert(typeof value); // string

10.2 Numeric Conversion

Happens automatically in mathematical operations. Can be performed explicitly with Number(value):

alert("6" / "2"); // 3, strings are converted to numbers

Explicit conversion:

let str = "123";
alert(typeof str); // string

let num = Number(str); // becomes a number 123
alert(typeof num); // number

10.3 Numeric Conversion Rules

Value Becomes
undefined NaN
null 0
true 1
false 0
"" (empty string) 0
" " (whitespace) 0
"123" 123
"123abc" NaN 
alert(Number("   123   ")); // 123
alert(Number("123z"));      // NaN (error reading a number at "z")
alert(Number(true));        // 1
alert(Number(false));       // 0
alert(Number(null));        // 0
alert(Number(undefined));   // NaN

10.4 Boolean Conversion

Happens in logical operations. Can be performed explicitly with Boolean(value):

Rules: - Values that are intuitively “empty” (0, "", null, undefined, NaN) become false - Other values become true

alert(Boolean(1));          // true
alert(Boolean(0));          // false
alert(Boolean("hello"));    // true
alert(Boolean(""));         // false
alert(Boolean("0"));        // true (non-empty string)
alert(Boolean(" "));        // true (space is non-empty)

11 Comparison Operators

Comparison operators return a boolean value:

  • Greater/less than: a > b, a < b
  • Greater/less than or equals: a >= b, a <= b
  • Equality: a == b (with type coercion)
  • Strict equality: a === b (without type coercion)
  • Not equal: a != b
  • Strict not equal: a !== b

11.1 String Comparison

Strings are compared letter-by-letter in “dictionary” order:

alert('Z' > 'A'); // true
alert('Glow' > 'Glee'); // true
alert('Bee' > 'Be'); // true

11.2 Different Types Comparison

When comparing values of different types, JavaScript converts them to numbers:

alert('2' > 1);  // true, string '2' becomes number 2
alert('01' == 1); // true, string '01' becomes number 1
alert(true == 1); // true
alert(false == 0); // true

11.3 Strict Equality ===

The regular equality check == has a problem – it cannot differentiate 0 from false:

alert(0 == false); // true

The strict equality operator === checks equality without type conversion:

alert(0 === false); // false, because types are different

12 Examples

12.1 Example 1: Calculator

let a = 10;
let b = 5;

console.log(`${a} + ${b} = ${a + b}`);   // 10 + 5 = 15
console.log(`${a} - ${b} = ${a - b}`);   // 10 - 5 = 5
console.log(`${a} * ${b} = ${a * b}`);   // 10 * 5 = 50
console.log(`${a} / ${b} = ${a / b}`);   // 10 / 5 = 2
console.log(`${a} % ${b} = ${a % b}`);   // 10 % 5 = 0
console.log(`${a} ** ${b} = ${a ** b}`); // 10 ** 5 = 100000

12.2 Example 2: Type Coercion

console.log("5" + 3);      // "53" (string concatenation)
console.log("5" - 3);      // 2 (numeric subtraction)
console.log("5" * "2");    // 10 (numeric multiplication)
console.log(true + 1);     // 2 (true becomes 1)
console.log(false + 1);    // 1 (false becomes 0)
console.log(null + 1);     // 1 (null becomes 0)
console.log(undefined + 1); // NaN (undefined becomes NaN)

12.3 Example 3: Increment/Decrement

let x = 5;
console.log(x++); // 5 (returns old value, then increments)
console.log(x);   // 6

let y = 5;
console.log(++y); // 6 (increments, then returns new value)
console.log(y);   // 6

13 Summary

  • JavaScript supports standard arithmetic operators: +, -, *, /, %, **
  • Binary + concatenates strings if any operand is a string
  • Unary + converts values to numbers
  • Modify-in-place operators: +=, -=, *=, /=, etc.
  • Increment ++ and decrement -- have prefix and postfix forms
  • Prefix returns new value, postfix returns old value
  • Type conversions happen automatically or can be done explicitly
  • Use === for strict equality (no type conversion)
  • Use == for equality with type conversion
Back to top