Question

我刚刚玩JavaScript并创建构造函数，我遇到了这个令人困惑的代码。

var foo = function(){
   this.x = 1;
   return function(){
      return this.x;
   }
}
var x = new foo();
console.log(x);

我执行了以下操作：

console.log(x); // The given output is expected for this line of code
console.log(x());
console.log(x()());
console.log(x()()());

以上所有内容给出了与以下相同的输出：

function (){
   return this.x;
}

有人可以解释上面代码中发生的事情。我无法给出这个问题的正确标题。对不起。

注意：我很清楚JS中的构造函数。上面的代码只是出于好奇。

Answer 1

长话短说 - 它没有做任何有用的事情。

如果构造函数返回一个对象，那么new表达式生成的值就是该值而不是构造对象。因此，不是获取foo的实例，而是获得一个返回this.x的函数。

看起来这段代码正在尝试生成一个返回所创建对象的this.x值的函数，但这并不是它所做的。由于您单独调用x()，this.x实际上是指全局 x变量，因此无论您拨打x()()()多少次，它只是回归自己。

如果您使用x以外的任何变量名称且未创建x变量（例如y），则y()将返回undefined ，y()()会产生ReferenceError。

在严格模式下这也会很快失败，因为当你试图调用它时，函数内部的this将引用undefined。

Answer 2

我的解释如下： x包含调用foo（）的结果。

foo（）返回一个函数：

function(){
      return this.x;
}

此函数的主体被写入控制台

Answer 3

以上是前一个答案的示例，演示了它：

var x = 5;
var foo = function(){
   this.x = 1;
   return function(){
      return this.x;
   }
}
var b = new foo();
b() //--> 5

Answer 4

此代码全部与函数调用上下文有关。

在运行时，this中引用的this.x = 1;绑定到与this

中引用的return this.x;不同的对象

x()在全局上下文中调用foo返回的匿名函数。对于ECMAScript 3（及更早版本）环境，全局上下文函数调用将全局对象绑定到调用函数内的this。因此，return this.x;指的是您在全局对象上定义的var x。

在ECMAScript 5中，use strict;语句可以放在任何函数声明中，以“以这种方式”禁用全局对象的绑定。

匿名嵌套函数可以在闭包中访问“foo”this：

var foo = function(){
   this.x = 1;
   var that = this;
   return function(){
      return that.x;
   }
}
var x = new foo();
console.log(x); // function(){ ...
x(); // 1

返回函数的类实例

4 个答案: