为什么一个计数器起作用而另一个计数器不起作用？（闭包？）

Question

关于这个反例，我有两个问题。

为什么addVersionOne不起作用？ 为什么返回实际代码而不是数字？
addVersionTwo如何工作？ 每次运行该功能时， counter不会重置为0吗？

 const addVersionOne = function() { let counter = 0; return function() { counter += 1; return counter; } } var addVersionTwo = (function () { let counter = 0; return function() { counter += 1; return counter; } })(); function writeVersionOne(){ document.getElementById("addVersionOne").innerHTML = addVersionOne(); } function writeVersionTwo(){ document.getElementById("addVersionTwo").innerHTML = addVersionTwo(); }

 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page Title</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <button type="button" onclick="writeVersionOne()">addVersionOne</button> <button type="button" onclick="writeVersionTwo()">addVersionTwo</button> <p id="addVersionOne">0</p> <p id="addVersionTwo">0</p> <script src="main.js"></script> </head> <body> </body> </html>

Answer 1

执行此命令时：

addVersionOne()

结果是什么？ 好吧，让我们看看该函数返回什么：

//...
return function() {
    counter += 1;
    return counter;
}

它返回一个函数。 该函数从不执行，仅返回。 该函数本身被设置为目标元素的innerHTML 。

但是，这返回什么？

addVersionTwo()

请注意，第二个版本如何将所有内容包装在括号中，然后添加另一组括号以调用返回的函数。 因此，虽然变量addVersionOne是返回函数的函数，但变量addVersionTwo是返回的函数。 它返回一个值：

//...
return counter;

每次运行该功能时，计数器都不会重置为0吗？

您指的是哪个“功能”？ 你有几个。 页面加载后，该函数将被执行一次：

function () {
    let counter = 0;
    return function() {
        counter += 1; 
        return counter;
    }
}

然后，它返回一个存储在addVersionTwo变量中的addVersionTwo 。 该函数是：

function() {
    counter += 1; 
    return counter;
}

不，该函数不会在每次执行时将counter重置为0 。

Answer 2

因为函数addVersionOne的返回值是一个函数，因此很明显。 但是addVersionTwo函数实际上是返回一个函数的函数调用的结果。 因此，addVersionTwo实际上是下面的函数：

return function() {
    counter += 1; 
    return counter;
}

您可以如下定义函数addVersionTwo：

var counter = 0;

var addVersionTwo = function() {
    counter += 1; 
    return counter;
};

为什么一个计数器起作用而另一个计数器不起作用？（闭包？）

问题描述

2 个解决方案

解决方案1
1 已采纳 2018-11-27 17:57:57

解决方案2
0 2018-11-27 17:57:15

为什么一个计数器起作用而另一个计数器不起作用？ （闭包？）

问题描述

2 个解决方案

解决方案1 1 已采纳 2018-11-27 17:57:57

解决方案2 0 2018-11-27 17:57:15

为什么一个计数器起作用而另一个计数器不起作用？（闭包？）

解决方案1
1 已采纳 2018-11-27 17:57:57

解决方案2
0 2018-11-27 17:57:15