至从ES6(ES2015)正式规范之后,Promise收到高度重视,一直没时间小结一波,今儿抽空整理下好东西Promise!
基本所有浏览器都支持Promise,所以放心大胆使用!
首先,控制台先打印下Promise是什么东西,如下图所示:
Promise其实是一个构造函数,里面包含了很多行为方法(race,reject,resolve等),在prototype原型上then、catch等回调方法!
使用场景类似APAB前台Model操作交互:
var oModel = new sap.ui.model.odata.ODataModel(
"/sap/opu/odata/SAP/ZGS_ZICERP_F4_SRV/", {
json : true,
loadMetadataAsync : true
});
oModel.attachMetadataLoaded(function(e){
var path = "/Help_ECUserSet('1')"
oModel.read( path,
{
sPath : path,
context : this,
success : function(oData,response) {
abc(oData);
},
error : function(oError) {
ZICERP_F4.js.publicFunction.onError(oError);
},
async : true
});
},this);
Model的异步请求交互之后有success和error两个回调,执行成功之后走success,失败error。业内有句话:“程序员是上帝,给业务流程指定了人生轨迹”,个人觉得恰到好处!
由于Javascript执行是单线程的,那么复杂的业务场景中就不无避免会遇到回调。Promise就是适用于回调的业务场景之中,虽然我们可以借助非它进行回调,弊端在于多层回调的时候,代码会变得非常冗余。
Promise的链式调用(函数的执行依赖于上一个函数执行结果)的方式来执行回调函数给予了我们很大便利,上代码:
new Promise(function(resolve, reject) {//等待(pending)、已完成(fulfilled)、已拒绝(rejected)
resolve(10);//new一个Promise对象
})
.then(function(num) { console.log('第一个:', num); return num * 2; })
.then(function(num) { console.log('第二个:', num); return num * 2; })
.then(function(num) { console.log('第三个: ',num);})
.catch(function(){});
执行结果:
更多的应用场景是包在一个具体的执行函数中实例化一个Promise对象,针对函数运行结果进行规划then函数走向:
function f1(){
try{
var p=new Promise(function(resolve,reject){
var num = Math.round(Math.random()*10);//取0到10的随机整数
if(num <= 5){
//指定resolve状态
resolve(num);
}else{
//指定reject状态
reject(num);
}
});
return p;
}catch(err){
console.log(err.message);
}
}
f1().then(function(data){
//resolve
console.log(data + ":为resolve")
},function(res,data){
//reject
console.log(res + ": 数值大于5为reject")
});
执行结果:
程序指定生成的随机整数大于5的时候指定promise状态为reject,小于5的时候为resolve状态;当然多层次的回调继续在f1().then().then().then().............;
Promise的内容就这些吗?当然不是啦,这么牜的东西肯定还有很多内容的,race、finally、all、catch以及前端工程师都玩过的Jquery里Promise等等,这些在实际项目中还未玩过,所以笔记后面继续完善!不用不知道,一用就知道!水平有限,欢迎交流指正~~~~最后祝:工作顺利