Question

我是javascript的新手，我正在做一个小应用程序作为练习做出反应，但我遇到了一个奇怪的问题。我试图在同一个类的另一个方法中调用一个方法，但它并不总是有效。

export class Core {
constructor() {
    this.promptList = ["Are you sure you want to proceed? [Y/n] ",
                        "Enter a username: ",
                        "Enter your email: "];
    this.funcList = [this.proceed,
                    this.validateUser,
                    this.validateEmail];

    this.currentStep = 0;
}

incStep(state) {
    const newState = Object.assign({}, state,
        {prompt: this.promptList[++this.currentStep]});
    return newState;
}

printError(state, error) {
    console.log("error");
    return Object.assign({}, state,
        {history: state.history.concat(error)});
}

proceed(input, state) {
    if (input == "Y")
        return this.incStep(state);
    else if (input == "n")
        return this.printError(state, "ok bye");
    return state;
}

validateUser(input, state) {
    return state;
}

validateEmail(input, state) {
    return state;
}

process(input, currentState) {
    const newState = Object.assign({}, currentState,
        {history: currentState.history.concat(input)});
    return this.funcList[this.currentStep](input, newState);
}

}

在process（）中，我从函数列表中调用一个方法，这很好但是当我尝试从proceed（）调用incStep（）时会抛出错误

Uncaught TypeError: this.incStep is not a function
at Array.proceed (http://localhost:8080/index_bundle.js:31881:34)
at Core.process (http://localhost:8080/index_bundle.js:31898:42)

我猜这个错误是由于“this”没有引用好的对象，但我不明白为什么在这种情况下：/

我在这里做错了什么？

Answer 1

由于这些部分，您的代码失败了。

this.funcList = [this.proceed,
                this.validateUser,
                this.validateEmail];

你需要记住数组是js中的特殊对象，所以它是 等同于 到

this.functList = {0:refrence of proceed,
                  1:refrence of validateUser,
                  2:refrence of validateEmail,
                  length:3
                  }

当一个函数作为一个对象的方法被调用时，它被设置为调用该方法的对象。所以当

 this.funcList[this.currentStep](input, newState);

被调用并继续执行，这属于它所驻留的对象，在本例中是funcList数组。

proceed(input, state) {
if (input == "Y")
    return this.incStep(state);

因此，在inside中的这个调用是指funclist数组而不是类并且失败。

使用bind来设置这个是解决此问题的一种方法。

this.funcList = [this.proceed.bind(this),
                 this.validateUser.bind(this),
                 this.validateEmail.bind(this)];

从方法错误“X不是函数”调用方法

1 个答案: