Unary operators in Javascript - Step-by-Step Execution

Concept Flow - Unary operators

Start with a value

↓

Apply unary operator

↓

Evaluate result

↓

Use result in expression or output

Unary operators take one value and perform an operation on it, producing a new value.

Execution Sample

Javascript

let x = 5;
let y = -x;
let z = ++x;
console.log(y, x, z);

This code shows negation and increment unary operators on a variable.

Execution Table

Step	Code Line	Variable States	Operation	Result/Output
1	let x = 5;	x=undefined -> x=5	Assign 5 to x	x=5
2	let y = -x;	x=5, y=undefined	Negate x	y = -5
3	let z = ++x;	x=5, y=-5, z=undefined	Pre-increment x (x=x+1)	x=6, z=6
4	console.log(y, x, z);	x=6, y=-5, z=6	Output values	Prints: -5 6 6

💡 All lines executed; program ends after console.log

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	Final
x	undefined	5	5	6	6
y	undefined	undefined	-5	-5	-5
z	undefined	undefined	undefined	6	6

Key Moments - 2 Insights

Why does ++x change the value of x before assigning to z?

Because ++x is a pre-increment unary operator that increases x first, then returns the new value for z, as shown in step 3 of the execution_table.

Why is y equal to -5 after negating x?

Because the unary minus operator changes the sign of x's value (5) to -5, as shown in step 2 of the execution_table.

Visual Quiz - 3 Questions

Look at the execution_table at step 3, what is the value of x after ++x?

A 6

B -5

C 5

D undefined

💡 Hint

Check the 'Variable States' and 'Result/Output' columns at step 3 in the execution_table.

At which step does y get its value assigned?

A Step 3

B Step 1

C Step 2

D Step 4

💡 Hint

Look at the 'Code Line' and 'Operation' columns to see when y is assigned.

If we change ++x to x++, what would be the value of z at step 3?

A 6

B 5

C -5

D undefined

💡 Hint

Remember x++ returns the value before incrementing; check how pre- and post-increment differ.

Concept Snapshot

Unary operators act on one value.
Examples: -x (negation), ++x (pre-increment), x++ (post-increment).
Pre-increment changes value before use; post-increment after.
Used to quickly change or check a single variable.
Common in expressions and loops.

Full Transcript

Unary operators in JavaScript work on a single value to produce a new value. For example, the negation operator '-' changes the sign of a number. The increment operator '++' can be used before or after a variable. When used before (like ++x), it increases the variable's value first, then uses it. When used after (x++), it uses the current value first, then increases it. In the example code, x starts at 5. Applying -x gives -5 for y. Then ++x increases x to 6 and assigns 6 to z. Finally, the console.log prints -5 6 6. Understanding when the variable changes helps avoid confusion.