15 January 2019

5 mins

JavaScript Precedence and Associativity

Written by Dean Gilewicz
JS
Operator precedence determines the order in which operators are evaluated. Operators with higher precedence are evaluated first. In the code below, the multiplication operator * has higher precedence than the addition operator + and so is evaluated first:

See the Pen thecodelog.com - JS Precedence and Associativity 1 by Deano (@deangilewicz) on CodePen.

 An overview of JavaScript precedence is shown below from highest to lowest:

See the Pen fb80a0a695eb8cd111ab35c9479cf50f by Deano (@deangilewicz) on CodePen.

 Associativity determines the order in which operators of the same precedence are processed.

See the Pen thecodelog.com - JS Precedence and Associativity 3 by Deano (@deangilewicz) on CodePen.

 && is left-associative. A ternary operator ? : is right-associative.

See the Pen thecodelog.com - JS Precedence and Associativity 4 by Deano (@deangilewicz) on CodePen.

 For both && and || operators, the righthand operand will not be evaluated if the lefthand operand is sufficient to determine the outcome of the operation (short circuit):

See the Pen thecodelog.com - JS Precedence and Associativity 5 by Deano (@deangilewicz) on CodePen.