如何在ES6中实现命名构造函数

时间:2019-04-25 03:54:26

标签: javascript ecmascript-6 es6-class

我正在尝试在ES6中实现命名构造函数的用法。这样做的原因是,我认为避免使用new关键字进行构造函数调用,而使用类的简单方法来利用其他方法会更令人愉悦。我想到了为此使用静态函数作为构造函数的Proxy

我尝试了以下操作:

class Person {
  constructor(...props) {
    let {name, age} = props;
    this.name = name;
    this.age = age;
  }
  static create(...props) {
    return new Person(props);
  }
  
  display() {
    console.log(this)
  }
}

Person.create({name: 'John', age: 28}).display(); //Simple object input

但这不能像简单的对象输入所提供的那样工作:

Person {name: undefined, age: undefined}

任何帮助将不胜感激。

更新:谢谢,@ appleapple的回答很有帮助。我没有注意到我只传递了一个论点的事实。对于那些想知道如何使用n-Ary构造函数方法(当然,使用对象很整洁,但仍然如此)的人来说,这是一个示例:

class Person {
  constructor([name, age ]) {
    this.name = name;
    this.age = age;
  }
  static create(...props) {
    return new Person(props); //return new this(props); also works
  }
  
  display() {
    console.log(this)
  }
}

Person.create('John', 28).display();

2 个答案:

答案 0 :(得分:3)

对象不是一个单一的参数,所以只需将其传递即可。

class Person {
  constructor(props) { // <-------
    let {name, age} = props;
    this.name = name;
    this.age = age;
  }
  static create(props) { // <-------
    return new Person(props); 
  }

  display() {
    console.log(this)
  }
}

Person.create({name: 'John', age: 28}).display();

答案 1 :(得分:0)

回复您的更新,实际上您可以转发参数(在这种情况下,我认为构造函数看起来更好)

class Person {
  constructor(name, age) {
    this.name = name;
    this.age = age;
  }
  static create(...props) {
    return new Person(...props); // <----------
  }
  
  display() {
    console.log(this)
  }
}

Person.create('John', 28).display();


或者您也可以在构造函数中使用rest参数(不过,我不喜欢这样)

class Person {
  constructor(...props) {  // <----------
    let [name, age]=props
    this.name = name;
    this.age = age;
  }
  static create(...props) {
    return new Person(...props); // <----------
  }
  
  display() {
    console.log(this)
  }
}

Person.create('John', 28).display();