javascript - .catch 前面的点是什么？ (firebase auth, react native)

Question

我对 native react 还很陌生，有一定的 C(EE 类(class))背景，只是想了解这些概念。我目前正在 Udemy 上学习 React Native 类(class)。

我正在尝试使用 firebase + react native 创建一个登录表单。在这里，如果用户登录出现错误，我想通知用户。

我在下面有两组代码，我尝试在其中做同样的事情，其中​​一组有效，而另一组无效。我想了解为什么第一个有效，为什么第二个无效

这确实有效:

    firebase.auth().createUserWithEmailAndPassword(email, password)
        .catch((error) => {
            this.setState({ error: error.message, loading: false });
        });

为什么我需要把error放在箭头函数的左边？以我的理解，箭头函数的左边是什么都可以看作是“输入”，右边是系统/输出？

这行不通:

    firebase.auth().createUserWithEmailAndPassword(email, password)
      .then(this.createFailure.bind(this))
    createFailure() {
        .catch((error) => {
            this.setState({ error: error.message, loading: false });
    });
    }

这个给了我一个“.”的解析错误。在 catch 前。

我不认为我完全理解 .catch 是如何工作的，但我只能在没有 '.' 的 mozilla 上找到 catch() 。似乎我对某些元素的工作原理缺乏一些基本的了解，是否有任何推荐的 Youtube 系列来解释这些构建 block ？我发现文档通常有太多极端情况，这让一切都变得很困惑。

Answer 1

createUserWithEmailAndPassword 返回 promise目的。该对象有一个 catch 方法，当 promise 拒绝 时，您可以使用该方法挂接一个处理程序。所以 . 就像 . 中的 $("#foo").html() 一样:它正在访问方法函数返回的对象。

Why do I need to put error on the left of the arrow function? From my understanding, whatever is on the left side of the arrow function can be seen as the "input", and the rightside is the system/output?

差不多，是的。如果 promise 拒绝，则调用箭头函数。当它被调用时，它会接收错误作为输入，然后针对该错误执行某些操作。

这段使用 promises 的异步代码:

doSomething()
.then(data => {
    // ...do something with data...
})
.catch(error => {
    // ...do something with error...
});

在逻辑上与此同步代码相同:

try {
    const data = doSomething();
    // ...do something with data
} catch (error) {
    // ...do something with error
}

事实上，如果您使用 async function ，您几乎可以像这样使用 promises 编写异步版本:

// (within an `async` function)
try {
    const data = await doSomething();
    // Note -----^^^^^^
    // ...do something with data
} catch (error) {
    // ...do something with error
}

如果你的代码不起作用，如果我假设你想在发生错误时调用 createFailure，你可能想要这个(见评论):

firebase.auth().createUserWithEmailAndPassword(email, password)
.then(result => {
    // This is the success path
    this.setState({/*...from result...*/});
}
.catch(error => {
    // This is the error path
    this.createFailure(error);
});

或在 async 函数中:

// (within an `async` function)
try {
    const result = await firebase.auth().createUserWithEmailAndPassword(email, password);
    // This is the success path
    this.setState({/*...from result...*/});
} catch (error) {
    // This is the error path
    this.createFailure(error);
}