为啥函数返回的值总是 null 或 undefined？

Posted 2023-03-13

【中文标题】为啥函数返回的值总是 null 或 undefined？

【英文标题】：Why is the value that is always returned from the functio null or undefined?为什么函数返回的值总是 null 或 undefined？

【发布时间】：2018-02-04 03:45:08

【问题描述】：

每当我运行以下代码时，从 checkIfUserHasMadeBet() 函数返回的值总是为空。似乎代码不是在等待函数返回一个值，而是向前跳过。如何让它等待函数从 firebase 数据库返回数据？

export class DisplayBetPage 
    hasCurrentUserMadeAbet: boolean = false;

    constructor(private navParams: NavParams, public navCtrl: NavController, private afAuth: AngularFireAuth, private afDatabase: AngularFireDatabase, public alertCtrl: AlertController) 
    

   ionViewWillLoad() 
      var temp = this.checkIfUserHasMadeBet();
      console.log(temp); // comes out as null
      if (temp != null) 
         this.hasCurrentUserMadeAbet = true;
      
   

   checkIfUserHasMadeBet() 
       this.afAuth.authState.take(1).subscribe(auth =>     
           this.afDatabase.database
          .ref(`userprofile/$auth.uid/bets/$this.bettingKey`)
          .once(`value`).then(function(snapshot) 
                 console.log(snapshot.val()); 
                 // comes out with correct value [not null]
                return snapshot.val();
          );
       );
   

【参考方案1】：

var temp = this.checkIfUserHasMadeBet(); 是异步调用，而您正在执行的 console.log(temp); 处于同步上下文中，因此在该调用之后立即该值未解析并且为 null 。

更新

首先尝试实现这一点的方式有一些错误，最重要的是，最好让服务拥有这种操作，而不是在组件本身中拥有它。

组件将调用服务方法，该方法会将快照值保存在服务的subject 或behaviour subject 中，然后您的组件将订阅该服务 observable 在订阅中获取快照的值并执行所有必要的操作。

看看@这个link - 不要使用 Observables，而是使用行为主题或重放主题在组件之间传递数据（共享服务）。

按照这种方法将值传递给同一组件，上面的链接就像一个要点，让您遵循而不是实际答案。在您的场景中，不会有观察或更新组件，这两个组件都是一个。

【讨论】：

在 observable 内部还有嵌套的异步调用，这使得使用起来很困难。我建议 OP 阅读 RxJS 及其运算符的强大功能，以便轻松使用它们。

好的，非常感谢，我该如何让它异步等待调用完成？

@AdamGoldberg 更新了如何获得价值的蓝图