JavaScript Operators Reference

As you may know, operators are used to perform specific mathematical and logical computations on operands.

We know many operators from school. They are things like addition +, multiplication *, subtraction -, and so on.

in this article, we’ll start with the simple operators, then concentrate on the javaScript-specific aspects, that are not covered by school arithmetic

But before we move on, let’s grasp some common terminology.

• An operand – is what operators are applied to. For instance, in the multiplication of 5 * 2 there are two operands: the left operand is 5 and the right operand is 2. Sometimes, people call these “arguments” instead of “operands”.
• An operator is unary if it has a single operand. For example, the unary negation - reverses the sign of a number:

let x = 1;

x = - x ;

alert( x )

Maths

The following math operations are supported:

• Addition +,
• Subtraction ``,
• Multiplication ``,
• Division /,
• Remainder %,
• Exponentiation *.

The first four are straightforward, while % and ** need a few words about them.

Despite its visual similarity, the modulus operator (%), is unrelated to percentages.

The result of a % b is the remainder of the integer division of a by b

For instance:

alert( 5 % 2 ); // 1, the remainder of 5 divided by 2

alert( 8 % 3 ); // 2, the remainder of 8 divided by 3

alert( 8 % 4 ); // 0, the remainder of 8 divided by 4

JavaScript Comparison Operators

JavaScript Comparison Operators are crucial for equality or difference comparisons between values. Here is a summary of some important comparison operators:

OPERATOR NAME	OPERATION
Equality(==)	Compares the equality of two operators.
Inequality(!=)	Compares inequality of two operators.
Strict Equality(===)	Compares both value and type of the operand.
Strict Inequality(!==)	Compares inequality with type.
Greater than(>)	Checks if the left operator is greater than the right operator.
Greater than or equal(>=)	Checks if the left operator is greater than or equal to the right operator.
Less than(<)	Checks if the left operator is smaller than the right operator.
Less than or equal(<=)	Checks if the left operator is smaller than or equal to the right operator.

String concatenation with binary

Let’s meet the features of JavaScript operators that are beyond school arithmetics.

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

Note that if any of the operands is a string, then the other one is converted to a string too.

For example:

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

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

See, it doesn’t matter whether the first operand is a string or the second one.

Operator precedence

When dealing with expressions that have multiple operators, the order in which they're executed is determined by their precedence – essentially, their default priority.

For example, in the expression 1 + 2 * 2, multiplication takes precedence over addition. This means multiplication is done first.

However, if we want to change this default order, we can use parentheses. So, instead of relying on the default precedence, we can write (1 + 2) * 2 to make sure the addition is done first.

In JavaScript, each operator has a priority number. The one with the higher number goes first. If two operators have the same priority, they're executed from left to right.

Remember: parentheses always have the final say in determining the order of operations, regardless of the default precedence.

And just a quick tip: unary operators (like negative sign -) have a higher priority than their binary counterparts. But don't worry too much about that detail; it's more of an advanced concept.

Here’s an extract from the precedence table (you don’t need to remember this, but note that unary operators are higher than corresponding binary ones):

Assignment

Let’s note that an assignment = is also an operator. It is listed in the precedence table with the very low priority of 2.

That’s why, when we assign a variable, like x = 2 * 2 + 1, the calculations are done first and then the = is evaluated, storing the result in x.

Bitwise operators

Bitwise operators treat arguments as 32-bit integer numbers and work on the level of their binary representation.

These operators are not JavaScript-specific. They are supported in most programming languages.

The list of operators:

• AND ( & )
• OR ( | )
• XOR ( ^ )
• NOT ( ~ )
• LEFT SHIFT ( << )
• RIGHT SHIFT ( >> )
• ZERO-FILL RIGHT SHIFT ( >>> )

These operators are used very rarely when we need to fiddle with numbers on the very lowest (bitwise) level. We won’t need these operators any time soon, as web development has little use for them, but in some special areas, such as cryptography, they are useful. You can read the Bitwise Operators chapter on MDN when a need arises.

Comma

The comma operator , is one of the rarest and most unusual operators. Sometimes, it’s used to write shorter code, so we need to know it in order to understand what’s going on.

The comma operator allows us to evaluate several expressions, dividing them with a comma ,. Each of them is evaluated but only the result of the last one is returned.

Among my favorites are the bitwise operators, even though they might not be everyday tools in web development. There's something intriguing about working at the binary level, especially in specialized areas like cryptography. It's a reminder that JavaScript, with its vast array of operators, has applications beyond the typical web development landscape.

I encourage you to not just stop here but to continue exploring and experimenting with these operators in your own code. Whether you find elegance in the simplicity of addition or the intricacies of bitwise manipulation, JavaScript has a rich tapestry waiting to be woven by developers like you.

So, as you sip your virtual coffee and code away, remember that each operator is like a brushstroke on the canvas of your program, contributing to the masterpiece you're creating.

buy me a coffee☕