JavaScript的關閉和作用域

Question

以下是代碼：

 function fn() { var x = 1; function fn2() { x++; console.log(x); } return fn2; } var foo = fn(); var bar = fn(); foo(); //2 bar(); //2 foo(); //3 

我有一個我無法弄清楚為什么結果不是2 3 4的問題 。我的意思是，按照閉包原理，foo和bar應該保持函數fn的范圍，所以我認為foo和bar具有相同的功能X。希望你能幫助我解決這個問題。

Answer 1

foo和bar不共享相同的x 。 當調用fn時創建x 。 因此，每次調用fn都會創建一個全新的x ，品牌定義的函數fn2可以訪問該x ，並將其返回。

要檢查foo和bar不共享相同的x ，這是一個示例：

 function fn() { var x = 1; function fn2() { x++; return x; } return fn2; } var foo = fn(); var bar = fn(); console.log("foo: " + foo()); console.log("bar: " + bar()); console.log("foo: " + foo()); console.log("foo: " + foo()); console.log("foo: " + foo()); console.log("foo: " + foo()); console.log("bar: " + bar()); 

Answer 2

您需要調用第一個函數一次，並在x構建一個閉包，然后返回內部帶有函數的函數。

 var fn = function () { var x = 1; return function () { return function () { x++; console.log(x); }; }; }(); var foo = fn(); var bar = fn(); foo(); //2 bar(); //3 foo(); //4 

Answer 3

當var x創建一個私有變量時，每次分配fn（）時都會重新創建一個。 如果您要保留它，只需將var x更改為this.x：

 fn = (function() { this.x = 1; function fn2() { this.x++; console.log(this.x); } return fn2; }); var foo = fn(); var bar = fn(); foo(); //2 bar(); //3 foo(); //4 

Answer 4

這兩個是相同的調用，因此在調用它們時為2 ：

var foo = fn();
var bar = fn();

兩者都私下設置var x=1 。 因此，當您再次調用它們時， foo(); //3 foo(); //3內部函數fn2是使用增量語句調用的函數