++ someVariable vs. someVariable ++ en JavaScript

135

En JavaScript, puede usar el ++operador antes ( antes del incremento ) o después del nombre de la variable ( después del incremento ). ¿Cuáles, si las hay, son las diferencias entre estas formas de incrementar una variable?

Derek Adair
fuente
1
Ver también la diferencia
Bergi
Estaba pensando en esto ayer leyendo esta respuesta a la pregunta sobre suposiciones erróneas en C / C ++ . En todos los casos, ¿podemos garantizar que Javascript se comporte de esta manera? ¿O crees que es una mala práctica usar la declaración de incremento dentro de una declaración más compleja?
palswim
El comentario anterior es en realidad una copia de una respuesta (una no respuesta, más bien) que publiqué en 2010 . He eliminado la respuesta, pero Jon Skeet había respondido con: "Mirando ECMA-262, parece razonablemente bien especificado".
palswim

Respuestas:

242

Igual que en otros idiomas:

  • ++x (pre-incremento) significa "incrementar la variable; el valor de la expresión es el valor final"
  • x++ (post-incremento) significa "recordar el valor original, luego incrementar la variable; el valor de la expresión es el valor original"

Ahora, cuando se usa como una declaración independiente, significan lo mismo:

x++;
++x;

La diferencia viene cuando usas el valor de la expresión en otra parte. Por ejemplo:

x = 0;
y = array[x++]; // This will get array[0]

x = 0;
y = array[++x]; // This will get array[1]
Jon Skeet
fuente
13
Maldiciones, casi te gané una respuesta si no me hubiera detenido para cargar una respuesta práctica jsfiddle. ;-)
Chris
2
¿Cómo se vería esto si lo usaras en + 1lugar de ++? ¿Hay alguna forma de aumentar antes o después al agregar números?
Keavon el
Me gustaría saber por qué si haces esta operación const r1 = (x ++) + (x ++); no produce el resultado esperado según su ejemplo.
Jean Jimenez
1
@JeanJimenez: Bueno, produce el resultado que espero. Por ejemplo, si xcomienza como 10, el valor de r1es 21, que es 10 + 11. El valor de la primera x++expresión es 10 y xse incrementa a 11. El valor de la segunda x++expresión es 11 y xse incrementa a 12.
Jon Skeet
Estimado @JonSkeet, gracias por esa respuesta súper rápida, soy nuevo en el aprendizaje de JavaScript y mi confusión es sobre por qué uno aumenta y el otro no.
Jean Jimenez
43
  • ++x incrementa el valor, luego lo evalúa y lo almacena.
  • x++ evalúa el valor, luego lo incrementa y lo almacena.
var n = 0, m = 0;

alert(n++); /* Shows 0, then stores n = 1 */
alert(++m); /* Shows 1, then stores m = 1 */

Tenga en cuenta que hay pequeños beneficios de rendimiento al usar ++xcuando sea posible, porque lee la variable, la modifica, luego la evalúa y almacena. Frente al x++operador donde lee el valor, lo evalúa, lo modifica y luego lo almacena.

Justin Force
fuente
7

Según tengo entendido, si los usa de forma independiente, hacen lo mismo. Si intenta generar el resultado de ellos como una expresión, entonces pueden diferir. Pruebe alert (i ++) en comparación con alert (++ i) para ver la diferencia. i ++ evalúa a i antes de la adición y ++ i hace la adición antes de evaluar.

Consulte http://jsfiddle.net/xaDC4/ para ver un ejemplo.

Chris
fuente
2
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

jsfiddle

The Code Guy
fuente
0
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
codificador
fuente
0

Tengo una explicación para entender el post-incremento y pre-incremento. Así que lo estoy poniendo aquí.

Vamos a asignar 0ax

let x = 0;

Comencemos con el post-incremento

console.log(x++); // Outputs 0

¿Por qué?

Vamos a romper la x++expresión

x = x;
x = x + 1;

La primera declaración devuelve el valor del xcual es0

Y más tarde, cuando usa xvariable en cualquier lugar, se ejecuta la segunda instrucción

La segunda declaración devuelve el valor de esta x + 1expresión que es(0 + 1) = 1

Tenga en cuenta el valor de xen este estado que es1

Ahora comencemos con pre-incremento

console.log(++x); // Outputs 2

¿Por qué?

Vamos a romper la ++xexpresión

x = x + 1;
x = x;

La primera declaración devuelve el valor de esta x + 1expresión que es(1 + 1) = 2

La segunda declaración devuelve el valor de lo xque es 2así, x = 2por lo tanto, devuelve2

¡Espero que esto te ayude a comprender qué son el post-incremento y pre-incremento!

unclexo
fuente