Как правильно получить асинхронные данные?

Question

[gsdev99]

Всем привет. Подскажите, пожалуйста, как правильно получить асинхронные данные?
У меня есть класс, который запрашивает данные:

import fb from 'firebase/app';
import 'firebase/database';

class Ad {
  constructor(firstName, type, userNumber, id = null) {
    this.firstName = firstName;
    this.type = type;
    this.userNumber = userNumber;
    this.id = id;
  }
}

class DataService {
  constructor() {
    this.data = null;

    this.init();
  }

  init() {
    const config = {
      apiKey: 'AIzaSyBtvzZlxD_TLwsoE2kMZUMRPnFgz20RyjA',
      authDomain: 'javascript-app-8804a.firebaseapp.com',
      databaseURL: 'https://javascript-app-8804a.firebaseio.com',
      projectId: 'javascript-app-8804a',
      storageBucket: 'javascript-app-8804a.appspot.com',
      messagingSenderId: '916390243341',
      appId: '1:916390243341:web:d93322ea53d50bae'
    };

    fb.initializeApp(config);
  }
  
  fetchAds = () => {
    fb.database()
      .ref('users')
      .once('value')
      .then((fbVal) => {
        const ads = fbVal.val();

        const resultAds = [];

        Object.keys(ads).forEach(key => {
          const ad = ads[key];

          resultAds.push(
            new Ad(ad.firstName, ad.type, ad.userNumber, key)
          )
        });

        console.log('resultAds', resultAds);

        this.data = resultAds;

        return this.data;
      })
      .catch((e) => {
        console.log(e);
      });
  }
}

const instance = new DataService();
export default instance;

В другом классе, где мне нужны методы для получения данных, я вызываю необходимый метод. Он у меня срабатывает раньше, соответственно и данные туда не приходят.
Что я делаю не так?

export default class Users {
  constructor(el) {
    this.el = el;

    this.init();
  }

  init() {
    const data = dataService.fetchAds();
    console.log('data', data);
  }
}

Answer 1

[Даниил Братухин]

Метод dataService.fetchAds должен возвращать Promise (где-то return забыли), а в Users.init нужно получать его результат. Как-то так:

class DataService {
  fetchAds = () => {
    return fb.database().ref('users') /* остальной код */
  }
}

class Users {
  init() {
    dataService.fetchAds().then(data => {
      console.log('data', data);
    });
  }
}

Comments

[gsdev99]

Спасибо.