使用从Firebase获取的数据获取Javascript

时间:2018-04-16 00:45:12

标签: javascript firebase firebase-realtime-database scope

Web开发新手。我使用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条件。

谢谢!

2 个答案:

答案 0 :(得分: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")

运行此代码时,会打印:

  

开始加载价值之前

     

开始加载值

     

加载值

这可能不是您预期的顺序。但它完美地解释了为什么你在尝试时无法 {/ em> valueThatINeedToUseElsewhere:它还没有加载。

重构问题

我发现处理这种情况的最佳方法是重新构建问题。您当前的代码是用&#34的逻辑编写的;首先我们加载值,然后我们用值"做一些事情。对于异步加载,最好将其框架为"首先开始加载数据。一旦数据开始加载,就用它做一些事情"。

在代码中看起来像:

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所说)更适合您的用例。

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

传入一个名为的函数加载数据

首先关闭:通过上次更新,对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

按键加载数据

最后的改变是优化。您当前的代码正在加载所有用户,而您只需要一个并知道他们的密钥。通过以下方式加载特定用户效率更高:

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

答案 1 :(得分:0)

on()是异步的并立即返回,这意味着您的控制台日志将显示未定义的值。您传递给on()的回调仅在结果可用时才会运行,并且不能保证会多快发生。您应该只在完成后使用异步调用中的值 - 不要尝试使代码阻塞,直到某些异步调用完成。

如果您只需要一次某个位置的值,也可以考虑使用once()而不是on()。您可以使用其返回的承诺在加载所需数据后链接一些额外的工作。它也是异步的(就像返回promise的所有其他方法一样)。

要详细了解Firebase API为何异步,以及这对您的应用有何意义,read this blog