Promise的封装

在JavaScript的世界中,所有代码都是单线程执行的。

由于这个“缺陷”,导致JavaScript的所有网络操作,浏览器事件,都必须是异步执行。异步执行可以用回调函数实现:

Promise对象代表一个异步操作,有三种状态:

pending 进行中

fulfilled 已成功

rejected 已失败

对象的状态不受外界影响,一旦状态改变,就不会再变

Promise对象的状态改变,只有两种可能:

pending => fulfilled

pending => rejected

---------------------

function getAjax(type, url, data) {

return new Promise(function(resolve, reject) {

var xhr = null

if (window.XMLHttpRequest) {

xhr = new XMLHttpRequest();

} else {

xhr = new ActiveXObject("Microsoft.XMLHTTP");

}

xhr.open(type, url, true);

xhr.onreadystatechange = function() {

if (xhr.readyState == 4 && xhr.status == 200) {

resolve(JSON.parse(xhr.responseText));

} else {

reject(xhr)

}

}

if (type == 'GET') {

xhr.send()

} else {

xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");

xhr.send(formatParams(data));

}

})

function formatParams(data) {

var arr = [];

for (var name in data) {

arr.push(name + '=' + data[name]);

}

return arr.join("&");

}

}

请求完成后,可以用.then来执行成功后的回调函数

用.catch来执行失败后的回调函数



Promise.all([p1, p2]).then(function(results){console.log(results);// 获得一个Array: ['P1', 'P2']});

varp1 =newPromise(function(resolve, reject){setTimeout(resolve,500,'P1');});

varp2 =newPromise(function(resolve, reject){setTimeout(resolve,600,'P2');});

Promise.race([p1, p2]).then(function(result){console.log(result);// 'P1'});

如上,当需要多个异步都执行完毕以后执行可以用.all.then的回调函数执行

当需要其中的一个异步操作执行完毕以后就可以,可以用.race

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Promise 对象 Promise 的含义 Promise 是异步编程的一种解决方案,比传统的解决方案——回调函...
    neromous阅读 8,731评论 1 56
  • 一、Promise的含义 Promise在JavaScript语言中早有实现,ES6将其写进了语言标准,统一了用法...
    Alex灌汤猫阅读 841评论 0 2
  • 本文适用的读者 本文写给有一定Promise使用经验的人,如果你还没有使用过Promise,这篇文章可能不适合你,...
    HZ充电大喵阅读 7,341评论 6 19
  • 排版很不友好,抱歉 /* * 实现Promise是根据Promise规范来的:https://promisesap...
    Egde阅读 1,510评论 0 0
  • 前言 本文旨在简单讲解一下javascript中的Promise对象的概念,特性与简单的使用方法。并在文末会附上一...
    _暮雨清秋_阅读 2,246评论 0 3