1 基本概念
- 名称: 译为“承诺”,这也就表达了将来会执行的操作,代表异步操作;
- 状态: 一共有三种状态,分别为pending(进行中)、fulfilled(已成功)和rejected(已失败)。
- 特点: (1)只有异步操作可以决定当前处于的状态,并且任何其他操作无法改变这个状态; (2)一旦状态改变,就不会在变。状态改变的过程只可能是:从pending变为fulfilled和从pending变为rejected。如果状态发生上述变化后,此时状态就不会在改变了,这时就称为resolved(已定型)
function runAsync(){ let p = new Promise(function(resolve, reject){ //做一些异步操作 setTimeout(function (){ let num=Math.ceil(Math.random()*10); if(num<5) { resolve(num); }else{ reject('数字太大了!') } }, 2000); }); return p; }; runAsync().then(function(data){ console.log('resolve'); console.log(data) },function(data) { console.log('reject'); console.log(data) });
最后如果这个数字大于5 则会打印出 Promise {<pending>}39787b1918052d26d1c92ea7ecfacad86e8dbfa2 VM296:19 reject VM296:20 数字太大了! 3 promise.all
- 全部成功的话 则会返回所有执行成功的resolve的回调
var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => { setTimeout(resolve, 2000, 'two'); }); var p3 = new Promise((resolve, reject) => { setTimeout(resolve, 3000, 'three'); }); var p4 = new Promise((resolve, reject) => { resolve('p4 reject!'); }); var p5 = new Promise((resolve, reject) => { resolve('p5 resolve!'); }); Promise.all([p1, p2, p3, p4, p5]).then(values => { console.log(values); }, reason => { console.log(reason) });
Promise {<pending>} VM412:18 (5) ["one", "two", "three", "p4 reject!", "p5 resolve!"] 参数中任意一个promise返回失败时,那么整体立即返回失败,返回的错误信息是第一个失败的promise结果。
var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => { setTimeout(resolve, 2000, 'two'); }); var p3 = new Promise((resolve, reject) => { setTimeout(resolve, 3000, 'three'); }); var p4 = new Promise((resolve, reject) => { reject('p4 reject!'); }); var p5 = new Promise((resolve, reject) => { reject('p5 reject!'); }); Promise.all([p1, p2, p3, p4, p5]).then(values => { console.log(values); }, reason => { console.log(reason) }); VM425:20 p4 reject!
4 promise.race race有赛跑之译,因此返回的新实例状态,是跟随参数中最先改变状态的那个实例;如果不是Promise实例,依旧先用Promise.resolve方法,转化后再进一步处理。 如果传的迭代为空,则返回的 Promise 永远等待
var p1 = new Promise((resolve, reject) => { setTimeout(resolve, 1000, 'one'); }); var p2 = new Promise((resolve, reject) => { setTimeout(resolve, 2000, 'two'); }); var p3 = new Promise((resolve, reject) => { setTimeout(resolve, 3000, 'three'); }); Promise.race([p1, p2, p3]).then(values => { console.log(values); }, reason => { console.log(reason) }); Promise {<pending>} VM446:12 one
2.async和await 1基本概念https://www.haorooms.com/post/es67application
简单的停顿执行
var sleep = function (time) { return new Promise(function (resolve, reject) { setTimeout(function () { resolve(); }, time); })}; var start = async function () { console.log('start'); await sleep(3000); console.log('end');}; start();
获得返回值
var sleep = function (time) { return new Promise(function (resolve, reject) { setTimeout(function () { // 返回 ‘ok’ resolve('ok'); }, time); })}; var start = async function () { let result = await sleep(3000); console.log(result); // 收到 ‘ok’}; start()
捕捉错误
var sleep = function (time) { return new Promise(function (resolve, reject) { setTimeout(function () { // 模拟出错了,返回 ‘error’ reject('error'); }, time); })}; var start = async function () { try { console.log('start'); await sleep(3000); // 这里得到了一个返回错误 // 所以以下代码不会被执行了 console.log('end'); } catch (err) { console.log(err); // 这里捕捉到错误 `error` }}; start()