JavaScript 如何使用闭包

netScorpion 发布于2019-08-23 15:34 / 2935人阅读

摘要：原因因为函数创建的是一个可以访问其外部作用域的函数闭包，该作用域包含索引的循环。经过秒后，的值已经变为。正确的写法写法一写法二

闭包基本上是内部函数可以访问其范围之外的变量，可用于实现隐私和创建函数工厂

定义一个数组，循环遍历这个数组并在延迟3秒后打印每个元素的索引

先看一个不正确的写法：

const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
  setTimeout(function() {
    alert("The index of this number is: " + i);
    console.log("The index of this number is: " + i);
  }, 3000);
}

看下执行效果：

如上图：3秒后每次都是打印4，而不是0，1，2，3。

原因：因为setTimeout函数创建的是一个可以访问其外部作用域的函数（闭包），该作用域包含索引i的循环。经过3秒后，i的值已经变为4。

正确的写法：
写法一：

const arr = [10, 12, 15, 21];
for (var i = 0; i < arr.length; i++) {
  setTimeout(function(i_local){
    return function () {
      alert("The index of this number is: " + i_local);
      console.log("The index of this number is: " + i_local);
    }
  }(i), 3000)
}

写法二：

const arr = [10, 12, 15, 21];
for (let i = 0; i < arr.length; i++) {
  setTimeout(function() {
    alert("The index of this number is: " + i);
    console.log("The index of this number is: " + i);
  }, 3000);
}

云服务器 GPU云服务器 javascript闭包如何使用javascript javascript如何使用 javascript闭包详解

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/102248.html

面试官问我：什么是JavaScript闭包，我该如何回答

摘要：到底什么是闭包这个问题在面试是时候经常都会被问，很多小白一听就懵逼了，不知道如何回答好。上面这么说闭包是一种特殊的对象。闭包的注意事项通常，函数的作用域及其所有变量都会在函数执行结束后被销毁。从而使用闭包模块化代码，减少全局变量的污染。闭包，有人说它是一种设计理念，有人说所有的函数都是闭包。到底什么是闭包？这个问题在面试是时候经常都会被问，很多小白一听就懵逼了，不知道如何回答好。这个...

BenCHou 2019-08-23 15:19 评论0 收藏0
Javascript闭包入门(译文)

摘要：也许最好的理解是闭包总是在进入某个函数的时候被创建，而局部变量是被加入到这个闭包中。在函数内部的函数的内部声明函数是可以的可以获得不止一个层级的闭包。前言总括：这篇文章使用有效的javascript代码向程序员们解释了闭包，大牛和功能型程序员请自行忽略。译者：文章写在2006年，可直到翻译的21小时之前作者还在完善这篇文章，在Stackoverflow的How do Java...

Fourierr 2019-08-20 13:56 评论0 收藏0
JavaScript闭包，只学这篇就够了

摘要：当在中调用匿名函数时，它们用的都是同一个闭包，而且在这个闭包中使用了和的当前值的值为因为循环已经结束，的值为。最好将闭包当作是一个函数的入口创建的，而局部变量是被添加进这个闭包的。闭包不是魔法这篇文章使用一些简单的代码例子来解释JavaScript闭包的概念，即使新手也可以轻松参透闭包的含义。其实只要理解了核心概念，闭包并不是那么的难于理解。但是，网上充斥了太多学术性的文章，对于...

CoderBear 2019-08-21 11:56 评论0 收藏0
进击JavaScript之（三）玩转闭包

摘要：为了更好的理解，在阅读此文之前建议先阅读上一篇进击之词法作用域与作用域链什么是闭包闭包的含义就是闭合，包起来，简单的来说，就是一个具有封闭功能与包裹功能的结构。在中函数构成闭包。为了更好的理解，在阅读此文之前建议先阅读上一篇《进击JavaScript之词法作用域与作用域链》 1.什么是闭包闭包的含义就是闭合，包起来，简单的来说，就是一个具有封闭功能与包裹功能的结构。所谓的闭包就是...

cyixlq 2019-08-20 10:30 评论0 收藏0
JavaScript - 收藏集 - 掘金

摘要：插件开发前端掘金作者原文地址译者插件是为应用添加全局功能的一种强大而且简单的方式。提供了与使用掌控异步前端掘金教你使用在行代码内优雅的实现文件分片断点续传。 Vue.js 插件开发 - 前端 - 掘金作者：Joshua Bemenderfer原文地址: creating-custom-plugins译者：jeneser Vue.js插件是为应用添加全局功能的一种强大而且简单的方式。插....

izhuhaodev 2019-08-21 11:44 评论0 收藏0
前端基础进阶（四）：详细图解作用域链与闭包

摘要：之前一篇文章我们详细说明了变量对象，而这里，我们将详细说明作用域链。而的作用域链，则同时包含了这三个变量对象，所以的执行上下文可如下表示。下图展示了闭包的作用域链。其中为当前的函数调用栈，为当前正在被执行的函数的作用域链，为当前的局部变量。 showImg(https://segmentfault.com/img/remote/1460000008329355);初学JavaScrip...

aikin 2019-08-21 18:29 评论0 收藏0