JavaScript — Operators

A guide to describing how JavaScript works with operators

Andressa Araujo
6 min readMay 4, 2021
Photo by Science in HD on Unsplash

Like other programming languages, JavaScript provides a set of built-in operators to support general functions. In JavaScript create new operators or overload them by changing their functions is not allowed because this significantly complicates conversions. JavaScript syntax includes different kinds of operators, like arithmetics, logical, assignment, comparison, type and others. This chapter is going to explain how to use some operators in JavaScript.

These resources include a set of arithmetic operators to calculate numbers and create expressions. Using these operators placed between two numbers mathematics results will be obtained. These Arithmetic operators are represented by + to addition, * multiplication, - subtraction, \ division, and % module.

const subTotal = 10;
const discount = 2;
let taxRate = 5 / 100;
let total = subTotal — discount;
let amountTax = total * taxRate;
let charge = total + amountTax;
console.log(`Your order total is: ${charge}…`);

Console:

Your order total is: 8.4

These operators can compute simple calculus, although It is possible to create more complex expressions, combining these operators in one action. In JavaScript, the order of operations is the same as arithmetic, it has the parentheses effect as well.

const subTotal = 10;
const discount = 2;
const taxRate = 5;
let charge = (subTotal — discount) + ((subTotal — discount) * (taxRate / 100));console.log(`Your order total is: ${charge}…`);

Console:

Your order total is: 8.4

JavaScript includes another kind of operator to assign values to variables with fewer keystrokes called assignment operators. The most simple assignment operator is = which assigns a value to a variable. More complex assignments can be done by compounding an assignment with other operators to be evaluated on the current variable value and then modify variables contents.

For example, the assignment operator -= will decrease the given number from the variable. The += operator will sum up a given number with the current variable value. The *= will multiply left and right operand values and assign the result to the left operand. The \= operator will divide the left operand value by the right operand value. Lastly, get the modulus of the left operand by using %=.

let votes = 5;votes += 10;
votes -= 3;
votes *= 2;
votes /= 3;
console.log(`Votes: ${votes}`);

Console:

Votes: 8

Is the same as:

let votes = 5votes = votes + 10;
votes = votes — 3;
votes = votes * 2;
votes = votes / 3;
console.log(`Votes: ${votes}`);

Console:

Votes: 8

Another important operator included in JavaScript resources is the logical operators. They allow the variable comparison to return boolean values or consider a condition to change the following instructions. The comparison result could be true or false. The logical operator is:

  • And: &&
  • Or: ||
  • Not: !

The And logical operator is represented by a double ampersand && and return true only when both conditions compared after turned for boolean are true as well. This operator has a resource called short circuit evaluation, which means that behind the scenes, JavaScript will only check the second condition if the first condition is true. The evaluation is considered from left to right and stops when finding a false or the last value, in this case, returning the last value evaluated.

const graduate = false;
const experient = true;
const senior = graduate && experient;console.log(`The candidate is senior? ${senior}.`)

Console:

The candidate is senior? false.

Double pipe || represents the Or logical operator. It works like the And logical operator, considering the short-circuited and the evaluation direction, although returns true once find the first true value.

const graduate = false;
const experient = true;
let mid;if (graduate || experient) {
mid = true;
};
console.log(`The candidate is mid? ${mid}.`);

Console:

The candidate is mid? true.

The Not logical operator is interpreted by an exclamation point! and is used to negate the state returning false for the boolean value true and the opposite is true. There are some particular cases, as !undefined, !null and !NaN or !”” is resulted in true, while !0, !{} return false. This behaviour occurs because under the hood the JavaScript converts the non-boolean value to boolean and then negates it. The double negation just converts the value variable to boolean.

const graduate = false;
const experient = true;
const junior = !graduate && !experient;console.log(`The candidate is junior? ${junior}.`);

Console:

The candidate is junior? false.

JavaScript provides another kind of operator called comparison operator, it is used to compare two values and give back a boolean value that could be true or false, used in decision making.

const george = 8;
const charlotte = 6;
if(george <= charlotte) {
console.log(“George is younger than Charlotte.”);
} else {
console.log(“George is older than Charlotte.”);
};

Console:

George is older than Charlotte.

It always evaluates considering the direction from left to right. The two values between the comparison operators are called operands. The comparisons could be:

  • Equal to: ==
  • Not equal: !=
  • Greater than: >
  • Less than: <
  • Greater than or equal to: >=
  • Less than or equal to: <=

By default, the comparison operator parses the operands that could be converted, before evaluating the condition.

const beth = “100”;
const charles = 75;
if(charles >= beth) {
console.log(“Beth is younger than Charles.”);
} else {
console.log(“Beth is older than Charles.”);
};

Console:

Beth is older than Charles.

JavaScript works with simple comparisons which evaluate just the values and the strict comparison that compare the values and the data type between the operands.

const arch = “3”;
const louis = 3;
if(arch == louis) {
console.log(“Arch and Louis are the same age.”);
} else {
console.log(“Arch and Louis are not the same age.”);
};

Console:

Arch and Louis are the same age.

The comparison operators eligible for strict comparison are equal to and not equal. To do the strict comparison an extra equal operator =is needed on the eligible comparison operators mentioned before.

const arch = “3”;
const louis = 3;
if(arch === louis) {
console.log(“Arch and Louis are the same age.”);
} else {
console.log(“Arch and Louis are not the same age.”);
}

Console:

Arch and Louis are not the same age.

JavaScript implements Type operators, which returns a string, indicating the type of the unevaluated variable. The syntax to explore this resource consists of the keyword type of following the operator.

let followers = “2”;
let type = typeof followers;
console.log(`The variable followers is a ${type}.`);
followers = 2;
console.log(`Now variable followers is a ${typeof followers}.`);

Console:

The variable followers is a string.
Now variable follower is a number.

The instanceof is a JavaScript built-in operator to check if the operand is an instance of the object given. An instance is a copy of a specific Object. The instanceof operator syntax consists of the operand, which could be a variable that should be tested, the keyword instanceof and then the object to evaluate. The return will be true if the value is an occurrence of the given object or falseif it is not an instance of the given object.

let follower = {
name: “Rose”,
age: 42,
active: true
};
let isObject = follower instanceof Object;
console.log(`Is follower variable object type? ${isObject}.`);
follower = null;
console.log(`Is follower variable object type? ${follower instanceof Object}.`);

Console:

Is follower variable object type? true.
Is follower variable object type? false.

JavaScript gives the concatenate operator to manipulate string values easily by using + between string to result in another string made by those two previous.

const subject = “Harry “;
const verb = “is “;
const adjective = “the chosen one.”;
let sentence = subject + verb + adjective;
console.log(sentence);

Console:

Harry is the chosen one.

It is allowed to concatenate and assign variables to a string by using += building more complex strings.

const age = 16;
let sentence = “Harry “;
sentence += “is “ + age;
console.log(sentence + “ years old!”);

Console:

Harry is 16 years old!

Increment or decrement of a Number with JavaScript also allowed by the following syntax: number variable follow by double plus i++to increment or double minus i--to decrement. It is commonly used inside loops.

References

--

--

Andressa Araujo

I have been working as a full-stack software developer for 5 years. I am committed to solving people’s real problems with creativity.