Promise和async以及await

2020-12-01 22:00:44 阅读：178 来源： 互联网

标签：console log 神剑 await Promise result async

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异步编程目前的终级解决方案

标签：console,log,神剑,await,Promise,result,async
来源： https://blog.csdn.net/TXW6666/article/details/110453635

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9