let、 var、 setTimeout,一点思考。

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

结果是很显而易见的,10次都是10,在面试前端的闭包知识时候很常见。 
用上let之后,

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

结果是: 
0、1、2、3、4、5、6、7、8、9

为什么var和let声明的i,得到不同的结果?

var声明的i,作用域不仅仅在for循环内,还在for循环的外部。

当setTimeout执行的时候,for循环已经完成,i此时的值是10,我们稍微调整一下代码:

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

结果是10次10。

for(var i = 0; i < 10; i++)

var i;
for(i = 0; i < 10; i++)

等价。

但是在let声明的时候则不一样,

for(let i = 0; i < 10; i++)

let i;
for(i = 0; i < 10; i++)

是不等价的,因为let声明只在代码块中有效。 
但是,如果仅仅这样,我们或许很容易理解

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

得到10次10,然而为什么

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

得到0-9?

在setTimeout的时候,匿名函数function(){console.log(i);}会被声明创建,当匿名函数执行的时候,会查找当前运行环境的 i 的值。 
var声明的 i ,运行环境的 i 的值为10,但是let声明的 i,运行环境中 i 的值是每一个循环创建匿名函数时候的 i。 
所以得到了0-9的值。

let替换var,可以很好的解决闭包的问题。

for var let闭包理解的更多相关文章

  1. .Net 闭包理解

    .Net 闭包理解 这个东西初看是比较难懂,但是一旦理解之后就很容易了,做笔记以加深印象.且看这题 example.1 class Program { static void Main(string[ ...

  2. javascript闭包理解

    //闭包理解一 function superFun(){ var _super_a='a'; function subfuc(){ console.log(_super_a); } return su ...

  3. JavaScript中的闭包理解

    原创文章,转载请注明:JavaScript中的闭包理解  By Lucio.Yang 1.JavaScript闭包 在小学期开发项目的时候,用node.js开发了服务器,过程中遇到了node.js的第 ...

  4. javascript之闭包理解以及应用场景

    半个月没写博文了,最近一直在弄小程序,感觉也没啥好写的. 之前读了js权威指南,也写了篇博文,但是实话实说当初看闭包确实还是一头雾水.现在时隔一个多月(当然这一段时间还是一直有在看闭包的相关知识)理解 ...

  5. JavaScript闭包理解【关键字:普通函数、闭包、解决获取元素标签索引】

    以前总觉得闭包很抽象,很难理解,所以百度一下"闭包"概览,百度的解释是:“闭包是指可以包含自由(未绑定到特定对象)变量的代码块:这些变量不是在这个代码块内或者任何全局上下文中定义的 ...

  6. JavaScript ——闭包理解

    昨天晚上听别人谈起闭包这个东西,虽然对js有一点了解但却丝毫没有印象,今天也没什么事就顺便研究了一下满足好奇宝宝.整合于网上的理解,记录一下. 一.闭包的作用域 要理解闭包,首先必须理解Javascr ...

  7. js闭包理解实例小结

    Js闭包 闭包前要了解的知识  1. 函数作用域 (1).Js语言特殊之处在于函数内部可以直接读取全局变量 <script type="text/javascript"> ...

  8. 对于 Javascript 闭包理解

    一.变量的作用域 要理解闭包,首先必须理解Javascript特殊的变量作用域. 变量的作用域无非就是两种:全局变量和局部变量. Javascript语言的特殊之处,就在于函数内部可以直接读取全局变量 ...

  9. JS闭包理解_摘

    原文地址1:http://www.cnblogs.com/mzwr1982/archive/2012/05/20/2509295.html 闭包是一个比较抽象的概念,尤其是对js新手来说.书上的解释实 ...

随机推荐

  1. 客户端ajax请求为实现Token验证添加headers后导致正常请求变为options跨域请求解决方法

    客户端为了实现token认证,通过Jquery的ajaxSetup方法全局配置headers: 全局配置headers后会导致部分不需要token认证的请求变为options请求,导致跨域访问.报错信 ...

  2. 在android工程中,res目录下又有anim、drawable、layout、menu、raw、values和xml文件夹,分别用来保存?

    res目录主要是存放资源文件的!layout 布局 这个就是你经常看到的与用户交互的界面的 xml 文件,就是各个 view 的排列和嵌套,没什 么好说的啦 风格和主题. 风格主要是指 view 的显 ...

  3. House of Roman 实战

    前言 这是前几天国外一个 老哥 提出的一种思路 ,学习了一下感觉其中的堆布局的手法还不错,做个分享与记录. 这种利用手法的主要特点是不需要 leak libc的地址,通过 堆内存的布局 和 堆相关的漏 ...

  4. ubuntu16.04安装五笔输入法

    在 Ubuntu16.04 中为fctix小企鹅增加五笔输入法 转载:https://jingyan.baidu.com/article/454316ab67d702f7a7c03a1a.html U ...

  5. iframe内存释放

    Ext 核心开发人员Jack的回答是,TabPanelItem在关闭时并不会对自定义到tab中的元素做特殊处理,这部分工作必须在控件外来完成.另一方面, 相关资料称IE在iframe元素的回收方面存在 ...

  6. https的网站用了百度分享后网站在浏览器中不安全解决方法

    本文出至:新太潮流网络博客 一.先下载百度分享需要的所有东西 下载地址:http://pan.baidu.com/s/1boM7N8V 二.打开百度分享,获取到分享的代码 三.将下载好的百度分享需要的 ...

  7. socat 的神奇使用方式

    目的是实现科* 学 * 上*网,现在记录一下流程 先在服务器上安装(比如美国,香港,台湾,马来的云主机)squid,easy_rsa, centos 下可以用yum直接安装 $ yum install ...

  8. leveldb源码分析--Key结构

    [注]本文参考了sparkliang的专栏的Leveldb源码分析--3并进行了一定的重组和排版 经过上一篇文章的分析我们队leveldb的插入流程有了一定的认识,而该文设计最多的又是Batch的概念 ...

  9. Java中的消息框

    JOptionPane.showMessageDialog(newFrame.getContentPane(),"弹出的是消息提示框!", "系统信息", JO ...

  10. System.Web.Optimization对脚本和样式表的操作

    这个也是本章重点向描述的部分,首先我们可以使用VS2012RC来新建一个MVC4.0项目,版本可以为4.0或4.5.在Global.asax文件代码中,我们发现已经把过滤器,路由器,以及对样式表和脚本 ...