由于js代码都是单线程执行的导致所有的网络操作、浏览器时间,都必须是异步执行,以前的话异步执行可以用回调函数实现 callback,随着promise的诞生,对异步处理有了更好的实现方式,promise的用法如下:
function getImage(src){ return new Promise(function(res,rej){ let Img=new Image(); Img.onload=function(){ res(img) } Img.onerror=function(){ rej('图片加载失败') } img.src=src; }) getImage('a.jpg').then(function(img){ console.log(img) },function(error){ console.log(error); } })
除了串行执行若干异步任务外,Promise还可以并行执行异步任务。
试想一个页面聊天系统,我们需要从两个不同的URL分别获得用户的个人信息和好友列表,这两个任务是可以并行执行的,用Promise.all()
实现如下:
var p1 = new Promise(function (resolve, reject) { setTimeout(resolve, 500, 'P1'); }); var p2 = new Promise(function (resolve, reject) { setTimeout(resolve, 600, 'P2'); }); // 同时执行p1和p2,并在它们都完成后执行then: Promise.all([p1, p2]).then(function (results) { console.log(results); // 获得一个Array: ['P1', 'P2'] });
有些时候,多个异步任务是为了容错。比如,同时向两个URL读取用户的个人信息,只需要获得先返回的结果即可。这种情况下,用Promise.race()
实现
var p1 = new Promise(function (resolve, reject) { setTimeout(resolve, 500, 'P1'); }); var p2 = new Promise(function (resolve, reject) { setTimeout(resolve, 600, 'P2'); }); Promise.race([p1, p2]).then(function (result) { console.log(result); // 'P1' });
由于p1执行较快,promise的then()将获得结果'p1',p2仍在继续运行,