关于javascript:我将闭包讲给你听

MDN 中对闭包有以下定义：

一个函数和对其四周状态（lexical environment，词法环境）的援用捆绑在一起（或者说函数被援用突围），这样的组合就是闭包（closure）。也就是说，闭包让你能够在一个内层函数中拜访到其外层函数的作用域。在 JavaScript 中，每当创立一个函数，闭包就会在函数创立的同时被创立进去。

从上述定义中咱们能够总结出 4 点 ( 重点)：

1、闭包 是在 函数创立 时创立的，即有 函数创立就会生成闭包；
2、闭包 和其函数 在同一上下文中；
3、闭包蕴含该作用域下的所有变量 / 援用地址；
4、定义函数不会创立闭包，只有创立 / 执行函数同时才创立闭包；

留神：应用闭包时肯定要留神其作用域！

如下图：第 1 行到第 9 行 ，只波及到 变量的申明赋值 和函数的定义 ，所以 不会有闭包产生 ；当代码执行到 第 10 行 ，执行函数fn 创立函数实例，因而会随同着 创立该作用域的一个闭包 ，闭包中蕴含变量 a 和 b；当第 10 行执行完， 函数实例销毁（函数外部没有援用内部变量），闭包也就随之销毁。

“一”中代码实例次要介绍了闭包和函数的创立，如果仅仅是这些形容，咱们也没有必要去理解和应用闭包；然而，当 函数中“援用”（借用）了内部的变量 后，所有都变得精彩了：
代码剖析：

function makeAdder() {
  var sum = 0
  return function(y) {
    sum += y;
    return sum
  };
}

var add1 = makeAdder();
var add2 = makeAdder();

console.log(add1(1));  // 1
console.log(add1(1));  // 2

console.log(add2(2));  // 2
console.log(add2(2));  // 4

剖析下图：

1、1-7行定义了makeAdder 函数，并将函数定义存储在内存中（蓝色圈圈）；
2、第 9 行，调用 makerAdder 定义 执行 1 - 7 行 代码，申明并赋值 sum；将 3- 6 行函数定义 返回并赋值给变量 add1，同时 创立对应闭包 ，寄存 sum 变量，且值为 0； 第 9 行执行结束，销毁本地执行上下文和 sum 变量，控制权交给调用上下文；
3、第 10 行，调用 makerAdder定义执行 1 - 7 行 代码，申明并赋值 sum；将 3- 6 行函数定义 返回并赋值给变量 add2，同时 创立对应闭包 ，寄存 sum 变量，且值为 0； 第 10 行执行结束，销毁本地执行上下文和 sum 变量，控制权交给调用上下文；
4、因为 add1 和 add2 创立 两个新的函数实例，所以其绝对应 闭包是互相不影响 的；
5、执行到 12 行，调用 add1 实例并 执行函数（3- 6 行），传入参数 y 为 1，执行 sum += y，在查找本地或全局执行上下文之前，让咱们 检查一下闭包，后果闭包蕴含一个名为 sum 的变量，sum 变量从 0 变为 1，同时返回 sum，最终打印出 1。执行结束，销毁本地执行上下文；
6、执行到 13 行，调用 add1 实例并 执行函数（3- 6 行），传入参数 y 为 1，执行 sum += y，在查找本地或全局执行上下文之前，让咱们 检查一下闭包，后果闭包蕴含一个名为 sum 的变量，sum 变量从 1 变为 2，同时返回 sum，最终打印出 2。执行结束，销毁本地执行上下文；
7、执行到 15 行，调用 add2 实例并 执行函数（3- 6 行），传入参数 y 为 1，执行 sum += y，在查找本地或全局执行上下文之前，让咱们 检查一下闭包 （此时的 闭包和 add1 的闭包处于不同函数实例，故互相不不影响），后果闭包蕴含一个名为 sum 的变量，sum 变量从 0 变为 2，同时返回 sum，最终打印出 2。执行结束，销毁本地执行上下文；
8、执行到 16 行，调用 add2 实例并 执行函数（3- 6 行），传入参数 y 为 1，执行 sum += y，在查找本地或全局执行上下文之前，让咱们 检查一下闭包，后果闭包蕴含一个名为 sum 的变量，sum 变量从 2 变为 4，同时返回 sum，最终打印出 4。执行结束，销毁本地执行上下文；

在 全局作用域中创立的函数创立闭包 ，然而因为这些 函数是在全局作用域中创立 的，所以它们能够 拜访全局作用域中的所有变量 ， 闭包的概念并不重要 。当 函数返回函数 时，闭包的概念就变得更加重要了。返回的函数 能够 拜访不属于全局作用域的变量 ，但它们 仅存在于其闭包 中。

题目所说的循环是指在 for 循环的代码块中应用闭包所带来的的懊恼：

function starfunc() {
  var tipText = [
      'hello tom',
      'hello jerry',
      'hello jack'
    ];

  for (var i = 0; i < tipText.length; i++) {var item = tipText[i];
    setTimeout(() => {console.log(item);
    }, 100);
  }
}

starfunc();

来，猜一猜最终会输入什么？依照冀望，咱们想最终打印进去的是 hello tom；hello jerry；hello jack，然而实际上会间断打印三次hello jack 为什么呢？这里会波及到执行上下文（全局作用域、函数作用域、块级作用域）和事件循环相干内容（传送门）（默认大家都会哈）。

因为 for 循环体中变量 item 是 var 申明的，所以会 变量提前 到starfunc 函数的顶部 ，整个函数外部是 一个函数作用域 / 执行上下文；

1、依据 事件循环 规定，执行到 第 10 行 时，setTimeout进入 调用栈 期待，回调函数 会进 入 Event Table执行，在 回调函数创立时生成闭包 ，将item 存入；
2、当 i 为0时，闭包中 item 为hello tom；
3、for循环持续，当 i 为1时，闭包中 i tem为hello jerry；
4、for循环持续，当 i 为2时，闭包中 item 为hello jack；
5、循环完结 ， 主线程执 行结束呈现 闲暇 工夫，调用栈 的Event Queue中顺次打印三次 item，而item 则是 从闭包中获取 ，这就是为什么最终 输入三遍 hello jack；

那有什么办法解决呢，请看代码：

for循环体中变量 item 应用 let 申明，此时 starfunc 函数是一个 函数作用域 ，而每次for 循环 时，都会创立一个 块级作用域 ，产生不同的 执行上下文 ，各个 上下文 独自治理本人的变量：

1、依据 事件循环 规定，执行到 第 10 行 时，setTimeout进入 调用栈 期待，回调函数 会进 入 Event Table执行，在 回调函数创立时生成闭包 ，将item 存入；
2、当 i 为0时，独自作用域产 生本人的 执行上下文 ，该 上下文 对应闭包中 item 为hello tom；
3、for循环持续，当 i 为1时，独自作用域 产生本人的 执行上下文 ，该 上下文 对应闭包中 i tem为hello jerry；
4、for循环持续，当 i 为2时，独自作用域 产生本人的 执行上下文 ，该 上下文 对应闭包中 item 为hello jack；
5、循环完结 ， 主线程执 行结束呈现 闲暇 工夫，调用栈 的Event Queue中顺次打印三次 item，而item 则是 从三个不同互不影响的闭包中获取 ，最终 输入 hello tom；hello jerry；hello jack；

如果不是某些 特定工作须要 应用闭包，在其它 函数中创立函数是不明智 的，因为闭包在 处理速度 和内存耗费方面 对脚本性能具备 负面影响 。例如，在创立新的对象或者类时，办法通常应该关联于对象的原型，而不是定义到对象的结构器中。起因是这将导致 每次结构器被调用时，办法都会被从新赋值一次 （也就是说，对于每个对象的创立，办法都会被从新赋值）。
示例：

function MyObject(name, message) {this.name = name.toString();
  this.message = message.toString();
  this.getName = function() {return this.name;};

  this.getMessage = function() {return this.message;};
}

在下面的代码中，并 没有利用到闭包的益处 ，因而能够 防止应用闭包。批改成如下：

function MyObject(name, message) {this.name = name.toString();
  this.message = message.toString();}
MyObject.prototype.getName = function() {return this.name;};
MyObject.prototype.getMessage = function() {return this.message;};

闭包的应用波及到很多方面，例如框架中 数据的双向绑定 ， 函数的公有属性 等；理解闭包的相干常识一是为了在开发中 防止因为闭包带来的不利影响 、二则是要长于 利用闭包的个性解决理论问题！

关于javascript:我将闭包讲给你听

一、什么是闭包

二、函数援用内部变量后的闭包

三、循环中闭包让人很意外

四、闭包的性能

五、小结