Operator precedence in Javascript - Step-by-Step Execution

Concept Flow - Operator precedence

Start Expression

↓

Identify Operators

↓

Check Precedence Levels

↓

Evaluate Highest Precedence Operator

↓

Replace with Result

↓

More Operators?

Yes→Repeat Evaluate

No↓

Final Result

The expression is evaluated by first identifying operators, then applying them in order of precedence from highest to lowest until the final result is obtained.

Execution Sample

Javascript

let result = 3 + 4 * 2;
console.log(result);

Calculates 3 plus 4 times 2, showing how multiplication happens before addition.

Execution Table

Step	Expression	Operator Evaluated	Operation	Result
1	3 + 4 * 2	*	4 * 2	8
2	3 + 8	+	3 + 8	11
3	11	None	Final result	11

💡 No more operators left, final result is 11

Variable Tracker

Variable	Start	After Step 1	After Step 2	Final
result	undefined	undefined	undefined	11

Key Moments - 2 Insights

Why does multiplication happen before addition in the expression?

Because multiplication (*) has higher precedence than addition (+), so it is evaluated first as shown in step 1 of the execution_table.

What if we want addition to happen first?

We can use parentheses to change precedence, for example (3 + 4) * 2 would add first, which is not shown here but follows the same evaluation steps.

Visual Quiz - 3 Questions

Look at the execution table, what is the result after evaluating the multiplication operator?

A 8

B 11

C 6

D 14

💡 Hint

Check step 1 in the execution_table where 4 * 2 is evaluated.

At which step does the addition operator get evaluated?

A Step 3

B Step 1

C Step 2

D No addition is evaluated

💡 Hint

Look at the operator evaluated column in the execution_table.

If the expression was changed to (3 + 4) * 2, how would the first operation change?

A Multiplication evaluated first

B Addition evaluated first

C No operations evaluated

D Both evaluated simultaneously

💡 Hint

Parentheses change precedence, so addition inside parentheses is evaluated first.

Concept Snapshot

Operator precedence decides the order operators are evaluated.
Multiplication (*) has higher precedence than addition (+).
Expressions are evaluated from highest to lowest precedence.
Use parentheses () to override default precedence.
Example: 3 + 4 * 2 equals 3 + (4 * 2) = 11.

Full Transcript

Operator precedence in JavaScript means some operations happen before others. For example, multiplication happens before addition. In the code '3 + 4 * 2', JavaScript first multiplies 4 by 2 to get 8, then adds 3 to get 11. This is because '*' has higher precedence than '+'. If you want addition first, use parentheses like '(3 + 4) * 2'. This changes the order so addition happens before multiplication. The execution table shows each step: first multiplication, then addition, then the final result. Variables update after all operations finish. Remember, parentheses always have the highest precedence.