JavaScript Operators Precedence

Operators precedence determines the order in which operators are evaluated in an expression. In JavaScript, this precedence impacts how expressions are computed and can influence the results of your code. This article explains the different levels of operator precedence and provides examples to help you understand how it works.

Operator Precedence Levels

JavaScript operators are divided into several precedence levels. Operators with higher precedence are evaluated before operators with lower precedence. Here's a summary of the precedence levels:

1. Grouping Operators

Parentheses can be used to explicitly specify the order of operations. They have the highest precedence and are evaluated first.

let result = (3 + 2) * 4; // Output: 20

2. Exponentiation Operator

The exponentiation operator (**) has higher precedence than most other operators, except for grouping.

let result = 2 ** 3 ** 2; // Output: 512 (2 ** 9)

3. Unary Operators

Unary operators such as +, -, ++, --, and ! have high precedence. They are evaluated before most other operators.

let a = 5;
let result = -a + 10; // Output: 5 (evaluates as (-5) + 10)

4. Multiplication, Division, and Modulus

These operators (*, /, and %) have the same precedence level and are evaluated from left to right.

let result = 5 + 10 * 2; // Output: 25 (evaluates as 5 + (10 * 2))

5. Addition and Subtraction

These operators (+ and -) have lower precedence than multiplication, division, and modulus. They are also evaluated from left to right.

let result = 10 - 5 + 2; // Output: 7 (evaluates as (10 - 5) + 2)

6. Relational Operators

Relational operators (>, <, >=, <=) are evaluated after arithmetic operators but before equality operators.

let result = 10 > 5 == true; // Output: true (evaluates as (10 > 5) == true)

7. Equality Operators

Equality operators (==, ===, !=, and !==) have lower precedence than relational operators.

let result = 5 + 5 == 10; // Output: true (evaluates as (5 + 5) == 10)

8. Logical AND and OR

Logical AND (&&) and OR (||) operators have lower precedence than relational and equality operators. The AND operator has higher precedence than the OR operator.

let result = true && false || true; // Output: true (evaluates as (true && false) || true)

9. Assignment Operators

Assignment operators (=, +=, -=, etc.) have the lowest precedence. They are evaluated after all other operators.

let a = 5;
a += 10; // Output: 15 (equivalent to a = a + 10)

Order of Operations

The order of operations follows the precedence levels outlined above. For example, in the expression:

let result = 3 + 4 * 5;

Multiplication is performed before addition, resulting in:

result = 3 + (4 * 5); // Output: 23

Conclusion

Understanding operator precedence is crucial for writing correct and efficient JavaScript code. By knowing how different operators are evaluated in an expression, you can avoid common mistakes and ensure your code produces the desired results.

Archive