- 需要掌握才能理解语言的复杂细节。
- 不像我们创建数组或函数那样创建。
- 一个 fn 返回另一个存储在 LHS 变量中的 fn。
const secureBooking = function(){
let passengerCount = 0;
return function(){
passengerCount++;
console.log(`${passengerCount} passengers`);
}
}
const booker = secureBooking();
booker();
booker();
booker();
登录后复制
- secureBooking fn 在全局范围内执行。
- 将在全局执行上下文上创建一个新的执行上下文。
- 每个执行上下文（EC）都有自己的变量环境及其所有变量。 'let PassengerCount = 0' 在此 EC 内定义。
它可以访问其父作用域的所有变量。
- 返回一个新的fn，并将其存储在booker中。
- 全局 EC 还将包含 booker 变量。
- 现在 secureBooking() 将从 EC 中删除并消失。 secureBooking EC 环境不再活跃。但仍然正在访问在创建 fn 时定义的 PassengerCount 变量。
- 不过，内部 fn 将能够访问外部 fn 内部定义的 PassengerCount 变量。这是由于关闭而发生的。
- 闭包使 fn 记住围绕 fn 或其 EC 的出生地定义的变量。
- booker 不是 fn，位于全局范围内。
- 现在执行booker();第一次将在调用堆栈上创建一个 EC，并具有自己的变量。
- fn 可以访问创建 fn 的执行上下文的变量环境。安全预订。因此，booker 将有权访问 secureBooking fn 变量环境中定义的变量。即使包含 fn 的 secureBooking fn 的 EC 已从调用堆栈中弹出，fn 的诞生地（即定义）与其周围变量环境的这种连接也称为闭包。
- 闭包：附加到 fn 的变量环境，与创建 fn 时的环境完全相同。
- 作用域链在闭包期间被保留，即使 EC 消失了，可变环境仍然以某种方式存在于引擎中。因此，我们说 booker fn 对父 fn 是封闭的，包括我们这里没有的父 fn 参数。
- 使用闭包，fn 不会失去与其出生地周围定义的变量的连接。
- 如果变量不在当前作用域内，JS 会在查找作用域链之前先检查闭包。假设如果有一个全局变量，即使这样，也会首先查找其闭包中定义的变量。
- 闭包优先于作用域链。
- 第一次运行 booker() 后，passengerCount 的值会增加，登录控制台，然后 booker 从调用堆栈中弹出。
- 执行移动到下一行，创建一个新的 EC，但闭包变量仍然存在。现有值增加并弹出 EC。
- 这个过程第三次重复。
概括
Defn：闭包是创建 fn 的 EC 的封闭变量环境，即使在该 EC 消失之后也是如此。
此外，闭包允许 fn 访问其父 fn 的所有变量，即使在父 fn 返回之后也是如此。 fn 保留对其外部作用域的引用，从而始终保留作用域链。
闭包确保 fn 不会失去与 fn 诞生时存在的变量的连接。它就像一个 fn 随身携带的背包。这个背包具有创建 fn 的环境中存在的所有变量。
我们不必手动创建闭包。此外，我们甚至无法显式访问封闭变量。闭包不是有形的 JS 对象，即我们无法访问闭包并从中获取变量。它是 fn 的内部属性。要查看背包，“console.dir(booker);”
[[Scope]] 将向您展示此 fn 调用的 VE。
[[]] 表示它是一个内部属性，我们无法从代码中访问它。
我们总是不需要从另一个 fn 返回一个 fn 来创建闭包。在下面的示例中，变量“f”甚至没有在 fn 内定义，因为它在全局范围内。即使在 g() 完成其 EC 之后，它也能够访问“a”变量。 ‘a’现在在‘f’的背包里。
let f;
const g = function(){
const a = 23;
f = function() {
console.log(a*2); // 46
};
};
const h = function(){
const b = 777;
f = function(){
console.log(b*2); // 1554
};
};
g();
f();
console.dir(f);
// f fn is reassigned using h fn. Hence, old closure value i.e 'a' will be replaced with new value 'b' which can be verified using console.dir().
h();
f();
console.dir(f);
登录后复制
- setTimeout(callbackFnToBeCalled, 延迟);
- 闭包变量比作用域链具有更高的优先级。
// Boarding Passengers using Closures
const boardPassengers = function(n, wait){
const perGroup = n / 3;
setTimeout(function(){
console.log(`We are now boarding all ${n} passengers`);
console.log(`There are 3 groups, each with ${perGroup} passengers`)
}, wait*1000);
console.log(`Will start boarding in ${wait} seconds`);
}
boardPassengers(180, 3);
登录后复制
以上是揭秘 JS 中的闭包的详细内容。更多信息请关注PHP中文网其他相关文章！
