Es6的promise和async

一、promise
promise将异步的操作以同步的流程表达出来
有三种状态：pending(进行中)  fulfied(已成功) rejected(已失败)
一旦状态改变就不会再变1.pending->fulfied  2.pending->rejected
解决层层巧嵌套的回调地狱

1.回调地狱,这个代码写的虽然没有问题，但是输出的时候我们本意是每1s输出一个1，然后在1后边0.5秒输出一次2，但是这段代码执行的时候是异步执行的，所以输出的时候会特别的乱，所谓回调地狱

setInterval(
  ()=>{ 
       console.log(1);
       setInterval(()=>{
       console.log(2)
             },500)
                 },1000
             )

2.Promise

我们用new方法新建一个Promise，其中的代码执行是同步的然后调用resolve()和reject（）函数,当执行成功的时候调用resolve,失败的时候调用reject函数；那么俩个函数在哪定义的呢，在后边.then中第一个箭头函数是reslove的方法，第二个函数是reject的方法。

        new Promise((resolve, reject) => {
             setTimeout(() => {
              console.log(1);
             //成功调用resolve
               resolve();
                 //失败调用reject
                 reject();
            }, 1000)
        }).then(() => {
           setTimeout(() => {
               console.log(2)
           }, 500)
       }
           , () => {
               console.log("请求失败");
           })
        //前边为成功执行的函数 后边为失败的函数

3.all和catch

all 所有都执行才会执行all 有失败就会走到catch,如下代码实例，当我们Promise都执行完成后会输出ok如果有一个执行的时候失败了，就会走到catch函数内

 
        let p1 = new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log(1);
                // resolve();
                reject();
            }, 1000)
        })
        let p2 = new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log(2);
                resolve();
            }, 800)
        })
        let p3 = new Promise((resolve, reject) => {
            setTimeout(() => {
                console.log(3);
                resolve();
            }, 2000)
        })
        Promise.all([p1, p2, p3]).then(
            () => {
                console.log("ok");
            }
        ).catch(() => {
            console.log("失败");
        })

4.race

当最快的代理执行了，那么就会执行race中的函数，注意的是，这里边有失败的也会算，也是去找最快的

     //race 先走到最快的执行race
               let p1 = new Promise((resolve, reject) => {
             setTimeout(() => {
                 console.log(1);
                 // resolve();
                 reject();
             }, 1000)
         })
         let p2 = new Promise((resolve, reject) => {
             setTimeout(() => {
                 console.log(2);
                 resolve();
             }, 800)
         })
         let p3 = new Promise((resolve, reject) => {
             setTimeout(() => {
                 console.log(3);
                 resolve();
             }, 2000)
         })
         Promise.race([p1, p2, p3]).then(
             () => {
                 console.log("ok");
             }
         ).catch(() => {
             console.log("失败");
         })
    </script>

上述面试提问总结：

1.请你解释一下什么是异步 什么是同步
2.请你说出你对promise得理解是把异步得方法 用同步得方案给解决掉了  （真正出现就是为了解决回调地狱得问题）
3.promise 当中一共有三个状态  padding (进行中) fulfied(成功)  rejected(失败状态下所执行)
4.all race (all等所有得都执行完 再执行all里面得then方法  但是只要有一个返回得状态为失败  catch)
5.race （永远是根据时间顺序来的  我只看第一个  第一个如果是成功 那么调用then方法 如果第一个失败 调用catch） 

二、async

1.    async await 
async规定必须返回得是promise对象，async用来定义异步函数
async定义了一个函数返回时是一个promise对象

await只能在async函数中用，在其他地方用会报错，作用是执行某个函数，等某个函数执行完了再往下走

	 <script>
		 async function first(){
			 return new Promise((resolve,reject)=>{
				 setTimeout(function(){
					
					 //模拟后台给我前端得数据
					 let res = {
						 message:'xiaohei'
					 }
					 resolve(res);
				 },1000);
				 
			 })
		 }
		 
		 async function second(msg){
			 return new Promise((resolve,reject)=>{
				 setTimeout(function(){
					
					 resolve();
				 },2000);
			 })
		 }
		 
		 async function error(){
			 return new Promise((resolve,reject)=>{
				 setTimeout(function(){
					
					 reject({message:'失败了'});
				 },2000);
			 })
		 }
		 
		 
		 //promise 是把异步得方法 用同步得方案给解决掉了
		 
		 async function fn(){
			 console.log(1); // 解构赋值
			 let {message} = await first();
			 console.log(message);
			 await second(message);
			 console.log(3);
			 await error().catch(function(res){
				 console.log(res)
			 })
		 }
		 
		 fn();

其中错误的时候用catch捕获，其中的参数为reject中的实参