javascript - explícame - let en jquery

¿Hay una diferencia de rendimiento entre ''let'' y ''var'' en JavaScript

Question

La diferencia entre estas dos palabras clave en términos de alcance ya se ha discutido a fondo here , pero me preguntaba si hay algún tipo de diferencia de rendimiento entre las dos, y si es así, ¿es insignificante o en qué momento sería significativa?

Answer 1

Los bucles internos permiten que sea ​​significativamente más lento, consulte: https://jsperf.com/let-vs-var-loop

838,602 ± 0,77% 61% más lento

(function() {

  "use strict";
  var a=0;
  for(let i=0;i<100;i++) {
    a+=i;
  }
})();

contra

2,136,387 ± 1.09% más rápido

(function() {

  "use strict";
  var a=0;
  for(var i=0;i<100;i++) {
    a+=i;
  }
})();

Esto se debe a que al usar let , para cada iteración de bucle, la variable está en el ámbito. ejemplo:

for (let i = 0; i < 10 ; i++) {
    setTimeout(function() { console.log(i); }, 100 * i);
}

cede a

0,1,2,3,4,5,6,7,8,9

usando los rendimientos var para

10,10,10,10,10,10,10,10,10,10

Si desea obtener el mismo resultado, pero con var debe usar un IIFE:

for (var i = 0; i < 10; i++) {
  // capture the current state of ''i''
  // by invoking a function with its current value
  (function(i) {
    setTimeout(function() { console.log(i); }, 100 * i);
  })(i);
}

que por otro lado es significativamente más lento que usar let .

Answer 2

Para tu información Después de Chrome v60, no han surgido más regresiones. var y let son neck y neck, con var solo cada vez que gana por menos del 1%. Los escenarios del mundo real a veces dan a var una ventaja debido a la elevación y la reutilización, pero en ese momento se comparan manzanas con naranjas, ya let intención es permitirle evitar ese comportamiento porque la semántica es diferente.

Benchmark . Firefox, IE y Edge como let bien.

Answer 3

var : Deacleare una variable, la inicialización del valor es opcional. Vamos es más rápido en el ámbito exterior.

let : Declare una variable local con alcance de bloque. Vayamos un poco lento en el bucle interno.

Ex:

var a;
a = 1;
a = 2;//re-intilize possibe
var a = 3;//re-declare
console.log(a);//3

let b;
b = 5;
b = 6;//re-intilize possibe
// let b = 7; //re-declare not possible
console.log(b);

Answer 4

Después de probar esto en http://jsperf.com , obtuve los siguientes resultados: jsperf ha estado abajo por un tiempo; Consulte el código de reemplazo a continuación.

Para verificar esto, usaré la siguiente prueba de rendimiento basada en esta respuesta , que me llevó a escribir esta función:

/**
 * Finds the performance for a given function
 * function fn the function to be executed
 * int n the amount of times to repeat
 * return array [time for n iterations, average execution frequency (executions per second)]
 */
function getPerf(fn, n) {
  var t0, t1;
  t0 = performance.now();
  for (var i = 0; i < n; i++) {
    fn(i)
  }
  t1 = performance.now();
  return [parseFloat((t1 - t0).toFixed(3)), parseFloat((repeat * 1000 / (t1 - t0)).toFixed(3))];
}

var repeat = 100000000;
var msg = '''';

//-------inside a scope------------
var letperf1 = getPerf(function(i) {
  if (true) {
    let a = i;
  }
}, repeat);
msg += ''<code>let</code> inside an if() takes '' + letperf1[0] + '' ms for '' + repeat + '' iterations ('' + letperf1[1] + '' per sec).<br>''

var varperf1 = getPerf(function(i) {
  if (true) {
    var a = i;
  }
}, repeat);
msg += ''<code>var</code> inside an if() takes '' + varperf1[0] + '' ms for '' + repeat + '' iterations ('' + varperf1[1] + '' per sec).<br>''

//-------outside a scope-----------

var letperf2 = getPerf(function(i) {
  if (true) {}
  let a = i;
}, repeat);
msg += ''<code>let</code> outside an if() takes '' + letperf2[0] + '' ms for '' + repeat + '' iterations ('' + letperf2[1] + '' per sec).<br>''

var varperf2 = getPerf(function(i) {
  if (true) {}
  var a = i;
}, repeat);
msg += ''<code>var</code> outside an if() takes '' + varperf1[0] + '' ms for '' + repeat + '' iterations ('' + varperf1[1] + '' per sec).<br>''

document.getElementById(''out'').innerHTML = msg

<output id="out" style="font-family: monospace;white-space: pre-wrap;"></output>

Después de probar esto en Chrome y Firefox, esto muestra que let es más rápido que var , pero solo cuando está dentro de un alcance diferente al del alcance principal de una función. En el ámbito principal, var y let son aproximadamente idénticos en rendimiento. En IE11 y MS Edge, let y var son aproximadamente iguales en rendimiento en ambos casos.

Presiona el botón azul grande para ver por ti mismo en tu navegador favorito.

Actualmente let se admite el uso de navegadores más nuevos , pero los navegadores más antiguos todavía se están usando relativamente, lo que sería una razón para no usarlo en general. Si desea usarlo en un lugar donde los navegadores antiguos no funcionaran de otra manera, no debería haber ningún problema con él.

Edición: respuesta renovada ya que jsperf no funciona (consulte el historial de revisiones para la versión anterior).

Answer 5

$ node --version
v6.0.0
$ node
> timeit = (times, func) => {
     let start = (new Date()).getTime();
     for (let i = 0; i < times; i++) {
       func();
     };
     return (new Date()).getTime() - start;
   };
[Function]
> timeit(1000000, () => {
     let sum = 0;  // <-- here''s LET
     for (let i = 0; i < 1000; i++) {
       sum += i;
       if (sum > 1000000) { sum = 0; }
     }
     return sum;
   })
12144
> timeit(1000000, () => {
     var sum = 0;  // <-- here''s VAR
     for (let i = 0; i < 1000; i++) {
       sum += i;
       if (sum > 1000000) { sum = 0; }
     }
     return sum;
   })
2459

Mismo alcance (función), mismo código, 5 veces diferencia. Resultados similares en cromo 49.0.2623.75.