javascript - 使用从 Firebase 获取 Javascript 返回的数据

Question

这里是网络开发新手。我使用 Firebase 作为后端，并且遇到一种情况:我需要在数据库中查询一个值，并使用该返回值在另一个查询中与同一数据库进行匹配。

这是我的代码:

function dataLoad() {

    var valueThatINeedToUseElsewhere

    userReference.on('value',function(users){
        var currentUser = firebase.auth().currentUser.uid
        users.forEach(function(user){
            if(user.key === currentUser) {
                valueThatINeedToUseElsewhere = user.val().userName
                console.log(valueThatINeedToUseElsewhere)
            }
        })
    })
    console.log(valueThatINeedToUseElsewhere)
}

IF 条件内的 console.log 记录了正确的值。然而，上面的最后一个 console.log 不会记录任何内容，尽管变量名是在“on”函数之外声明的。为什么会发生这种情况？我如何实际使用“on”函数之外的数据？我需要使用它在另一个数据检索操作中执行类似的 IF 条件。

谢谢!

Answer 1

您现在可能正在尝试做这样的事情:

var valueThatINeedToUseElsewhere;
dataLoad();
doSomethingWith(valueThatINeedToUseElsewhere);

不幸的是，这不起作用，因为(正如 Doug 所说)数据是从 Firebase 异步加载的。当您尝试使用 valueThatINeedToUseElsewhere 时，该值尚未加载。

为什么这不起作用，一三二测试

如果您放置一些如下所示的日志语句，最容易看到这一点:

console.log("Before starting to load value")
userReference.on('value',function(users){
    console.log("Loaded value")
})
console.log("After starting to load value")

当您运行此代码时，它会打印:

Before starting to load value

After starting to load value

Loaded value

这可能不是您期望的顺序。但它完美地解释了为什么当您尝试时无法使用 valueThatINeedToUseElsewhere:它尚未加载。

重新定义问题

我发现处理这种情况的最佳方法是重新构建问题。您当前的代码是按照“首先加载值，然后使用该值执行某些操作”的逻辑编写的。对于异步加载，最好将其框架为“首先开始加载数据。一旦数据开始加载，就用它做一些事情”。

代码如下:

function dataLoad() {
    userReference.once('value',function(users){
        var currentUser = firebase.auth().currentUser.uid
        users.forEach(function(user){
            if(user.key === currentUser) {
                var valueThatINeedToUseElsewhere = user.val().userName
                doSomethingWith(valueThatINeedToUseElsewhere)
            }
        })
    })
}

正如您将看到的，我们已将需要数据的代码移至数据可用时触发的回调中。这样，您就可以保证在调用 doSomethingWith 时数据可用。我还更改了代码以使用 once，这(正如 Doug 所说)更适合您的用例。

还需要采取两个步骤，以提高代码的灵 active 和性能。

传入一个在数据加载后调用的函数

首先:在最后一次更新中，对 doSomethingWith 的调用是硬编码的，这意味着 dataLoad() 和 doSomethingWith 是紧密地联系在一起。通常最好将它们分开。为此，我们可以将所谓的回调函数传递到 dataLoad 中，然后在加载数据时调用该回调函数。这与 once() 已经执行的操作非常相似。让我们在实践中看看:

function dataLoad(callback) {
    userReference.once('value',function(users){
        var currentUser = firebase.auth().currentUser.uid
        users.forEach(function(user){
            if(user.key === currentUser) {
                var valueThatINeedToUseElsewhere = user.val().userName
                callback(valueThatINeedToUseElsewhere)
            }
        })
    })
}

差别不大。但现在您可以像这样调用 dataLoad:

dataLoad(doSomethingWith);

一旦数据加载完毕，doSomethingWith 将被调用。

通过键加载数据

最后的改变是优化。您当前的代码正在加载所有用户，而您只需要一个用户并知道他们的 key 。仅加载特定用户的效率要高得多:

function dataLoad(callback) {
    var currentUser = firebase.auth().currentUser.uid
    userReference.child(currentUser).once('value',function(users){
        var valueThatINeedToUseElsewhere = user.val().userName
        callback(valueThatINeedToUseElsewhere)
    })
}