Js es6类构造函数在构造函数实例化之前运行[重复]

Question

我有一个 es6 类，可以从函数调用中实例化一个变量，但问题是函数似乎在构造函数实例化之前运行并抛出错误：

  constructor() {
    this.userSelections = {
      types    : this.getTypes(),
      providers: this.getProvider()
    } 
  }

 getProvider() {
    // here its throw error that this.userSelections is undefined
    var activeType = this.userSelections.types.some(( type ) => {
      return type.active;
    });

  }

有什么问题，我该如何处理这种情况？

Answer 1

问题与类、ES6 或 Babel 无关。这是您问题的简化版本：

var foo = {
  bar: 42,
  baz: foo.bar * 2
};

这将引发错误，因为在访问 foo.bar 时，foo 尚未初始化。

在您的情况下，您正在调用getProvider在创建要分配给this.userSelections 的对象。 this.userSelections或其值尚不存在，仍在构造中。

您可以分两步初始化该值：

this.userSelections = {
  types: this.getTypes()
};
// now that `this.userSelections` exists, we can call `this.getProvider` without problems
this.userSelections.providers = this.getProvider();

或重构您的代码，以便 getProviders 接受 types 作为参数，可能类似于：

class Foo {
  constructor() {
    let types = this.getTypes();
    this.userSelection = {
      types,
      providers: this._getProvider(types)
    };
  }

  _getProvider(types) {
    var activeType = types.some(( type ) => {
      return type.active;
    });
    // ...
  }

  getProvider() {
    return this._getProvider(this.userSelection.types);
  }
}