blocks|key|4212217|text|原因是，该变量被赋值给一个调用wrapValue()的函数，该函数返回另一个函数。|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4212218|当您将变量赋值给函数调用的返回函数时，您必须执行函数，这就是将变量作为函数调用执行的原因。|4212219|这是个#FunctionCeption。|4212220|让我给你看一个简单的例子：|4212221|​|4212222|function+one()+{
++//+This+function+returns+another+function.
++//+Note+that+this+is+anonymous+function+doesn't+have+a+name.
++return+function+()+{
++++//+This+is+another+function,+returned+by+the+first+function.
++++console.log("I+am+in+the+second+function.");
++}
}

//+Now+when+you+assign+this+to+a+function:
var+two+=+one();
//+You+are+getting+the+value+returned+by+the+one+function.+That's+actually+a+function.

//+So+now+you+are+executing+the+two+as+a+function,+because+it+is+a+function.
two();|code-block|syntax|javascript|4212223|4212224|在您的例子中，这是一个使用私有变量的问题。要在普通JavaScript中创建ES6+JavaScript，让我将其转换为：|4212225|4212226|function+wrapValue(n)+{
++let+local+=+n;
++return+function+()+{
++++return+local;
++}
}
let+wrap1+=+wrapValue(1);
let+wrap2+=+wrapValue(2);
console.log(wrap1());
console.log(wrap2());|4212227|4212228|local由父函数设置。所以它是完全不可访问的。|4212229|entityMap^0|F|B|0|0|3|G|0|0|0|0|0|0|0|0|0|0|5|0^^$0|@$1|2|3|4|5|6|7|13|8|@$9|14|A|15|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|16|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|17|8|@$9|18|A|19|B|C]]|D|@]|E|$]]|$1|J|3|K|5|6|7|1A|8|@]|D|@]|E|$]]|$1|L|3|M|5|6|7|1B|8|@]|D|@]|E|$]]|$1|N|3|O|5|P|7|1C|8|@]|D|@]|E|$Q|R]]|$1|S|3|M|5|6|7|1D|8|@]|D|@]|E|$]]|$1|T|3|U|5|6|7|1E|8|@]|D|@]|E|$]]|$1|V|3|M|5|6|7|1F|8|@]|D|@]|E|$]]|$1|W|3|X|5|P|7|1G|8|@]|D|@]|E|$Q|R]]|$1|Y|3|M|5|6|7|1H|8|@]|D|@]|E|$]]|$1|Z|3|10|5|6|7|1I|8|@$9|1J|A|1K|B|C]]|D|@]|E|$]]|$1|11|3|-4|5|6|7|1L|8|@]|D|@]|E|$]]]|12|$]]

<p>The reason is, the variable is assigned to a function call <code>wrapValue()</code> and that function returns another function.</p>

<p>When you assign the variable to that return function of the function call, then you have to execute the function, which is why you are executing the variable as a function call.</p>

<p>It's a <code>#FunctionCeption</code>.</p>

<p>Let me show you a quick example:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function one() {
  // This function returns another function.
  // Note that this is anonymous function doesn't have a name.
  return function () {
    // This is another function, returned by the first function.
    console.log("I am in the second function.");
  }
}

// Now when you assign this to a function:
var two = one();
// You are getting the value returned by the one function. That's actually a function.

// So now you are executing the two as a function, because it is a function.
two();</code></pre>
</div>
</div>
</p>

<p>In your case, it is a matter of using Private Variables. To make your ES6 JavaScript in a normal JavaScript, let me convert it:</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function wrapValue(n) {
  let local = n;
  return function () {
    return local;
  }
}
let wrap1 = wrapValue(1);
let wrap2 = wrapValue(2);
console.log(wrap1());
console.log(wrap2());</code></pre>
</div>
</div>
</p>

<p>The <code>local</code> is set by the parent function. So it is not at all accessible.</p>


blocks|key|4211821|text|MDN解释了这一点：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|4211822|你的第三行：|4211823|return+()+=>+local;|code-block|syntax|javascript|4211824|意思是：|4211825|return+function+()+{
++return+local;
}|4211826|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions^0|A|2J|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|W|8|@]|9|@$A|X|B|Y|1|Z]]|C|$]]|$1|D|3|E|5|6|7|10|8|@]|9|@]|C|$]]|$1|F|3|G|5|H|7|11|8|@]|9|@]|C|$I|J]]|$1|K|3|L|5|6|7|12|8|@]|9|@]|C|$]]|$1|M|3|N|5|H|7|13|8|@]|9|@]|C|$I|J]]|$1|O|3|-4|5|6|7|14|8|@]|9|@]|C|$]]]|P|$Q|$5|R|S|T|C|$U|V]]]]

<p>The MDN explain you that : <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions" rel="nofollow noreferrer">https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions</a></p>

<p>Your line 3 :</p>

<pre><code>return () =&gt; local;
</code></pre>

<p>mean :</p>

<pre><code>return function () {
  return local;
}
</code></pre>


blocks|key|4212321|text|()+=>+local是使用arrow+notation的anonymous+function。这是一种简短(但不等价)的function()+{+return+local;+}编写方法|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|4212322|这些函数是JavaScript中的一等公民。它们是对象，因此可以存储在变量中，作为参数传递或由函数返回。|4212323|函数：|4212324|function+wrapValue(n)+{
++++let+local+=+n;
++++return+()+=>+local;
}|code-block|syntax|javascript|4212325|返回另一个函数(上面解释的匿名函数()+=>+local+)。|4212326|声明：|4212327|let+wrap1+=+wrapValue(1);|4212328|使用参数1调用wrapValue()，并将wrapValue()返回的函数存储在wrap1局部变量中。|4212329|4212330|console.log(wrap1());|4212331|调用存储在变量wrap1中的函数并打印它返回的值。|4212332|我们可以假设wrap1是函数的名称，直到我们在wrap1变量中放入其他东西。|4212333|entityMap|0|LINK|mutability|MUTABLE|url|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions|1|https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/function#Syntax^0|0|B|1P|S|E|E|0|T|I|1|0|0|0|0|H|B|0|0|0|4|1|7|B|L|B|14|5|0|0|0|7|5|0|6|5|N|5|0^^$0|@$1|2|3|4|5|6|7|1D|8|@$9|1E|A|1F|B|C]|$9|1G|A|1H|B|C]]|D|@$9|1I|A|1J|1|1K]|$9|1L|A|1M|1|1N]]|E|$]]|$1|F|3|G|5|6|7|1O|8|@]|D|@]|E|$]]|$1|H|3|I|5|6|7|1P|8|@]|D|@]|E|$]]|$1|J|3|K|5|L|7|1Q|8|@]|D|@]|E|$M|N]]|$1|O|3|P|5|6|7|1R|8|@$9|1S|A|1T|B|C]]|D|@]|E|$]]|$1|Q|3|R|5|6|7|1U|8|@]|D|@]|E|$]]|$1|S|3|T|5|L|7|1V|8|@]|D|@]|E|$M|N]]|$1|U|3|V|5|6|7|1W|8|@$9|1X|A|1Y|B|C]|$9|1Z|A|20|B|C]|$9|21|A|22|B|C]|$9|23|A|24|B|C]]|D|@]|E|$]]|$1|W|3|R|5|6|7|25|8|@]|D|@]|E|$]]|$1|X|3|Y|5|L|7|26|8|@]|D|@]|E|$M|N]]|$1|Z|3|10|5|6|7|27|8|@$9|28|A|29|B|C]]|D|@]|E|$]]|$1|11|3|12|5|6|7|2A|8|@$9|2B|A|2C|B|C]|$9|2D|A|2E|B|C]]|D|@]|E|$]]|$1|13|3|-4|5|6|7|2F|8|@]|D|@]|E|$]]]|14|$15|$5|16|17|18|E|$19|1A]]|1B|$5|16|17|18|E|$19|1C]]]]

<p><code>() =&gt; local</code> is an <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/function#Syntax" rel="nofollow noreferrer">anonymous function</a> that uses the <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions" rel="nofollow noreferrer">arrow notation</a>. It is a short (but not equivalent) way to write <code>function() { return local; }</code></p>

<p>The functions are first-class citizens in JavaScript. They are objects and consequently they can be stored in variables, passed as arguments or returned by functions.</p>

<p>The function:</p>

<pre><code>function wrapValue(n) {
    let local = n;
    return () =&gt; local;
}
</code></pre>

<p>returns another function (the anonymous function <code>() =&gt; local</code> explained above).</p>

<p>The statement:</p>

<pre><code>let wrap1 = wrapValue(1);
</code></pre>

<p>calls <code>wrapValue()</code> with argument <code>1</code> and stores in the <code>wrap1</code> local variable the function returned by <code>wrapValue()</code>.</p>

<p>The statement:</p>

<pre><code>console.log(wrap1());
</code></pre>

<p>calls the function stored in the variable <code>wrap1</code> and prints the value it returns.</p>

<p>We can pretend that <code>wrap1</code> is the name of the function until we put something else in the <code>wrap1</code> variable.</p>


<p>This code snippet was in "Eloquent Javascript". What does line 3 mean and where is the function name? Also, how in line 7, wrap1 is being called as a function despite wrap1 being a variable.</p>

<p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>function wrapValue(n) {
  let local = n;
  return () =&gt; local;
}
let wrap1 = wrapValue(1);
let wrap2 = wrapValue(2);
console.log(wrap1());
console.log(wrap2());</code></pre>
</div>
</div>
</p>


Why variable is called as a function?

此代码片段位于"Eloquent Javascript“中。第3行是什么意思?函数名在哪里？此外，在第7行中，尽管wrap1是一个变量，但wrap1仍被作为函数调用。​function wrapValue(n) {  let local = n;  return () => local;}let wrap1 = wra...

问为什么变量被调用为函数？
EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么变量被调用为函数？EN

社区

活动

资源

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问为什么变量被调用为函数？
EN