promise 讲解

Promise的出现  解决了 js 回调地狱得问题

  回调地狱图

 Promise解决回调地狱

 

是不是美观多了。。

实例化Promise时传入方法里的两个参数 resolve(成功的回调)和reject(失败的回调), 

    成功的回调在promise 实例对象后面.then((res)=>{console.log(res)})接受的 res 是执行resolve(res)的实参,   执行resolve promise状态是成功状态

    失败的回调在promise 实例对象后面.catch((res)=>{console.log(res)})接受的 res 是执行reject(res)的实参  执行reject  promise状态是失败状态

Promise 的链式操作

    

  输出结果  1 2 3 4

  整个流程在promise内没有执行reject 并且 then方法内 没有抛出错误 所以,catch是没有执行得,在then方法执行中,如果没有抛出错误 他会自动返回一个promise对象,这个对象携带then得返回值并且状态是成功状态,所以执行后面得then方法,如果遇到抛出错误,状态为失败状态,传递给后面得catch方法,比如上图我在 return 2的地方,换成return throw '123',最下面的catch方法依然能接收到 并输出  123。

 

记住几点

  1、promise 调用 promise  自身状态改为调用promise 对象

这里说下 then方法可以传两个回调函数,第二个回调函数相当于catch,执行失败状态。

  上图执行解决是输出 错误:fail

  由于p2内调用p1所以p2的执行状态变为p1的执行状态  所以输出 错误

  2、new promise(fn)    fn里得代码是同步的

  3、new promise(fuinction(resolve,reject){ resolve(); reject(); })   这段代码执行得先resolve()  所以不会在执行reject()  反过来一样  也就是这两个谁先执行,另一个就不会执行   (Promise状态已经确认不会再修改)

下面这图解释了 2、3两点    输出内容是 1   2   4

  

  

 

转载于:https://www.cnblogs.com/sxldy/p/11127952.html

对于深入理解 JavaScript Promise 和异步编程,以下是一些推荐书籍: ### 《You Don’t Know JS》系列 这本书由 Kyle Simpson 编写,是一套深入探讨 JavaScript 核心机制的书籍。其中《Async & Performance》一卷专门讨论了异步编程和 Promise 的使用,非常适合想要深入理解 JavaScript 异步模型的开发者。Promise 的概念、使用场景以及与事件循环的关系在这本书中有详细的解释[^1]。 ### 《JavaScript: The Good Parts》 虽然这本书并不专注于 Promise 或异步编程,但它为理解 JavaScript 的基础提供了坚实的基础。Douglas Crockford 对 JavaScript 的核心概念进行了深入剖析,帮助读者更好地理解语言本身,从而更有效地使用 Promise 和处理异步操作。 ### 《JavaScript 高级程序设计》(Professional JavaScript for Web Developers) 该书由 Nicholas C. Zakas 编写,是一本全面介绍 JavaScript 的权威书籍。书中涵盖了 Promise 和异步编程的详细内容,包括 Promise 的基本用法、错误处理、链式调用等,非常适合希望系统学习 JavaScript 的开发者[^2]。 ### 《JavaScript DOM 编程艺术》(JavaScript DOM Scripting) 这本书适合初学者入门,其中不仅介绍了 JavaScript 的基础语法,还讲解了如何使用 Promise 来处理异步 DOM 操作。它以实际案例说明了如何在前端开发中利用 Promise 提升代码的可读性和可维护性[^2]。 ### 《Understanding ECMAScript 6》 该书由 Nicholas C. Zakas 编写,专注于 ES6 的新特性,包括 Promise 的引入和使用。书中详细讲解Promise 的构造函数、then 和 catch 方法的使用,以及 Promise 的链式调用和错误传播机制。 ### 示例代码:Promise 基础用法 ```javascript // 创建一个 Promise const myPromise = new Promise((resolve, reject) => { setTimeout(() => { resolve("Success!"); }, 1000); }); // 使用 then 处理成功状态 myPromise .then(result => { console.log(result); // 输出 "Success!" }) .catch(error => { console.error(error); }); ``` ### 示例代码:Promise 链式调用 ```javascript fetchData() .then(data => { console.log("Data received:", data); return processData(data); }) .then(processedData => { console.log("Data processed:", processedData); }) .catch(error => { console.error("Error occurred:", error); }); function fetchData() { return new Promise(resolve => { setTimeout(() => resolve("Raw Data"), 1000); }); } function processData(data) { return new Promise(resolve => { setTimeout(() => resolve(`Processed ${data}`), 500); }); } ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值