javascript - 为什么 greet 函数没有返回预期值？

Question

问题：

为什么 greet 函数没有返回预期值？

代码：

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

Person.prototype.greet = function(otherName){
     return "Hi" + otherName + ", my name is " + name;
}

我该如何回答这个问题？我创建了一个新人，那我该怎么办？

var John = new Person("John");

Answer 1

访问方法错误。变量name未定义，仅this.name定义。所以它在函数范围内寻找一个变量被调用name，而不是对象的属性被调用name。

要从对象内部访问对象的属性，我们使用this关键字。因此，我们需要在下面的实现中使用this.name来访问该name属性。

Person.prototype.greet = function(otherName){
     return "Hi" + otherName + ", my name is " + this.name;
}

Answer 2

在您的代码中：

> function Person(name) {
>     this.name = name;
> }

当作为构造函数调用时，上面将创建一个名为name的实例的命名属性，并为其分配name参数的值。

> Person.prototype.greet = function(otherName){
>     return "Hi" + otherName + ", my name is " + name;
> }

这里标识符名称用作变量，但您要查找的标识符是实例的命名属性，因此您需要访问它。通常，此函数将作为实例的方法调用，因此函数中的this将是对实例的引用。所以你要：

      return "Hi" + otherName + ", my name is " + this.name;

所以现在你什么时候可以做（注意以大写字母开头的变量，按照惯例，是为构造函数保留的）：

> var john = new Person("John");

进而：

john.greet('Fred');

因为greet作为john的一个方法被调用，所以它会返回：

Hi Fred, my name is John

Answer 3

或者，由于这是范围继承的问题（第二个函数无法访问变量“name”），我们可以将代码改写为如下所示，以将其全部包含在 Person 函数下：

function Person(name){
   this.name = name;
   this.greet = function(otherName){
      return "Hi" + otherName + ", my name is " + name;
    }
}

也可以。

Answer 4

您需要更改 greet 函数以使用带有this关键字的对象名称：

Person.prototype.greet = function(otherName){
     return "Hi" + otherName + ", my name is " + this.name;
}

之后，只需致电John.greet("other name");

Answer 5

尝试以下操作：

function Person(name){
   this.name = name;
   this.greet = function(otherName){
      return "Hi " + otherName + ", my name is " + name;
    }
} 

Person("Joe")
greet("Kate")