Question

请看以下示例：

class Parent {
    constructor({ parentOnlyArg = 'default value' } = {}) {
        this.parentOnlyArg = parentOnlyArg;
    }
}

class Child extends Parent {
    // this class and also any class inheriting from it
    constructor({ visibleStyle = 'inline' } = {}) {

        // I want to pass argument to super as an object
        super(/** args **/);

        this.visibleStyle = visibleStyle;
    }
}

class Child2 extends Parent {
    // Specifying parentOnlyArg as default will change the behaviour
    constructor({ parentOnlyArg = 'another parent value',
                  someOther = 'value' } = {}) {

        // I want to pass argument to super as an object
        super(/** args **/);

        this.someOther = someOther;
    }
}

是否可以将构造函数参数传递给super？

似乎比我想象的更简单

super(...arguments);

然后，我可以使用

创建Child

var c1 = new Child(); // c.parentOnlyArg = 'default value'
var c2 = new Child2(); // c.parentOnlyArg = 'another parent value'
var c3 = new Child({ parentOnlyArg: 'changed again' }); // c.parentOnlyArg = 'changed again'

Answer 1

快速获胜是使用arguments对象。它是一个包含传递给函数的所有参数的数组。

有关MDN的更多信息。

实际上，由于arguments[0]，您可以访问功能的第一个参数。

class Child extends Parent {
    constructor({ parentOnlyArg = 'value',
                  visibleStyle = 'inline' } = {}) {
        super(arguments[0]);
        [...]
    }
}

Answer 2

您可以使用object destructuring with rest properties。它尚未由浏览器实现，但BabelJs可以对其进行转换。

＆＃13;

function assertEmpty(obj) {
  if (Object.keys(obj).length > 0) {
    throw new Error("Unexpected parameters");
  }
}
    
class A {
  constructor({ a = "foo", ...rest } = {}) {
    assertEmpty(rest);
    console.log("new A " + a);
  }
}
    
class B extends A {
  constructor({ b = "bar", ...rest } = {}) {
    super(rest);
    console.log("new B " + b);
  }
}
    
new B({a:2}); // prints 'new A 2', 'new B bar'
new B({a:4, b:5, c:6}); // throws 'Unexpected parameters'

＆＃13;

在上面的片段中，父类不会看到后代消耗的参数。如果您遇到问题，可以按@Bergi或@loganfsmyth建议。例如：

＆＃13;

class A {
  constructor(params = {}) {
    const { a = "foo" } = params;
    console.log("a=" + a);
  }
}

class B extends A {
  constructor(params = {}) {
    const { b = "bar" } = params;
    super(params);
    console.log("b=" + b);
  }
}

new B({a:2}); // prints a=2 b=bar
new B({b:5}); // prints a=foo b=5

＆＃13;

ES6将对象传递给构造函数并设置属性

2 个答案: