我收集了一个互动的JavaScript教程来解释关闭是如何工作的。

下面是其中一个例子:

var create = function (x) {
    var f = function () {
        return x; // We can refer to x here!
    };
    return f;
};
// 'create' takes one argument, creates a function

var g = create(42);
// g is a function that takes no arguments now

var y = g();
// y is 42 here

我喜欢Kyle Simpson的关闭定义:

关闭是函数能够记住和访问其语法范围,即使该函数在其语法范围之外运行。

语法范围是当一个内部范围能够访问其外部范围时。

此分類上一篇: You Don't Know JS: Scopes & Closures

function foo() {
  var a = 2;

  function bar() {
    console.log( a );
  }
  return bar;
}

function test() {
  var bz = foo();
  bz();
}

// prints 2. Here function bar referred by var bz is outside 
// its lexical scope but it can still access it
test(); 

在模块模式中,您定义了一个函数,然后立即在所谓的即时启动函数表达(IIFE)中呼叫它。 您在该函数中所写的一切都有私人范围,因为它在关闭中定义,从而允许您在JavaScript中“模拟”隐私。

 var Closure = (function () {
    // This is a closure
    // Any methods, variables and properties you define here are "private"
    // and can't be accessed from outside the function.

    //This is a private variable
    var foo = "";

    //This is a private method
    var method = function(){

    }
})();

另一方面,如果您希望在关闭室外看到一个或多个变量或方法,您可以将其返回对象内部。

var Closure = (function () {
  // This is a closure
  // Any methods, variables and properties you define here are "private"
  // and can't be accessed from outside the function.

  //This is a private variable
  var foo = "";

  //This is a private method
  var method = function(){

  }

  //The method will be accessible from outside the closure
  return {
    method: method
  }

})();

Closure.method();

希望能帮忙......看,

函数和函数的外部范围(语法环境)的参考

函数 汽车(制造商,模型,年,颜色) { 返回 { 到String() { 返回 `${ 制造商} ${ 模型} (${ 年}, ${ 颜色})` } } 组车 = 新车(‘Aston Martin’,‘V8 Vantage’,‘2012’,‘Quantum Silver’) console.log(car.toString())

事件导向的编程

在下面的例子中,所有实施细节都隐藏在即时执行的函数表达式内。 函数标记和 toString 接近私人状态和函数他们需要完成工作。 关闭已使我们能够模块化和包容我们的代码。

例子1

这个例子表明,本地变量在关闭中没有复制:关闭保持了对原始变量的参考。

左边

一个六岁的答案(假设他知道什么是函数,什么是变量,以及什么数据):

函数可以返回数据. 从函数可以返回的一种数据是另一个函数. 当该新函数返回时,在创建的函数中使用的所有变量和论点都不会消失. 相反,该母函数“关闭”。 换句话说,没有什么可以看到它的内部,看到它所使用的变量,除了它返回的函数。

function the_closure() {
  var x = 4;
  return function () {
    return x; // Here, we look back inside the_closure for the value of x
  }
}

var myFn = the_closure();
myFn(); //=> 4

另一种非常简单的方式来解释它是从范围来看:

每当你在更大的范围内创建一个较小的范围时,更小的范围总是能够看到更大的范围。

TLDR

细节

当一个函数通过内部(呼叫)方法引用时,函数对象的环境参考将复制到新创建的执行框架(stack frame)环境记录的外部环境参考。

在下面的例子中,函数f 关闭了全球执行背景的语法环境:

function f() {}

在下面的例子中,函数h在函数g的语法环境中关闭,而函数h则在全球执行背景的语法环境中关闭。

function g() {
    function h() {}
}

如果内部函数由外部函数返回,则外部语法环境在外部函数返回后将继续存在,因为如果内部函数最终被召回,则外部语法环境必须可用。