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.