javascript let和var的用法

问题描述

问 题

在看阮老师的ECMAScript 6 入门 时遇到了这个问题。先贴代码 :

var a = [];
for (var i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 10

不理解为什么是10，书中是这样解释的。

变量i是var声明的，在全局范围内都有效。所以每一次循环，新的i值都会覆盖旧值，导致最后输出的是最后一轮的i的值。

先假设是覆盖了，那为什么是10，为什么不是9, 不是 i < 10 吗？

还有这个let的用法

var a = [];
for (let i = 0; i < 10; i++) {
  a[i] = function () {
    console.log(i);
  };
}
a[6](); // 6

let声明 i ， 就得到了6，这是为什么啊？书中是这样解释的。

变量i是let声明的，当前的i只在本轮循环有效，所以每一次循环的i其实都是一个新的变量，所以最后输出的是6。

---

整理下问题 :
1.用var声明的为什么结果是10,就算不是6,也该是9啊，因为循环是从0-9.
2.用let声明的为什么是6？

解决方案

1 这个问题跟var let没关系，10是因为循环到9以后，js并不知道循环结束了，还会进行下一次循环，i加一等于10，然后判断条件发现不满足，才跳出循环。
2 var i你想象成全局变量，每次循环修改的、函数里面console.log访问的，都是同一个i。a[6]()是在循环结束后执行的，这时候的i由第一问知道是10。
let i你想象成局部变量，每次循环都生成一个新的，函数里面console.log访问的也都是不同的i。下面这段代码可能对你有点绕，但理解后对你学习js的变量很有帮助：

for (var i=0;i<10;i++) {
  a[i]=(function(i){
    return function() {
      console.log(i);
    })(i);
}
a[6](); // 6

循环变量i传到一个立即执行函数里，变成了局部变量i（其实这个函数的参数可以任意取名，取成i为了加深你的理解），在这个局部变量的作用域内定义了一个函数引用了它，js就会把它作为函数的上下文保存起来，所以console.log得到的是0到9不同的值。

这篇关于javascript let和var的用法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！