promise原理及使用方法
2024-08-27 19:35:56
Promise 的含义
所谓Promise ,简单说就是一个容器,里面保存着某个未来才回结束的事件(通常是一个异步操作)的结果。从语法上说,Promise是一个对象,从它可以获取异步操作的消息。 resolve 其实就是 返回异步操作的数据
/*
* resolve函数的作用是,将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),
* 在异步操作成功时调用,并将异步操作的结果,作为参数传递出去;
* reject函数的作用是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected),在异步操作失败时调用,并将异步操作报出的错误,
* 作为参数传递出去。
*/
// promise 结构
new Promise((resolve, reject)=>{
$.ajax({
url : 'http://happymmall.com/user/get_user_info.do',
type: 'post',
success(res){
resolve(res);
},
error(err){
reject(err);
}
});
}).then((res)=>{
console.log('success:', res);
},(err) => {
console.log('error:', err);
});
链式promise
var promiseFn1 = new Promise((resolve, reject)=>{
$.ajax({
url : 'http://happymmall.com/user/get_user_info.do',
type: 'post',
success(res){
resolve(res);
},
error(err){
reject(err);
}
});
}); var promiseFn2 = new Promise((resolve, reject)=>{
$.ajax({
url : 'http://happymmall.com/cart/get_cart_product_count.do',
type: 'post',
success(res){
resolve(res);
},
error(err){
reject(err);
}
});
}); promiseFn1.then(()=>{
console.log('promiseFn1 success');
return promiseFn2;
}).then(()=>{
console.log('promiseFn2 success');
});
下面是一个用Promise对象实现的 Ajax 操作的例子。
const getJSON = function(url) {
const promise = new Promise(function(resolve, reject){
const handler = function() {
if (this.readyState !== ) {
return;
}
if (this.status === ) {
resolve(this.response);
} else {
reject(new Error(this.statusText));
}
};
const client = new XMLHttpRequest();
client.open("GET", url);
client.onreadystatechange = handler;
client.responseType = "json";
client.setRequestHeader("Accept", "application/json");
client.send(); }); return promise;
}; getJSON("/posts.json").then(function(json) {
console.log('Contents: ' + json);
}, function(error) {
console.error('出错了', error);
});
最新文章
- SVN“验证位置时发生错误”的解决办法
- VBA实例收集
- VS2010/VS2013中ashx代码折叠的问题
- Quartz.net 定式调度任务
- iOS开发之多线程技术
- nginx的那些内置变量
- 读javascript高级程序设计11-事件
- RT-Thread多线程导致的临界区问题
- 【C++】智能指针
- MongoDB C#驱动中Query几个方法 (转)
- emWin(ucGui)的Edit控件退格处理方法 worldsing
- C# 微信支付证书使用
- launch genymotion simulator from command line
- 简单登录案例(SharedPreferences存储账户信息)&;联网请求图片并下载到SD卡(文件外部存储)
- 从Quartz时间设置问题说起
- python机器学习实战(三)
- DOMContentLoaded、readystatechange、load、ready详谈
- 玩转GET 和 POST
- windows下手动安装composer并配置环境变量
- get通配符