碰到一道题:

for(var i=0;i<2;i++){ 
setTimeout(function(){
console.log(i);
},100)
} //输出结果为:2 2
for(let i=0;i<2;i++){
setTimeout(function(){
console.log(i);
},100)
} //输出结果为:0 1

我们先从第一个for循环说起,setTImeout是异步执行的

因此setTImeout在异步队列中,需要等待同步队列(for循环)执行完成后才可进行,

此时,同步队列执行完成后i为2,所以执行setTImeout时,输出为2

接着看第二个for循环,由于i使用let定义的,let为块级作用域,但按我们的正常理解,应该会得出上边的结果

找了下网上,解释如下:

for循环中的let,事实上将其重新绑定到每一个循环迭代中,在确保上一次循环迭代结束后才会进行下一步循环,重新赋值

简单说就是let的for循环中,每次都需要保证循环体里的执行完毕后才会进行下一次循环(我是这么理解的)

又找了一个相似的例子

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

由于i是全局作用域,可被函数中的i获取得到,所以数组函数中输出的i均为10;

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

而这里的i是块级作用域,当前i只能在本轮循环中奇效,每次循环中的i均为一个新的变量,因此最终取出的值为6

JavaScript:for循环中let与var变量的绑定的更多相关文章

  1. for循环中setTimeout,var与let的不同

    先看下面两段代码 for (let i = 0; i < 5; i++) { setTimeout(function () { console.log(i) }, 2000) } for (va ...

  2. for循环中let与var的区别,块级作用域如何产生与迭代中变量i如何记忆上一步的猜想

    我在前一篇讨论let与var区别的博客中,顺带一笔带过了let与var在for循环中的不同表现,虽然解释了是块级作用域的影响,但具体是怎么去影响的呢,我尝试的去理解了下,这篇博客主要从for循环步骤拆 ...

  3. es6种for循环中let和var区别

    let和var区别: for(var i=0;i<5;i++){ setTimeout(()=>{ console.log(i);//5个5 },100) } console.log(i) ...

  4. for循环中 i++和++i 是否有区别?

    正常情况下  i++和++i是有区别的: 前者是:先引用,后增加, 后者是:先增加,后引用, 但是在for循环中: for(var i=0;i<10;i++){ System.out.print ...

  5. for循环中i--的妙用 及 两变量互换数值的问题

    int[] array = new int[4]; for(int i = 0; i < array.length; i++){ array[i] = (int)(Math.random() * ...

  6. JavaScript形而上的For循环中的Break

    break相当于循环中的GOTO,需避免使用. 下面是一个break使用例子. 找出第一个months小于7的项目. const cats = [ { name: 'Mojo', months: 84 ...

  7. javascript var变量删除

    var有三种声明的情形: var声明的全局变量 var在函数范围内声明的局部变量 eval中声明的全局变量. 首先, 1.2种情形var声明的变量是无法删除的. 尽管var声明的全局变量是属于wind ...

  8. JavaScript中var变量引用function与直接声明function

    今天在h5开发app的过程中遇到了一个js问题,function的执行问题 在js中声明函数function有这两种方法 var A=function(){...} 或者 function A(){. ...

  9. javascript精雕细琢(一):var let const function声明的区别

    目录 引言 一.var 二.let 三.const 四.function 五.总结 引言        在学习javascript的过程中,变量是无时无刻不在使用的.那么相对应的,变量声明方法也如是. ...

随机推荐

  1. 如何使用SpringBoot封装自己的Starter

    作者:Sans_ juejin.im/post/5cb880c2f265da03981fc031 一.说明 我们在使用SpringBoot的时候常常要引入一些Starter,例如spring-boot ...

  2. 面试:Stream#foreach方法摸底三问,你都了解吗

    JAVA8 新增了 Stream API,而在 Stream API 中又为程序员提供了一个遍历集合的 foreach 方法:java.util.stream.Stream#forEach. 那你对这 ...

  3. TypeScript 装饰器的执行原理

    装饰器本质上提供了对被装饰对象 Property​ Descriptor 的操作,在运行时被调用. 因为对于同一对象来说,可同时运用多个装饰器,然后装饰器中又可对被装饰对象进行任意的修改甚至是替换掉实 ...

  4. Abp小知识-如何全局设置DontWrapResult属性

    demo地址 GitHub相关demo地址:https://github.com/PuzzledAlien/DotNetCore_Practice/tree/master/ABP.Demo/WebAp ...

  5. ES6-Symbol的用法 ,symbol在对象中的应用,改变值

    ES6-Symbol的用法,,symbol在对象中的应用,改变值 let a = new String; let b = new Number; let c = new Boolean; let d ...

  6. Servlet 使用介绍(2)

    说明 本篇由于介绍Servlet容器回传请求方法service(ServletRequest req, ServletResponse res);传入参数用户请求参数request和请求返回参数res ...

  7. 部署web01,web02,nfs,db01,backup,搭建wordpress,WeCenter,实现共享,热备,实时备份

    小结 部署web01,web02,nfs,db01,backup,搭建wordpress,WeCenter,实现共享,热备,实时备份 1)在web01和web02上安装nginx和php 2)创建ww ...

  8. MySQL中if的写法

    关键词:IF --if 判断,如果 device_num 的值为1,则赋值为100,反之为200 SELECT district, shop_name, IF ( device_num , , ) A ...

  9. 小程序npm(初级篇)

    小程序npm NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种: 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从NP ...

  10. Codeforces Round #586 (Div. 1 + Div. 2)

    传送门 A. Cards 记录一下出现的个数就行. Code #include <bits/stdc++.h> #define MP make_pair #define fi first ...