Question

我正在阅读getify的《您不懂JS》丛书中有关范围关闭的章节。我觉得我现在已经了解了闭包在表面上是如何工作的，但是仍然无法弄清楚此代码片段如何执行闭包。

function setupBot(name,selector) {
    $( selector ).click( function activator(){
        console.log( "Activating: " + name );
    } );
}

setupBot( "Closure Bot 1", "#bot_1" );
setupBot( "Closure Bot 2", "#bot_2" );

我的看法是，在调用函数时，会在setupbot范围内为变量名称和选择器分配参数，并在单击后调用函数激活器，然后函数返回。

在这种情况下，哪个函数可以关闭哪个范围？

Answer 1

name变量正在保存在创建的闭包中

function activator(){
    console.log( "Activating: " + name );
}

因此，当您单击相应的选择器时，它将记录该名称。

该函数中未引用selector变量，因此不需要将其保存在闭包中。只是在setupBot()的初始执行期间使用。

只要函数包含在函数外部声明的变量的使用，就会创建一个闭包，并且该函数将返回或保存在某个位置（在这种情况下，它保存在click事件监听器中）。

function setupBot(name, selector) {
  $(selector).click(function activator() {
    console.log("Activating: " + name);
  });
}

setupBot("Closure Bot 1", "#bot_1");
setupBot("Closure Bot 2", "#bot_2");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button id="bot_1">Bot 1</button>
<button id="bot_2">Bot 2</button>

Answer 2

activator函数是一个新函数，当单击选择器元素时会被调用。因此，理想情况下，由于未在名称变量的范围内进行定义，因此它将无权访问名称变量。但是由于由于其外部函数包装器而位于闭包中，因此它可以访问name变量，因此此示例是闭包的示例。

此代码段如何执行关闭操作？

2 个答案: