開発日報

窓際エンジニアの開発備忘。日報は嘘です。

【防備】Angular学習参考メモ

RxJs周り

qiita.com SubscribeとPipeの違いとかAngular触っててよく分からなくなる箇所について解説されている

並列処理すげえ

hoge(userId) {
  // user取得と会社情報取得は並列で行われます。
  // forkJoinの引数は配列で記述しないと非推奨の警告が出ます。
  forkJoin([
    this.searchUser$(userId),
    this.fetchCompanyInfo$()
  ]).subscribe(data => {
    // user取得処理と会社情報取得処理が両方実行された後、
    // subscribe内の処理が実行されます。
    console.log('user: ', data[0]);
    console.log('company: ', data[1]);
  })
}

// ↓でも結果は同じ
fuga(userId) {
  forkJoin([
    this.searchUser$(userId),
    this.fetchCompanyInfo$()
  ]).pipe(
    // user取得処理と会社情報取得処理が両方実行された後、
    // pipe内の処理が実行されます。
    tap(data => {
      console.log('user: ', data[0]);
      console.log('company: ', data[1]);
    })
  ).subscribe()
}

searchUser$(userId: number): Observable<User> {
  return this.userService.fetchById$(userId);
}

fetchCompanyInfo$(): Observable<Company> {
  return this.companyService.fetchCompany$();
}