What is the difference between pre- and post-increment in Javascript?

Pre-increment

See the example below: in the pre increment, first the variable c is incremented, and only then assigned to d :

var c, d;
c=6;
console.log("Pre-incremento\n");
console.log("Numero sem incremento: %d\n", c); // 6
d=++c; // O VALOR É INCREMENTADO, E SÓ DEPOIS PASSADO PARA 'd'
console.log("Valor de 'c':%d\nValor de 'd':%d\n", c, d); // c = 7, d = 7

In this example, c , that is worth 6 is first incremented and becomes valued 7. Only after that, the variable - already counting 7 - is assigned to 'd', which is also worth 7. >

Post-Increment

See in the example that the variable is first assigned, and only then incremented:

var c, d;
c=6;
console.log("Pos-incremento\n");
console.log("Numero sem incremento: %d\n", c); // 6
d=c++;// O VALOR É PASSADO PARA 'd', E DEPOIS INCREMENTADO
console.log("Valor de 'c':%d\nValor de 'd':%d\n", c, d); // c = 7, d = 6

In this example, c , which is worth 6 has its value assigned to d , which is worth 6 as well. Only after this operation does c have its value incremented, then it is 7.

  

The same rule applies to decrements

Pre-decrement

var c, d;
c=6;
console.log("Pre-decremento");
console.log("Numero sem incremento: %d", c); // 6
d=--c; // O VALOR É DECREMENTADO, E SÓ DEPOIS PASSADO PARA 'd'
console.log("Valor de 'c':%d\nValor de 'd':%d\n", c, d); // c = 5, d = 5

Post-decrement

var c, d;
c=6;
console.log("Pos-decremento");
console.log("Numero sem incremento: %d", c); // 6
d=c--; // O VALOR É PASSADO PARA 'd', E DEPOIS DECREMENTADO
console.log("Valor de 'c':%d\nValor de 'd':%d\n", c, d); // c = 5, d = 6

Therefore

In your pre or post increment example will always result in the same result , since there is no assignment of the value of i to another variable, you are just returning the value of i after the increment operation, be it pre or post.

In this way your example works just like:

c = 6;
c++; // o valor de 'c' é 7
console.log(c); // retornará 7

or

c = 6;
++c; // o valor de 'c' é 7
console.log(c); // retornará 7

The behavior of these incremental operators is related to something I've already mentioned in my answer a How does this if / else work with "?" and ":"? .

Imagine a line containing only this:

i;

We say it does nothing and is no good, right? But this is valid in language, so it is somehow interpreted according to the rules of language (aside from the fact that there may be optimizers in the middle of the path simply by discarding that line of code). The language interprets i as an expression , and expressions always result in something. In the case of our line above, assuming that i does not exist, the result of the expression would be undefined .

Maybe it's already clear where I'm trying to get: i++ and ++i are also expressions (composed of the expression i and one of the ++ operators - are two, one used as a prefix, and another as suffix). And so, they result in a value, which can be used in another expression that encompasses this, as an assignment:

var i = 0;
var x = i++;
var y = ++i;

And the difference between the operators is precisely in the behavior of the result of the expression: while i++ returns the value of i before increment, ++i first increments i , and then returns its value. So in my example above, the value of x will be 0 , and that of y will 2 .

Taking your examples:

for (var i = 0; i < 10; i++){

and

for (var i = 0; i < 10; ++i){

The result of expressions i++ and ++i is different, but is not used. What is used, and only on the next line, is i . And the effect of the two variants on i at that moment (next line) is equivalent.

You will only notice a difference when you make use of the increment result, eg

var i = 1;
i++;
console.log(i == 2); // true
// é o mesmo que
var i = 1;
++i;
console.log(i == 2); // true

//No exemplo abaixo não
var i = 1;
console.log(i++ == 2); // false
var i = 1;
console.log(++i == 2); // true

When used in a loop, as in its example, there is no difference, since i++ returns i and adds 1 , and ++i adds 1 to i value and returns it , so in the first iteration, the two will have the same value.

For optimization , pós-incremento makes use of a temporary variable to store the value of i before increment, whereas pré-incremento adds value to original variable, however this is a premature optimization and according to this article , statistically insignificant.

1 - I believe that using "FOR" will be a bit difficult to understand the work of the increment. Try with while (gets brighter)

2- It is better to use the increment in a variable part, as follows:

{
    int i = 0;
    int var = 0;
    while (i < 10) {
        //var += ++i;
        var += i++;
        System.out.println("i= " + i + " | var= "+var);
    }

By changing the increment in "var" you can see that even with var ++ before the print method the printed value will be [var = 0] What means that the variable changes after the loop is executed. Falow ... Valews!