Question

嵌套在原型函数下的函数不会获得为原型定义的this.variables。

var Person, p;

Person = function(name, age) {
  this.name = name;
  this.age = age;
};

Person.prototype.getInfo = function() {
  var innerFun;
  innerFun = function() {
    return this.name;
  };
  return "name: " + (innerFun()) + " age: " + this.age;
};

p = new Person('dork', 99);

console.log(p.getInfo());      // name:  age: 99

我认为因为每个函数都是一个对象，所以这个在每个函数定义中会有所不同;但是下面的代码打破了这种逻辑。

var getInfo;

getInfo = function() {
  var display;
  this.name = 'dork';
  return display = function() {
    return this.name;
  };
};

console.log(getInfo()());     // dork

这种行为背后是否存在逻辑，或者我应该将其作为规则并使用call（）来解决此问题？

Answer 1

this行为的简短版本：

在x.f()调用的函数中，this将为x （注意：调用为x.f()。无论你如何以及在何处定义它都无关紧要。）
在f()调用的函数中，this将为window。
在x['f']()调用的函数中，this将是 ~~window~~ x（不知道为什么我不这么认为）
在f.call(x)或f.apply(x)调用的函数中，this将为x。

再次，原型无关紧要，如果你这样做

var f = p.getInfo;
console.log(f());

你会发现只有召唤风格很重要。

Answer 2

总结结论：

规则：如果没有上下文用于函数调用，则默认上下文是全局窗口对象

this.name = 'global';
console.log(p.getInfo());       // name: global age: 99

解决方法1
使用呼叫/申请

return "name: " + (innerFun.call(this)) + ": Age " + this.age;

溶液2
对内部函数

使用 this

this.innerFun = function() {
  return this.name;
};
return "name: " + (this.innerFun()) + ": Age " + this.age;

solution3

self = this
innerFun = function() {
  return self.name;
};

嵌套在原型函数下的函数表现不同

2 个答案: