ฉันมีปัญหาในการทำความเข้าใจความแตกต่างระหว่างการใส่.catchก่อนและหลังในสัญญาซ้อนกัน

ทางเลือกที่ 1:

test1Async(10).then((res) => {
  return test2Async(22)
    .then((res) => {
      return test3Async(100);
    }).catch((err) => {
      throw "ERROR AFTER THEN";
    });
}).then((res) => {
  console.log(res);
}).catch((err) => {
  console.log(err);
});

ทางเลือกที่ 2:

test1Async(10).then((res) => {
   return test2Async(22)
     .catch((err) => {
        throw "ERROR BEFORE THEN";
      })
      .then((res) => {
        return test3Async(100);
      });
  }).then((res) => {
    console.log(res);
  }).catch((err) => {
    console.log(err);
  });

พฤติกรรมของแต่ละฟังก์ชั่นมีดังนี้, test1 ล้มเหลวถ้าหมายเลข<0test2 ล้มเหลวถ้าตัวเลข> 10และ test3 100ล้มเหลวหากจำนวนไม่ได้ ในกรณีนี้ test2 ล้มเหลวเท่านั้น

ฉันพยายามรันและทำให้ test2Async ล้มเหลวทั้งก่อนและหลังจากนั้นจะทำงานในลักษณะเดียวกันและนั่นไม่ได้ดำเนินการ test3Async ใครช่วยอธิบายความแตกต่างหลักของการวางที่จับในที่ต่างๆให้ฉันได้ไหม

ในแต่ละฟังก์ชั่นฉันconsole.log('Running test X')เพื่อตรวจสอบว่าได้รับการดำเนินการหรือไม่

คำถามนี้เกิดขึ้นเนื่องจากกระทู้ก่อนหน้านี้ที่ฉันโพสต์จะเปลี่ยนการโทรกลับที่ซ้อนกันเป็นสัญญาได้อย่างไร? . ฉันคิดว่ามันเป็นปัญหาที่แตกต่างและควรค่าแก่การโพสต์หัวข้ออื่น

โดยพื้นฐานแล้วคุณกำลังถามว่าอะไรคือความแตกต่างระหว่างสองสิ่งนี้ ( pคำสัญญาที่สร้างขึ้นจากรหัสก่อนหน้านี้อยู่ที่ไหน):

return p.then(...).catch(...);

และ

return p.catch(...).then(...);

มีความแตกต่างไม่ว่าจะเมื่อ p แก้ไขหรือปฏิเสธ แต่ความแตกต่างเหล่านั้นมีความสำคัญหรือไม่ขึ้นอยู่กับสิ่งที่โค้ดภายใน.then()หรือ.catch()ตัวจัดการทำ

จะเกิดอะไรขึ้นเมื่อpแก้ไข:

ในรูปแบบแรกเมื่อpแก้ไขแล้ว.then()ตัวจัดการจะถูกเรียก หาก.then()ตัวจัดการนั้นส่งคืนค่าหรือคำสัญญาอื่นที่แก้ไขได้ในที่สุด.catch()ตัวจัดการนั้นจะถูกข้ามไป แต่ถ้า.then()ตัวจัดการโยนหรือตอบกลับคำสัญญาที่ปฏิเสธในที่สุด.catch()ตัวจัดการจะดำเนินการสำหรับทั้งการปฏิเสธในสัญญาเดิมpแต่ยังมีข้อผิดพลาดที่เกิดขึ้นใน.then()ตัวจัดการด้วย

ในโครงการที่สองเมื่อ pแก้ไขแล้ว.then()ตัวจัดการจะถูกเรียก หาก.then()ตัวจัดการนั้นพ่นหรือตอบกลับคำสัญญาที่ปฏิเสธในที่สุด.catch()ตัวจัดการจะไม่สามารถจับได้เพราะมันอยู่ตรงหน้ามันในห่วงโซ่

นั่นคือความแตกต่าง # 1 หาก.catch()ตัวจัดการเป็น AFTER ก็สามารถตรวจจับข้อผิดพลาดภายใน.then()ตัวจัดการได้เช่นกัน

จะเกิดอะไรขึ้นเมื่อถูกpปฏิเสธ:

ตอนนี้ในรูปแบบแรกหากคำสัญญาpปฏิเสธ.then()ตัวจัดการจะถูกข้ามไปและ.catch()ตัวจัดการจะถูกเรียกตามที่คุณคาดหวัง สิ่งที่คุณทำในไฟล์.catch()ตัวจัดการจะกำหนดสิ่งที่ส่งคืนเป็นผลลัพธ์สุดท้าย หากคุณส่งคืนค่าจาก.catch()ตัวจัดการหรือส่งคืนคำสัญญาที่แก้ไขได้ในที่สุดโซ่สัญญาจะเปลี่ยนเป็นสถานะที่แก้ไขแล้วเนื่องจากคุณ "จัดการ" ข้อผิดพลาดและส่งคืนตามปกติ หากคุณโยนหรือส่งคืนคำสัญญาที่ปฏิเสธใน.catch()ตัวจัดการสัญญาที่ส่งคืนจะยังคงถูกปฏิเสธ

ในรูปแบบที่สองหากคำสัญญาpปฏิเสธระบบ.catch()จะเรียกตัวจัดการ หากคุณส่งคืนค่าปกติหรือคำสัญญาที่แก้ไขจาก.catch()ตัวจัดการในที่สุด(ดังนั้น "การจัดการ" ข้อผิดพลาด) โซ่สัญญาจะเปลี่ยนเป็นสถานะที่แก้ไขแล้วและ.then()ตัวจัดการหลังจากที่.catch()จะถูกเรียก

นั่นคือความแตกต่าง # 2 หาก.catch()ตัวจัดการอยู่ก่อนจะสามารถจัดการข้อผิดพลาดและอนุญาตให้.then()ตัวจัดการยังคงถูกเรียก

ควรใช้เมื่อใด:

ใช้รูปแบบแรกหากคุณต้องการ.catch()ตัวจัดการเพียงคนเดียวที่สามารถจับข้อผิดพลาดทั้งในสัญญาเดิมpหรือใน.then()ตัวจัดการและการปฏิเสธจากpควรข้าม.then()ตัวจัดการ

ใช้รูปแบบที่สองหากคุณต้องการจับข้อผิดพลาดในสัญญาเดิมpและอาจ (ขึ้นอยู่กับเงื่อนไข) ปล่อยให้ห่วงโซ่สัญญาดำเนินการต่อเมื่อได้รับการแก้ไขแล้วจึงเรียกใช้.then()ตัวจัดการ

ตัวเลือกอื่น ๆ

มีอีกหนึ่งทางเลือกในการใช้การโทรกลับทั้งสองแบบที่คุณสามารถส่งผ่านได้.then()ใน:

 p.then(fn1, fn2)

สิ่งนี้รับประกันได้ว่าจะมีเพียงหนึ่งในfn1หรือfn2จะถูกเรียก ถ้าpแก้ไขได้ก็fn1จะเรียก. ถ้าpปฏิเสธก็fn2จะเรียก ไม่มีการเปลี่ยนแปลงของผลลัพธ์ที่fn1สามารถfn2เรียกได้หรือในทางกลับกัน ดังนั้นหากคุณต้องการตรวจสอบให้แน่ใจว่ามีการเรียกตัวจัดการเพียงหนึ่งในสองตัวของคุณไม่ว่าจะเกิดอะไรขึ้นในตัวจัดการเองคุณก็สามารถp.then(fn1, fn2)ใช้ได้

คำตอบของ jfriend00นั้นยอดเยี่ยม แต่ฉันคิดว่ามันเป็นความคิดที่ดีที่จะเพิ่มรหัสซิงโครนัสแบบอะนาล็อก

return p.then(...).catch(...);

คล้ายกับซิงโครนัส:

try {
  iMightThrow() // like `p`
  then()
} catch (err) {
  handleCatch()
}

ถ้าiMightThrow()ไม่โยนthen()จะถูกเรียก ถ้ามันโยน (หรือถ้าthen()ตัวมันเองขว้าง) ก็handleCatch()จะถูกเรียก สังเกตว่าcatchบล็อกไม่มีการควบคุมว่าจะthenถูกเรียกหรือไม่

ในทางกลับกัน,

return p.catch(...).then(...);

คล้ายกับซิงโครนัส:

try {
  iMightThrow()
} catch (err) {
  handleCatch()
}

then()

ในกรณีนี้ถ้าiMightThrow()ไม่โยนก็then()จะดำเนินการ หากมีการโยนก็ขึ้นอยู่กับhandleCatch()การตัดสินใจว่าthen()จะถูกเรียกหรือไม่เพราะหากมีการhandleCatch()ย้อนกลับthen()จะไม่ถูกเรียกเนื่องจากข้อยกเว้นจะถูกโยนไปยังผู้โทรทันที หากhandleCatch()สามารถจัดการปัญหาได้อย่างสง่างามก็then()จะเรียก