Skip to content

2.7 Operators

Bunlong VAN edited this page Feb 15, 2018 · 5 revisions

Many operators are known to us from school. They are addition +, a multiplication *, a subtraction - and so on.

In this chapter we concentrate on aspects that are not covered by school arithmetic.

Terms: “unary”, “binary”, “operand”

Before we move on, let’s grasp the common terminology.

  • An operand – is what operators are applied to. For instance in multiplication 5 * 2 there are two operands: the left operand is 5, and the right operand is 2. Sometimes people say “arguments” instead of “operands”.

  • An operator is unary if it has a single operand. For example, the unary negation - reverses the sign of the number:

    let x = 1;
    
    x = -x;
    alert( x ); // -1, unary negation was applied
    
  • An operator is binary if it has two operands. The same minus exists in the binary form as well:

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

Formally, we’re talking about two different operators here: the unary negation (single operand, reverses the sign) and the binary subtraction (two operands, subtracts).

Strings concatenation, binary +

Now let’s see special 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. The rule is simple: if either operand is a string, then convert the other one into a string as well.

However, note that operations run from left to right. If there are two numbers followed by a string, the numbers will be added before being converted to a string:

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

String concatenation and conversion is a special feature of the binary plus +. Other arithmetic operators work only with numbers. They always convert their operands to numbers.

For instance, subtraction and division:

alert( 2 - '1' ); // 1
alert( '6' / '2' ); // 3

Numeric conversion, unary +

The plus + exists in two forms. The binary form that we used above and the unary form.

The unary plus or, in other words, the plus operator + applied to a single value, doesn’t do anything with numbers, but if the operand is not a number, then it is converted into it.

For example:

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

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

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

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

A need to convert strings to numbers arises very often. For example, if we are getting values from HTML form fields, then they are usually strings.

What if we want to sum them?

The binary plus would add them as strings:

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

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

If we want to treat them as numbers, then we can convert and then sum:

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

// both values converted to numbers before the binary plus
alert( +apples + +oranges ); // 5

// the longer variant
// alert( Number(apples) + Number(oranges) ); // 5

From a mathematician’s standpoint the abundance of pluses may seem strange. But from a programmer’s standpoint, there’s nothing special: unary pluses are applied first, they convert strings to numbers, and then the binary plus sums them up.

Why are unary pluses applied to values before the binary one? As we’re going to see, that’s because of their higher precedence.

Operators precedence

If an expression has more than one operator, the execution order is defined by their precedence, or, in other words, there’s an implicit priority order among the operators.

From school we all know that the multiplication in the expression 1 + 2 * 2 should be calculated before the addition. That’s exactly the precedence thing. The multiplication is said to have a higher precedence than the addition.

Parentheses override any precedence, so if we’re not satisfied with the order, we can use them, like: (1 + 2) * 2.

There are many operators in JavaScript. Every operator has a corresponding precedence number. The one with the bigger number executes first. If the precedence is the same, the execution order is from left to right.

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

Precedence Name Sign
... ... ...
16 unary plus +
16 unary negation -
14 multiplication *
14 division /
13 addition +
13 subtraction -
... ... ...
3 assignment =
... ... ...

As we can see, the “unary plus” has a priority of 16, which is higher than 13 for the “addition” (binary plus). That’s why in the expression "+apples + +oranges" unary pluses work first, and then the addition.