Operators in depth
Additional operators
| Operator | Description |
|---|---|
&& | Logical AND operator |
\|\| | Logical OR operator |
! | Logical NOT operator |
% | The modulus operator |
== | The equality operator |
=== | The inequality operator |
!== | The strict inequality operator |
+= | The addition assignment operator |
| The concatenation assignment operator: += (it’s the same as the previous one - more on that later) |
The logical AND operator in JavaScript: &&
The logical AND operator is, for example, used to confirm if multiple comparisons will return true.
In JavaScript, this operator consists of two ampersand symbols together: &&.
The && logical operator returns a single value: the boolean true or false, based on the following rules:
- It returns
trueif both the values on its right and on its left are evaluated totrue - It returns
falsein all the other instances.
The logical OR operator in JavaScript: ||
The logical OR operator will always return true, except when both sides evaluate to false. In other words, for the logical OR operator to return false, the results of both comparisons must return false.
The logical NOT operator: !
In JavaScript, the logical NOT operator’s symbol is the exclamation mark: !, which flips the evaluated boolean value from true to false and from false to true.
The modulus operator: %
The modulus operator is another mathematical operator in JavaScript. It returns the remainder of division.
The equality operator, ==
The equality operator checks if two values are equal.
Additionally, even if one of the compared values is of the number type, and the other is of the string type, the returned value is still true: 5 == "5".
This means that the equality operator compares only the values, but not the types.
The strict equality operator, ===
The strict equality operator compares for both the values and the data types.
With the strict equality operator, comparing 5 === 5 still returns true. The values on each side of the strict equality operator have the same value and the same type. However, comparing 5 == "5" now returns false, because the values are equal, but the data type is different.
The inequality operator, !=
The inequality operator checks if two values are not the same, but it does not check against the difference in types.
For example, 5 != "5"returns false, because it’s false to claim that the number 5 is not equal to number 5, even though this other number is of the string data type.
The strict inequality operator !==
For the strict inequality operator to return false, the compared values have to have the same value and the same data type.
2. Using the + operators on strings and numbers
Combining two strings using the + operator
The + operator, when used with number data type, adds those values together.
However, the + operator is also used to join string data type together.
If the + operator is used to join strings, then it is referred to as the concatenation operator.
When combining a string and a number using the + operator, JavaScript coerces a number value to a string value - so that it can run the + operator on disparate data types.
The addition assignment operator, +=
The addition assignment operator is used when one wants to accumulate the values stored in a variable.
The concatenation assignment operator, +=
This operator’s syntax is exactly the same as the addition assignment operator. The difference is in the data type used:
var longString = "";
longString += "Once";
longString += " upon";
longString += " a";
longString += " time";
longString += "...";
console.log(longString); // "Once upon a time..."
Operator precedence and associativity
Operator precedence is a set of rules that determines which operator should be evaluated first.
Operator associativity determines how the precedence works when the code uses operators with the same precedence.
There are two kinds:
- left-to-right associativity
- right-to-left associativity
For example, the assignment operator is right-to-left associative, while the greater than operator is left-to-right associative:
var num = 10; // the value on the right is assigned to the variable name on the left
5 > 4 > 3; // the 5 > 4 is evaluated first (to `true`), then true > 3 is evaluated to `false`, because the `true` value is coerced to `1`
Additional resources
Here is a list of resources that may be helpful as you continue your learning journey.
These resources provide some more in-depth information on the topics covered in this module.
Mozilla Developer Network Expressions and Operators
Mozilla Developer Network Operator Precedence and Associativity
StackOverflow Developer Survey 2021 Most Popular Technologies
Additional resources for Conditionals and Loops
Here is a list of resources that may be helpful as you continue your learning journey.
In JavaScript, there is also a shorthand version of writing a conditional statement, known as the conditional (ternary) operator: Conditional (ternary) operator
