++ operator returns original value if placed after operand — how?

Question

As far as I've been led to understand, x++ is essentially a terser way of saying x = x + 1. So far, so clear. In front-end Javascript, I've occasionally seen ++x — I seem to remember from a jsPerf test I can no longer find (how does one Google ++ effectively?) that this somehow had a small performance benefit in a particular version of IE, and let it go at that.

However I've recently encountered something that speaks of a weird quirk in execution order (JS code):

var x = 1;
console.log(x++); // 1 (?!)
console.log(x);   // 2

…whereas

var x = 1;
console.log(++x); // 2 (what I would've expected)
console.log(x);   // 2

I can't get my head around this. How can we return the unmodified variable when the operation and assignment are within the parenthesis, and thus by all rights should be executed before console.log is even invoked, let alone executed and returned?

Answer 1

Those are two different things

x++

is a post-increment. It returns x before the change but then changes it:

tmp = x;
x = x+1;
return tmp;

whereas

++x

is a pre-increment. It first changes x and returns the new value afterwards:

x = x+1;
return x;

The second one is also slightly faster as your compliler/interpreter doesn't need to create a temporary variable and copy the data across.

Answer 2

x++ gets the value, then increments it.

++x increments the value, then gets it.

This is the behavior in every language I've used that supports these operators.

Answer 3

Using ++ AFTER the variable increments the value after that line of code.

Likewise, using ++ BEFORE the variable increments the value before using it in that line of code.

Cool huh?

var x = 1;
x++;
console.log(x++); // 2 (?!)
console.log(x);   // 3
console.log(++x); // 4
console.log(x++); // 4
console.log(x);   // 5

Answer 4

You're talking about the difference between the pre- and post- increment operators. In the pre- case, the operation is essentially (x = x + 1; yield x), and in the second case it's (yield x; x = x + 1).