ค้นหาเว็บไซต์

javascript - Typescript async/await กับ Observable หรือ Promise


ฉันสามารถใช้ async กับ await แบบนี้ได้ไหม? ฉันกำลังทำลาย async/await อยู่หรือเปล่า? โค้ดด้านล่างทำงานได้โดยไม่มีข้อผิดพลาด ฉันทราบว่า async/await ใช้ได้เฉพาะกับ Promise<T> เท่านั้น getItem ของฉันเป็น Observable ขอบคุณ

roleService.getItem({ page: p.pageIndex + 1, pageSize: p.pageSize })
.takeUntil(this.unsubscribe$)
.map((res: ResponseDto) => <DtoModel>res.contentBody)
.do(async (dto: DtoModel) => await this.subject.next(dto.content)) // working wihtout error
.subscribe(async (dto: DtoModel) => await (this.pager = dto.pager), //working without error
          (error: any) => Observable.throw(error));

คำตอบ #1

คุณสามารถใช้ฟังก์ชัน async เหมือนกับที่คุณทำได้ แต่จะไม่มีผลในตัวอย่างของคุณ คุณต้องเข้าใจว่า ฟังก์ชัน async จะคืนค่าเป็น promise:

const fn = async function() {};
fn() instanceof Promise

ดังนั้นหากคุณใช้มันในโซ่ออบเซอร์เวเบิล คุณจะได้รับพรอมิส:

interval(500)
  .first()
  .map(async (v) => {
    return v;
  })
  .subscribe((v) => {
    console.log(v instanceof Promise); // logs `true`
  });

วิธีที่คุณสร้างตัวอย่างของคุณมันจะไม่มีผลกระทบต่อสายโซ่ observables เพราะผลลัพธ์จากตัวดำเนินการ do ถูกละเลยและไม่มีผู้ฟังสำหรับผลลัพธ์จาก callback ของ subscribe ดังนั้นโดยพื้นฐานแล้วจึงไม่มีเหตุผลที่จะใช้ async ที่นั่น

ถ้าคุณต้องการรอจนกว่า async ฟังก์ชันจะทำงานเสร็จและรับผลลัพธ์ของฟังก์ชันนั้น ให้ใช้ตัวดำเนินการ mergeMap:

interval(500)
  .first()
  .map(async (v) => {
    return v;
  })
  .mergeMap((p) => {
    return p;
  })
  .subscribe((v) => {
    console.log(v);
  });