3.

# Operators

In the last lesson, we talked about programming being a matter of computing information. Using operators is a big part of doing computations. After all, we haven’t yet covered any tools that allow us to combine values together. As you will see in a moment, operators are symbols that operate on values to obtain a new value. Syntactically, spacing doesn’t make much difference but it makes code easier to read.

Remember that variables hold values, which means we can either use operators on plain values or on variables. Also, operators will only make sense when applied to values of a specific type.

The code examples here will use comments (marked by `//`) to show what the `console.log` lines should print. Comments are a way of leaving human-friendly notes in code that have no effect when the code is run. Instead of reading passively, I encourage you to follow along by running the code examples with node, either using the REPL or a file.

## Arithmetic operators

These operators allow us to perform basic arithmetic on values of the number type. You should already be familiar with how most of these operators work from basic math.

### Addition (`+`)

``````console.log(3 + 4); // prints 7

const x = 3 + 4;
console.log(x); // prints 7

const a = 3;
const b = 4;
const c = a + b;
console.log(c); // prints 7``````

### Subtraction (`-`)

Subtract one number from another.

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

### Division (`/`)

Divide one number by another.

``````console.log(6 / 3); // 2
console.log(6 / -5); // -1.2
console.log(10 / 9); // 1.1111111111111112``````

### Multiplication (`*`)

Multiply two numbers together.

``````console.log(2 * 2); // 4
console.log(3 * -10); // -30``````

### Exponentiation (`**`)

Raise one number to the power of another. Usually the `^` symbol is used, but JavaScript has reserved it for a different operation.

``````console.log(2**3); // 8
console.log(9**0.5); // 3
console.log(2**0.5); // 1.4142135623730951``````

### Remainder (`%`)

Get the remainder left over from dividing one number by another. Using the result of `n % 2` is a neat trick to check if `n` is even (the result is 0 for even, or 1 for odd).

``````console.log(2 % 2); // 0
console.log(3 % 2); // 1
console.log(4 % 2); // 0
console.log(10 % 5); // 0
console.log(5 % 10); // 5``````

## Logical (boolean) operators

These operators work on boolean type values (true or false). These kinds of operations might seem a bit foreign, but you actually use them on a regular basis in normal language even if you don’t notice it. Whenever you say something that is considered true or false, you can use one of the following operators to get a new true-or-false result. We will look at plain English examples along the way.

### Not (`!`)

As in plain English, not simply inverts a boolean value. When true and false are the only choices, anything not true is false, and anything not false is true.

“January is the first month of the year” is true.

“January is not the first month of the year” is false.

“February is the first month of the year” is false.

“February is not the first month of the year” is true.

``````console.log(!true); // false
console.log(!false); // true

const a = true;
const b = !a;
console.log(b); // false
const c = !b;
console.log(c); // true``````

### And (`&&`)

A way to combine two boolean values that results in true only when both values are true, otherwise the result is false.

“January is the first month of the year and February is the second month of the year” is true, because both parts are true.

“January is the first month of the year and February is the first month of the year” is false, because the second part is false.

“January is the second month of the year and February is the second month of the year” is false, because the first part is false.

“January is the second month of the year and February is the first month of the year” is false, because both parts are false.

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

const a = true;
const b = false;
const c = a && b;
console.log(c); // false``````

### Or (`||`)

A way to combine two boolean values that results in true when either value is true, otherwise the result is false. In other words, it is only false when both values are false.

“January is the first month of the year or February is the second month of the year” is true, because both parts are true.

“January is the first month of the year or February is the first month of the year” is true, because the first part is true.

“January is the second month of the year or February is the second month of the year” is true, because the second part is true.

“January is the second month of the year or February is the first month of the year” is false, because both parts are false.

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

const a = true;
const b = false;
const c = a || b;
console.log(c); // true``````

## Relational and equality operators

What these operators do will also be familiar in an intuitive sense. These will allow us to compare various types of values, but always give a boolean value (true or false) as a result.

### Less than (`<`), less than or equal (`<=`)

Checks that a number is less than (or equal to) another number. Results in a boolean value (true or false). These operators can technically work on other types than numbers, but it’s not commonly done (read MDN for more information).

``````console.log(1 < 2); // true
console.log(2 < 1); // false
console.log(2 < 2); // false
console.log(2 <= 2); // true
console.log(1 <= 2); // true
console.log(3 <= 2); // false``````

### Greater than (`>`), greater than or equal (`>=`)

Checks that a number is greater than (or equal to) another number. Results in a boolean value (true or false).

``````console.log(1 > 2); // false
console.log(2 > 1); // true
console.log(2 > 2); // false
console.log(2 >= 2); // true
console.log(1 >= 2); // false
console.log(3 >= 2); // true``````

### Equality (`===`)

Checks that two values are equal. Results in true if they are equal, otherwise false.

For the most part, this comparison works the way you would expect it to. If the two values are different types, they can’t be considered equal.1 If they are the same type, they must be the exact same value to be considered equal. Unfortunately, for anything that JavaScript considers an object internally, the intuition breaks down; so it’s best not to use equality operators on functions, arrays, or objects.2

``````console.log(undefined === undefined); // true
console.log(undefined === null); // false
console.log(null === null); // true
console.log(null === 1); // false
console.log(1 === 1); // true
console.log(1 === 2); // false
console.log(false === false); // true
console.log(true === true); // true
console.log(true === false); // false
console.log('apple' === 'apple'); // true
console.log('apple' === 'orange'); // false
console.log([] === []); // false
console.log({} === {}); // false``````

### Inequality (`!==`)

Checks that two values are not equal. Results in false if they are equal, otherwise true. This is the opposite of equality. It is the same as using the ! operator on an expression that uses equality.

``````console.log(undefined !== undefined); // false
console.log(!(undefined === undefined)); // false
console.log(undefined !== null); // true
console.log(null !== null); // false
console.log(null !== 1); // true
console.log(1 !== 1); // false
console.log(1 !== 2); // true
console.log(false !== false); // false
console.log(true !== true); // false
console.log(true !== false); // true
console.log('apple' !== 'apple'); // false
console.log('apple' !== 'orange'); // true
console.log([] !== []); // true
console.log({} !== {}); // true``````

## String operators

### Concatenation (`+`)

Put two strings together. This is the same symbol as addition for numbers.

``````const a = 'Hello, ';
const b = 'world!';
console.log(a + b); // prints "Hello, world!"``````

## Using operators

Naturally, we don’t have to use these operators in isolation. They can be combined in countless ways to achieve different results.

Now that we have some interesting tools to use, it’s a good time to try executing a JavaScript file full of code instead of using the REPL. While the REPL allows us to write code directly in it, it’s not so great for general programming where we want to write chunks of code and re-run it with changes. Try copying the following block of code into a file called “script.js”, then run the file with node using the terminal: `node script.js`.

``````// This is a comment because it begins with two slashes. It has no effect on the code and is only for humans to read.
// You will see many comments in code as a way of adding clarification or helpful notes
const temperatureF = 77;
const temperatureC = (temperatureF - 32) * (5 / 9);
console.log(temperatureC); // should be 25
console.log(temperatureF > temperatureC); // true

const weatherToday = 'rain';
const weatherTomorrow = 'sunny';
const rainTodayOrTomorrow = (weatherToday === 'rain') || (weatherTomorrow === 'rain'); // brackets for clarity
console.log(rainTodayOrTomorrow); // true, because today is rainy
const rainTodayAndTomorrow = (weatherToday === 'rainy') && (weatherTomorrow === 'rain');
console.log(rainTodayAndTomorrow); // false, because tomorrow is sunny

const berryIsEdible =
berry === 'blueberry'
|| berry === 'raspberry'
|| berry === 'blackberry'
|| berry === 'strawberry'
|| berry === 'cranberry';
console.log(berryIsEdible); // only true if the berry is one of the edible berries

const pokeBowlSize = 'small';
const pokeBowlBase = 'mixed rice';
const pokeBowlProtein = 'salmon';
const pokeBowlSauce = 'shoyu';
// This is a long one, but with clever formatting it is not hard to read
const validPokeBowl = (
(pokeBowlSize === 'small' || pokeBowlSize === 'medium' || pokeBowlSize === 'large')
&& (pokeBowlBase === 'sushi rice' || pokeBowlBase === 'mixed rice' || pokeBowlBase === 'zucchini')
&& (pokeBowlProtein === 'tuna' || pokeBowlProtein === 'salmon' || pokeBowlProtein === 'shrimp' || pokeBowlProtein === 'beef')
&& (pokeBowlSauce === 'sesame' || pokeBowlSauce === 'shoyu' || pokeBowlSauce === 'ginger honey' || pokeBowlSauce === 'hot sauce')
);
console.log(validPokeBowl);``````

When you run this code, you should notice that the `console.log` statements are printed in your terminal in the same order they’re written here.

Try changing the values and adding more code. Get creative!

1. There is also a less strict equality operator (`==`), but it works unintuitively so it is advised not to use it.↩︎