Hola.
Veamos:
Operador ++ (anterior): ++a * b == 10
(Ahora el valor de a es: 5)
Ahí se están realizando dos operaciones:
- un incremento(una suma) sobre a
- una multiplicación de a * b.
Si primero hacemos el incremento y luego la multiplicación, tendremos un resultado.
Pero, si primero multiplicamos y el incremento lo hacemos después, el resultado será distinto.
Entonces, cuando se usa "incremento anterior", primero se hace el incremento y luego se multiplica.
Eso es lo que ocurre aquí:
a = 4, b = 2
Operador ++ (anterior): ++a * b == 10
(Ahora el valor de a es: 5)
La a se incrementa en valor 5, y luego se multiplica por b que es 2. Resultado = 10.
En cambio, si se usa el "incremento posterior", entonces primero se hace la multiplicación y el incremento ocurre después.
a = 4, b = 2
Operador ++ (posterior): a++ * b == 8 //¿pq de este resultado??
(Ahora el valor de a es: 5)
Aquí se multiplica la a que vale 4 por b que es dos. Resultado = 8.
Y
después, se hace el incremento, por lo que la a pasa a valer 5.
Pero ese 5 no interviene en la multiplicación, porque esta ya terminó.
En ambos casos, la a termina valiendo 5. La diferencia es que en el primer caso se multiplica
después de adoptar el valor 5.
Y en el segundo caso, la multiplicación ocurre
antes de que adopte valor 5
En los console.log(), ocurre lo mismo:
var a = 2;
console.log(a++); //me da 2
console.log(++a); // me da 4
En la primera línea, la de color azul, se usa el "incremento posterior".
Es decir, ocurra lo que ocurra, lo último será la suma.
Entonces, esa línea
azul lo primero que hace es mostrarte el valor de a, que es 2.
Y
lo último que hace es el incremento, así que la a pasa a valer 3.
Pero ese 3, tú no lo ves en pantalla, porque cuando el log() mostró el valor de a, aún no se había incrementado.
La siguiente línea, la
verde, hace un "incremento anterior", es decir,
lo primero que va a ocurrir es la suma. Luego ya pasará lo que tenga que pasar.
Por tanto, la línea verde lo primero que hace es incrementar la a, que valía 3 y ahora pasa a valer 4.
Y tras esto, te muestra en pantalla su valor, que ya es 4.
Espero que ahora haya quedado un poco más claro la diferencia que hay entre estos dos tipos de incrementos (y decrementos).
Saludos.