前言

var是ES5定义变量的一种声明方式，一直听说var声明变量，存在循环变量泄漏为全局变量问题，但总是想不明白这个“全局”有什么影响，还有，到底什么时候输出的结果是递增/减的值，什么时候输出一样的值，也不清楚。

问题复现

for (var i = 1; i <= 5; i++) {
  setTimeout(function timer() {
    console.log(i)
  }, i * 1000)
}

预期效果：12345

打印结果：66666

解决方式

闭包

for (var i = 1; i <= 5; i++) {
    (function (j) {
        setTimeout(function timer() {
            console.log(j)
        }, j * 1000)
    })(i)
}

setTimeout 第三参数

for (var i = 1; i <= 5; i++) {
   setTimeout(
       function timer(j) {
           console.log(j)
       },
       i * 1000,
       i
   )
}

使用 let 定义 i

for (let i = 1; i <= 5; i++) {
    setTimeout(function timer() {
        console.log(i)
    }, i * 1000)
}

let

关于let，记住：当前的i只在本轮循环有效，每一次循环的i其实都是一个新的变量。

JavaScript 引擎内部会记住上一轮循环的值，初始化本轮的变量i时，就在上一轮循环的基础上进行计算。

另外，for循环还有一个特别之处，就是设置循环变量的那部分是一个父作用域，而循环体内部是一个单独的子作用域。

for (let i = 0; i < 3; i++) {
let i = 'abc';
console.log(i);
}
// abc
// abc
// abc

总结

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。

猜你喜欢

• JS事件监听是什么，如何设置事件监听

  本篇文章给大家带来了关于JavaScript的相关知识，其中主要整理了事件监听的相关问题，包括了什么是事件监听、设置事件监听的方法等等内容，下面一起来看一下，希望对大家有帮助。

• Axios代理配置有什么作用，如何操作

  目录Axios代理配置及响应拦截处理代理配置响应内容拦截处理Axios的proxy代理配置解析Axios代理配置及响应拦截处理Axios是vue官方推荐的异步处理方案，所以在几个vue的项目里，都用到了，所以这里写一下Axios的代理配置和响应拦截处理代理配置代理主要是为了解决跨域问题，但是现在常规解决跨域的方式，就是

• vuex中Getter的用法是什么？一文带你了解Getter

  这篇文章主要给大家分享vuex中Getter用法的内容，小编觉得挺实用的，因此分享给大家做个参考，感兴趣的朋友可以参考一下，希望大家阅读完这篇文章能有所收获，下面我们一起来学习一下吧。

• JS中isPrototypeOf函数作用是什么，有哪些应用

  这篇文章主要介绍了JavaScript中isPrototypeOf函数，isPrototypeOf() 是 Object函数（类）的下的一个方法，用于判断当前对象是否为另外一个对象的原型，如果是就返回 true，否则就返回 false，下面来看看详细内容,需要的朋友可以参考一下

• JavaScript职责链模式怎样理解？一文带你看懂

  今天给大家分享的是关于JavaScript设计模式中的职责链模式，之前我们介绍了很多JavaScript设计模式，下文对职责链模式也有实例和详细的介绍，感兴趣的朋友就继续往下看吧。