javascript - 调用javascript构造函数的方法

我在构造函数内部调用方法时遇到麻烦。这是函数，我尝试调用它...

var Cohort = function(program, campus, number, students){
    this.program = program,
    this.campus = campus,
    this.number = number,
    this.students = students,
    function sayName(){
        return `This cohort is called ${program}, ${campus}, ${number}.`
    },
    function takeAttendance(){
        return console.log(students)
    }
}

var cohort1 = new Cohort("w", "pr", 27, ['devin', 'ben', 'bob'])
var cohort2 = new Cohort('w', 'pr', 31, ["Brendan Eich", "Dan Abramov", "Wes Bos", "Kent Dodds"])

cohort1.sayName()

控制台说cohort1.sayName不是函数。

最佳答案

您必须将方法设置到原型上。您在代码中所做的只是在Cohort函数范围内声明局部函数，因此它们不是方法。

每当调用new Cohort(...)时，都会从new Cohort().__proto__ === Cohort.prototype链接对象（Cohort.prototype），该对象成为新的this对象的Cohort，属性将保存在该对象上。设置Cohort.prototype.methods使用原型链逻辑来允许在Cohort对象的每个实例上调用这些方法

var Cohort = function(program, campus, number, students) {
    this.program = program
    this.campus = campus
    this.number = number
    this.students = students
}

Cohort.prototype.sayName = function() {
  return `This cohort is called ${this.program}, ${this.campus}, ${this.number}.`
}

Cohort.prototype.takeAttendance = function() {
  return console.log(this.students)
}

var cohort1 = new Cohort("w", "pr", 27, ['devin', 'ben', 'bob'])
var cohort2 = new Cohort('w', 'pr', 31, ["Brendan Eich", "Dan Abramov", "Wes Bos", "Kent Dodds"])

console.log(cohort1.sayName())
cohort1.takeAttendance()

console.log(Object.getOwnPropertyNames(cohort1))
console.log(Object.getOwnPropertyNames(cohort1.__proto__))

在ES6中，您只需

class Cohort {
  constructor(program, campus, number, students) {
    this.program = program
    this.campus = campus
    this.number = number
    this.students = students
  }

  sayName() {
    return `This cohort is called ${this.program}, ${this.campus}, ${this.number}.`
  }

  takeAttendance() {
    return console.log(this.students)
  }
}

var cohort1 = new Cohort("w", "pr", 27, ['devin', 'ben', 'bob'])
var cohort2 = new Cohort('w', 'pr', 31, ["Brendan Eich", "Dan Abramov", "Wes Bos", "Kent Dodds"])

console.log(cohort1.sayName())
cohort1.takeAttendance()

console.log(Object.getOwnPropertyNames(cohort1))
console.log(Object.getOwnPropertyNames(cohort1.__proto__))

该class构造实际上只是一种语法糖，实现与ES5中相同的逻辑

需要特别注意的是，以下代码也可以使用，但通常不是首选。注意方法存储位置的差异（检查最后2个console.log并与上述方法进行比较）

var Cohort = function(program, campus, number, students) {
    this.program = program
    this.campus = campus
    this.number = number
    this.students = students

    this.sayName = function() {
  return `This cohort is called ${this.program}, ${this.campus}, ${this.number}.`
    }

    this.takeAttendance = function() {
      return console.log(this.students)
    }
}

var cohort1 = new Cohort("w", "pr", 27, ['devin', 'ben', 'bob'])
var cohort2 = new Cohort('w', 'pr', 31, ["Brendan Eich", "Dan Abramov", "Wes Bos", "Kent Dodds"])

console.log(cohort1.sayName())
cohort1.takeAttendance()

console.log(Object.getOwnPropertyNames(cohort1))
console.log(Object.getOwnPropertyNames(cohort1.__proto__))