JavaScript is a programming language that is used to create interactive and dynamic web pages. It is a client-side scripting language that is executed by the web browser. JavaScript has a set of rules that determine the order in which operators are evaluated in an expression. This set of rules is known as JavaScript precedence.
JavaScript precedence is important because it determines the order in which operators are evaluated in an expression. This can have a significant impact on the outcome of the expression. For example, consider the following expression:
var result = 10 + 5 * 2;
In this expression, the multiplication operator (*) has a higher precedence than the addition operator (+). This means that the expression is evaluated as follows:
var result = 10 + (5 * 2);
As a result, the value of result is 20, not 30. If the addition operator had a higher precedence than the multiplication operator, the expression would have been evaluated as follows:
var result = (10 + 5) * 2;
In this case, the value of result would have been 30.
JavaScript has a set of rules that determine the order in which operators are evaluated in an expression. These rules are based on the precedence and associativity of the operators. Precedence refers to the order in which operators are evaluated, while associativity refers to the order in which operators of the same precedence are evaluated.
The following table shows the precedence and associativity of the operators in JavaScript:
| Operator | Description | Precedence | Associativity |
|---|---|---|---|
| () | Grouping | Highest | N/A |
| ++ -- | Postfix increment/decrement | Highest | Left-to-right |
| ++ -- | Prefix increment/decrement | Highest | Right-to-left |
| - + | Unary negation/plus | Highest | Right-to-left |
| ** | Exponentiation | 2nd highest | Right-to-left |
| * / % | Multiplication/division/modulus | 3rd highest | Left-to-right |
| + - | Addition/subtraction | 4th highest | Left-to-right |
| << >> >>> | Bitwise shift | 5th highest | Left-to-right |
| < <= > >= | Comparison | 6th highest | Left-to-right |
| == != === !== | Equality | 7th highest | Left-to-right |
| & | Bitwise AND | 8th highest | Left-to-right |
| ^ | Bitwise XOR | 9th highest | Left-to-right |
| | | Bitwise OR | 10th highest | Left-to-right |
| && | Logical AND | 11th highest | Left-to-right |
| || | Logical OR | 12th highest | Left-to-right |
| ?: | Conditional | Lowest | Right-to-left |
| = += -= *= /= %= <<= >>= >>>= &= ^= |= **= | Assignment | Lowest | Right-to-left |
It is important to note that parentheses can be used to override the default precedence and associativity of operators. For example, consider the following expression:
var result = (10 + 5) * 2;
In this expression, the addition operator (+) has a higher precedence than the multiplication operator (*). However, the parentheses override the default precedence and ensure that the addition is evaluated first.
JavaScript precedence is an important concept to understand when working with expressions in JavaScript. By understanding the order in which operators are evaluated, you can ensure that your expressions are evaluated correctly and produce the desired results.
Here are some code examples that demonstrate JavaScript precedence:
var result1 = 10 + 5 * 2; // result1 = 20 var result2 = (10 + 5) * 2; // result2 = 30 var result3 = 10 + 5 / 2; // result3 = 12.5 var result4 = (10 + 5) / 2; // result4 = 7.5 var result5 = 10 + 5 % 2; // result5 = 11 var result6 = (10 + 5) % 2; // result6 = 1
In the first example, the multiplication operator (*) has a higher precedence than the addition operator (+), so the expression is evaluated as 10 + (5 * 2), which results in 20.
In the second example, the parentheses override the default precedence and ensure that the addition is evaluated first, so the expression is evaluated as (10 + 5) * 2, which results in 30.
In the third example, the division operator (/) has a higher precedence than the addition operator (+), so the expression is evaluated as 10 + (5 / 2), which results in 12.5.
In the fourth example, the parentheses override the default precedence and ensure that the addition is evaluated first, so the expression is evaluated as (10 + 5) / 2, which results in 7.5.
In the fifth example, the modulus operator (%) has a higher precedence than the addition operator (+), so the expression is evaluated as 10 + (5 % 2), which results in 11.
In the sixth example, the parentheses override the default precedence and ensure that the addition is evaluated first, so the expression is evaluated as (10 + 5) % 2, which results in 1.