当前位置：首页>编程日记>正文

Promise和Promise的方法

编程日记 2023/12/19 13:01:52

（Promise和Promise的方法）

Promise是ES6一个伟大的发明，他使我们从回调地狱中能够走出来。

什么是Promise

从字面上来看，Promise就是一个承诺。那么，在ES6当中，Promise通常用来控制异步操作。当一个异步操作成功的时候，触发.then的操作。当一个异步操作不成功的时候，触发.catch操作。那么，我们来写下一个Promise的操作吧。

const loadData = new Promise((resolve, reject) => {
setTimeout(() => {rseolve({data: "loding Done!"})
}, 2000)
})
loadData.then(data => {
console.log(data.data);
})
复制代码

上例就是一个典型的Promise例子。当我们去执行一个数据库的读取操作的时候，我们通常都是耗费时间的。是一个异步操作。那么，我们用setTimout去模拟读取数据的时间。当这个数据读取完成之后，再去通知下面的代码对应去执行相应的动作。这里，我们利用resolve发出一个完成的信号。下面的代码利用一个.then去接收到这个完成的信号同时执行相应的完成操作。

当然，如果异步操作失败了，我们可以通过reject去发出一个操作失败的信号，在.catch当中去捕捉并处理这个信号。

const loadData = new Promise((resolve, reject) => {setTimeout(() => {reject("Timeout!")}, 3000)
})
复制代码

loadData.catch(err => { console.log(err) }) 处理多个Promise 在ES6当中，共有两种处理多个Promise的方法。

Promise.all(); Promise.race(); Promise.all 例如，当我们去读取页面的主体内容和页面的标题内容時，两个异步请求互不相关。那么，我们就可以同时去发起ajax请求。

const loadMain = new Promise((resolve, reject) => {setTimeout(() => {resolve({data: {title: "主体标题"，desc: "主体内容"}})}, 2000)})const loadSide = new Promise((resolve, reject) => {
setTimeout(() => {resolve({data: {list: ["主页","新闻列表","关于"]}})
}, 500)
})Promise.all([loadMain, loadSide]).then(res => {console.log(res)}).catch(err => {console.log(err)})
复制代码

注意点:

当我们使用all方法发起请求的时候，只有所有的Promise成功后，才会执行.then方法。任何一个错误，都会导致执行.catch方法。 Promise.race() race方法也是用于处理多个Promise请求的，不同于all方法的是，race方法接收最快收到的Promise请求，无论是成功还是失败，都以最快的为准。

查看全文

http://www.coolblog.cn/news/8a2dc25771321e97.html