Promise
Promise是什么 ?为什么有Promise?Promise是做什么的?
Promise是什么 ?
我们先在控制台输出console.dir(Promise)看看Promise 是什么
由上可以清楚的知道Promise其实是一个构造函数, 自己身上有all、reject、resolve这些方法,原型上有then、catch这些方法。这么说用Promise new出来的对象肯定就有then、catch方法。
为什么有Promise?Promise有什么用?
为什么有Promise?
因为异步之间存在联系的 是某个异步操作要等待别的操作对他的结果,这种联系的处理,会让代码的复杂度急剧增加因此形成回调地狱,而Promise可以帮助我们避免回调地狱,让异步变得更简单,变更可控。是ES官方参考了大量的异步场景,总结出了一套异步通用的模型,这套模型可以覆盖几乎所有的异步场景。
Promise有什么用? 让回调变得更简单,更可控
下面我门看一个例子.
比如:强化一个装备 当强化成功是是停止强化,强化失败就一直强化
function strengthen(equipment,callback){
console.log(`开始强化{nvsheng}`);
setTimeout( ()=>{
if(Math.random() < 0.3 ){
callback(true)
}else{
callback(false)
}
},1500)
}
strengthen('传世龙神剑',function(result){
if (result) {
console.log('第一次强化传世龙神剑成功了')
}else{
console.log('第一次强化传世龙神剑失败了');
strengthen("传世龙神剑",function(result){
console.log(result)
if(result){
console.log("第二次强化传世龙神剑成功了")
}else{
console.log('第二次强化传世龙神剑失败了')
strengthen("传世龙神剑",function(result){
console.log(result)
if(result){
console.log("第三次强化传世龙神剑成功了")
}else{
console.log('第三次强化传世龙神剑失败了')
strengthen("传世龙神剑",function(result){
console.log(result)
if(result){
console.log("第四次次强化传世龙神剑成功了")
}else{
console.log('第四次强化传世龙神剑失败了')
}
})
}
})
}
})
}
})
上面的这中写法看上去就很复杂,如果四次强化失败肯定还是要继续的。但是太多了就不写那个多写几个意思一下吧
这里简单说一下Promise 的三种状态:
pending:进行中
resolved:已经成功
rejected 已经失败
状态改变:
Promise对象的状态改变,只有两种可能:
从pending变为resolved
从pending变为rejected。
这两种情况只要发生,不会再变了
function strengthen(equipment,callback){
return new Promise(resolve => {
console.log(`开始强化${equipment}`);
setTimeout( ()=>{
if(Math.random() < 0.5 ){
resolve(true)
}else{
resolve(false)
}
},1500)
})
}
for(let i = 1;i <=20;i++){//假如强化20次
if(i == 1){
pro = strengthen("传世龙神剑")
}
pro = pro.then(result => {
if(result === undefined){
return
}else if(result){
console.log(`第${i}次强化传世龙神剑成功了`)
}else{
console.log(`第${i}次强化传世龙神剑失败`)
if(i <= 20 ){
return strengthen("传世龙神剑")
}
}
})
}
这种和上面的效果是不是一样的,但是明显比上面更加简单的清新的很多.所以说让回调变得更简单,变更可控
Promise 对象的状态不受外界影响
async以及await
async以及await是什么?
async以及await是ES7中的标准,是为优化Promise而开发出来的 可以说async/await是异步编程终级解决方案
async 是一个修饰符,async 被修饰的函数会默认的返回一个Promise对像
因此对async函数可以直接进行then操作,返回的值即为then方法的传入函数。
await 也是一个修饰符,但是必须放在 async 函数内部使用, await关键字的作用 就是获取 Promise中返回的内容,resolve或者reject的值。
async命令
简化promise创建的 声明一异步任务(async function 对象)
async function fun() {
return 1;
}
const pro = fun();
console.log(pro)
//等同于
const pro = new Promise((resolve,reject) => {
resolve(1);
})
多种创建方式
// 函数声明
async function foo() {}
// 函数表达式
const foo = async function () {};
// 对象的方法
let obj = { async foo() {} };
await 命令
等待 等待一个异步任务执行完成的结果
正常情况下,await命令后面是一个 Promise 对象。如果不是,会被转成一个立即resolve的 Promise 对象。
async function f() {
return await 123;
}
f().then(v => console.log(v))
上面代码中,await命令的参数是数值123,它被转成 Promise 对象,并立即resolve
Promise和async以及await的联系
总结
Promise可以避免异步种的回调地狱 使异步变得更加简单清新,更可控
async以及awai却是为了简化Promise,可以说async以及awai是JavaScript异步编程目前的终级解决方案