JavaScript 对象和方法，但 getName 不是函数

Question

我正在学习 JavaScript 并编写了一个简单的演示，但失败了。你能帮我弄清楚为什么 getName 不是一个函数吗？谢谢

var newPerson = function(name) {
  this.name = name;
  getName: return function() {
    return this.name;
  }  
};  
   
var personOne = newPerson("Diego");  
var personTwo = newPerson("Gangelo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Gangelo

Answer 1

我会这样做的

var Person = function(name) {
    this.name = name;
    this.getName = function() {
        return this.name;
    }
};
var personOne = new Person("Diego");
var personTwo = new Person("Gangelo");
document.write(personOne.getName()); // prints Diego  
document.write(personTwo.getName()); // prints Gangelo

Answer 2

您似乎正试图 return 一个对象，其中包含一些公开的方法。在那种情况下，这就是我会做的。

var newPerson = function (name) {
    this.name = name;
    var self = this; 

    return {
        getName: function () {
            return self.name
        }
    }
}

var personOne = new newPerson("Diego");  
var personTwo = new newPerson("Gangelo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Gangelo

编辑：感谢 Pootie

或者你也可以这样做。

    var newPerson = function (name) {
        this.name = name;
        
        this.getName = function () {
            return this.name;
        }
    }

    var personOne = new newPerson("Diego");  
    var personTwo = new newPerson("Gangelo");  
    console.log(personOne.getName()); // prints Diego  
    console.log(personTwo.getName()); // prints Gangelo

下次，使用 console.log() 而不是 document.write() 因为它更容易调试。

Answer 3

好吧，如果我们是 introducing Object-Oriented Programming，我不妨向您展示 JavaScript 如何做到最好：

// The ECMAScript 5 way

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

Person.prototype.getName = function getName() {
  return this.name;
};

var personOne = new Person("Diego");
var personTwo = new Person("Gangelo");

console.log(personOne.getName());
console.log(personTwo.getName());

下一个使用 ES6 Classes 并且是新 JavaScript 标准的一部分。

注意就浏览器实现而言，此语法仍在 "experimental stage" 中，可能无法在您的浏览器上运行。

// The ECMAScript 6 way

class Person {
  constructor(name) {
    this.name = name;
  }
  getName() {
    return this.name;
  }
}

let personOne = new Person("Diego");
let personTwo = new Person("Gangelo");

console.log(personOne.getName());
console.log(personTwo.getName());

Answer 4

既然你说你喜欢我的例子，我想我会 post 我个人的喜好。不需要像其他示例那样 return 一个对象，因为函数本身就是一个对象。事实上，JS 中的一切都是对象。

查看另一个答案的分支：https://jsfiddle.net/6xpgjh94/

var newPerson = function (name) {
    var self = this;
    self.name = name;
    self.getName = function(){
        return self.name
    };
}

var personOne = new newPerson("Diego");  
var personTwo = new newPerson("Gangelo");  
console.log(personOne.getName()); // prints Diego  
console.log(personTwo.getName()); // prints Gangelo

JavaScript 对象和方法，但 getName 不是函数

JavaScript Object and methods but getName is not a function

javascript

oop

object

member-functions