In JavaScript you can use ++ operator before (pre-increment) or after the variable name (post-increment). What, if any, are the differences between these ways of incrementing a variable?
7 Answers
Same as in other languages:
++x(pre-increment) means "increment the variable; the value of the expression is the final value"x++(post-increment) means "remember the original value, then increment the variable; the value of the expression is the original value"
Now when used as a standalone statement, they mean the same thing:
x++; ++x; The difference comes when you use the value of the expression elsewhere. For example:
x = 0; y = array[x++]; // This will get array[0] x = 0; y = array[++x]; // This will get array[1] 
9 Comments
Chris
Curses, I nearly beat you to an answer had I not stopped to load up a practical jsfiddle answer. ;-)
Keavon
What would this look like if you used
+ 1 instead of ++? Is there a way to increment before or after when adding numbers?
Jean Jimenez
I would like to know why if you do this operation const r1 =(x++)+(x++); it does not produce the expected result according to your example.
Jon Skeet
@JeanJimenez: Well it produces the result I expect. For example, if
x starts off as 10, the value of r1 is 21, which is 10+11. The value of the first x++ expression is 10 and x is incremented to 11. The value of the second x++ expression is 11 and x is incremented to 12.Jean Jimenez
Dear @JonSkeet thanks for that super-fast response, I’m new to learning JavaScript and my confusion is regarding why one increments and the another doesn't.
|
++xincrements the value, then evaluates and stores it.x++evaluates the value, then increments and stores it.
var n = 0, m = 0; alert(n++); /* Shows 0, then stores n = 1 */ alert(++m); /* Shows 1, then stores m = 1 */ Note that there are slight performance benefits to using ++x where possible, because you read the variable, modify it, then evaluate and store it. Versus the x++ operator where you read the value, evaluate it, modify it, then store it.
Comments
As I understand them if you use them standalone they do the same thing. If you try to output the result of them as an expression then they may differ. Try alert(i++) as compared to alert(++i) to see the difference. i++ evaluates to i before the addition and ++i does the addition before evaluating.
See http://jsfiddle.net/xaDC4/ for an example.
Comments
I've an explanation of understanding post-increment and pre-increment. So I'm putting it here.
Lets assign 0 to x
let x = 0; Lets start with post-increment
console.log(x++); // Outputs 0 Why?
Lets break the x++ expression down
x = x; x = x + 1; First statement returns the value of x which is 0
And later when you use x variable anywhere, then the second statement is executed
Second statement returns the value of this x + 1 expression which is (0 + 1) = 1
Keep in mind the value of x at this state which is 1
Now lets start with pre-increment
console.log(++x); // Outputs 2 Why?
Lets break the ++x expression down
x = x + 1; x = x; First statement returns the value of this x + 1 expression which is (1 + 1) = 2
Second statement returns the value of x which is 2 so x = 2 thus it returns 2
Hope this would help you understand what post-increment and pre-increment are!
Comments
var a = 1; var b = ++a; alert('a:' + a + ';b:' + b); //a:2;b:2 var c = 1; var d = c++; alert('c:' + c + ';d:' + d); //c:2;d:1 
Comments
var x = 0, y = 0; //post-increment: i++ returns value then adds one to it console.log('x++ will log: ', x++); //0 console.log('x after x++ : ', x); //1 //pre-increment: adds one to the value, then returns it console.log('++y will log: ', ++y); //1 console.log('y after ++y : ', y); //1 
Comments
It is clearer and faster to use ++i if possible :
++iguarantees that you are using a value ofithat will remains the same unless you changeii++allows to use a value ofiwhich will change in the "near future", it is not desirable if possible
Of course, it's not really much faster, only a little.
i++returns the value ofiand increment it by one,++iincrementiby one and returns the incremented value. Ifihas5,i++will return5but then i will have6, and++iwill return 6 andiwill have 6.