1.什么是Promise?
是一种异步编程的解决方案,是一个对象,可以获取异步操作的消息。
2.作用?
- 将异步操作以同步的流程表达出来
- 解决回调地狱的问题(避免了层层嵌套的回调函数)
- 语法简洁,promise对象提供了简洁的API,使得控制异步操作更加容易
3.Promise的基本用法
- 使用new实例化一个promise对象,Promise的构造函数中传递一个参数.这个参数是一个函数,该函数用于处理异步任务
- 并且传入两个参数:resolve和reject 分别表示异步执行成功后的回调函数和异步执行失败后的回调函数
- 通过promise.then(),处理返回结果
举例代码如下:
const promise = new Promise(resolve, reject => {
//异步任务
});
//接口请求成功,返回结果
promise.then();
4.Promise的三个状态
pending:初始化状态(既不是成功,也不是失败状态)
fulfilled:操作成功
rejected:操作失败
下面通过一段代码来初始一下promise对象的用法
function queryData() {
//使用new实例化一个promise对象
const promise = new Promise((resolve, reject) => {
//异步任务
setTimeout(function () {
//接口返回的数据
var data = {retCode:0, msg: 'i am result'};
if (data.retCode == 0) {
//接口请求成功时调用
resolve(data);
} else {
//接口请求失败时调用
reject({retColde: -1, msg:'请求失败'});
}
}, 100);
});
return promise;
};
//第二步:业务层的接口调用
queryData()
.then((result) => {
// 从 resolve 获取正常结果
console.log('当接口请求成功时,调用这里');
console.log(result);
})
.catch(result=> {
// 从 reject 获取异常结果
console.log('当接口请求失败时,调用这里');
console.log(result);
})
.finally(() => {
console.log('无论接口请求成功与否,都会调用这里');
});
以上代码解释:
1.retCode:return code的缩写,请求一个http链接后,一般后端返回的数据中会根据条件包括一个状态码。
retCode为0 表示请求成功的时候
retCode为1 表示请求失败的时候
2.result:这里的result就是从resolve和reject传过来的,也就是从接口拿来的数据。
3.Promise常用的API方法:(用于实例)
- promise.then():获取异步任务的正常结果
- promise.catch():获取异步任务的异常结果
- promise.finally():获取任务无论成功与否 都会执行
ps.箭头函数扩展
传统写法:
function fn(a, b) {
return a + b;
}
箭头函数写法:
var fn = (a, b) => a + b;
若函数体内有两句及以上的话:
var fn = (a, b) => {
console.log('内容');
return a + b;
}
console.log(fn(1,2));
总结:
1.如果函数中有且只有一个参数的话,则可以省略()。
2.如果函数体内有且仅有一条语句,则可以省略{ },前提这条语句必须是return。
未完待续…
本人在学习前端的路上,欢迎各位大神指点…