JavaScript Operators

Operators are the symbols that make things happen: they do the math, store the values, compare things, and combine answers. You have already used a few. This lesson is the map of the whole territory: what each group of operators is for, with a quick taste of each. The next few lessons then go deep on the groups one at a time.

• The assignment operator = assigns values
• The addition operator + adds values
• The multiplication operator * multiplies values
• The comparison operator > compares values

let x = 5;            // assign 5 to x
let y = 2;            // assign 2 to y
let z = x + y;        // add them, assign the result to z
let big = z > 5;      // compare: is z greater than 5?
console.log(z, big);

// Operands and Operators

The values an operator works on are called operands. The operator is the symbol that says what to do with them:

Most operators take two operands, one on each side. These are called binary operators. A few take just one and are called unary. And exactly one operator takes three, the conditional ? :, which is why it is often just called the ternary (from the Latin for "three"):

// Binary: two operands
5 + 3
10 * 2

// Unary: one operand
-x               // negation: flips the sign
!true            // logical NOT: gives false
typeof 42        // gives "number"

// Ternary: three operands
age >= 18 ? "adult" : "minor"

// Types of Operators

// Arithmetic Operators

Arithmetic operators do math on numbers. Operands can be literals, variables, or whole expressions:

let a = 3;
let x = (100 + 50) * a;
console.log(x);

// Assignment Operators

= stores a value. The compound assignment operators do a bit of math and store the result in one step, so you do not have to write the variable name twice:

let x = 10;
x += 5;          // same as x = x + 5
console.log(x);

// String Operators

When used on strings, + is called the concatenation operator: it joins them end to end.

let text1 = "John";
let text2 = "Doe";
let text3 = text1 + " " + text2;    // note the " " for the space
console.log(text3);

+= works on strings too, adding text onto the end of what is already there:

let text = "What a very ";
text += "nice day";
console.log(text);

Adding strings and numbers

Adding two numbers gives a number. But if either operand is a string, + joins instead of adding, and the result is a string:

let x = 5 + 5;
let y = "5" + 5;
let z = "Hello" + 5;
console.log(x);
console.log(y);
console.log(z);

// Comparison Operators

Comparison operators compare two values and always give back true or false. Given let x = 5;:

They work on strings too, comparing alphabetically: "A" < "B" is true. The JS Comparisons lesson covers the surprises that come with that.

// Logical Operators

Logical operators combine true/false answers into one:

let age = 16;
console.log(age >= 13 && age <= 19);   // a teenager?

// Operator Precedence

When an expression has several operators, JavaScript follows an order, just like order of operations in math class. Multiplication and division happen before addition and subtraction; parentheses override everything:

console.log(2 + 3 * 4);      // * first: 2 + 12
console.log((2 + 3) * 4);    // parentheses first: 5 * 4

// Quick Check

console.log("8" + 2);
console.log("8" - 2);

// Try It

▶ Open Playground

1. Click Open Playground. Predict both lines, then click Run. Which operator went first on line 1?
2. Log "10" + 5, "10" - 5, and "10" * 5. Then log the typeof of each result
3. Build a full name: let name = "Ada"; then use += to add a space and a last name. Log it
4. Declare let x = 5; and log every comparison operator from the table against 8. Predict each answer first