Promise原理及使用方法

Promise

是一个异步函数的解决方案，主要是为了解决回调地狱的问题（函数里边调用函数，从而形成多层嵌套，导致代码的可读性和维护性变差）；promise本身是一个函数，自身有resolve ，reject ，all,三种方法；原型里边有then（），catch（）两种方法

promise 有两个特点
（1）对象的状态不受外界影响。
Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。

（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。
Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。

1. resolve -->执行成功

const promiseClick =()=>{
        console.log('点击方法被调用')
        let p = new Promise(function(resolve, reject){
            //做一些异步操作
            setTimeout(function(){
                    console.log('执行完成Promise');
                    resolve('要返回的数据可以任何数据例如接口返回数据');
                }, 2000);
            });
            return p
        }
    
        promiseClick()
        .then((data)=>{
            console.log(data,1)
            return data
        })
        .then((data)=>{
            console.log(data,2)
            return data
        })
        .then((data)=>{
            console.log(data,3)
        })

注意两点

第一，声明一个promise的对象，里边的异步方法也会执行，所以一般会把promise对象放在一个函数当中，这样当我们调用函数的时候才会执行promise对象里边的异步函数
第二，在执行成功之后要在 最外层的函数里边返回这个promise对象，然后再后边的.then()的函数里边也要返回这个之前使用过的data，这样后边所有的then都能够使用这个data了。

2.reject —>执行失败

reject是执行失败后的情况，执行失败就更改promise里边的状态值 pending 为 rrejected

       function promiseClick(){
		let p = new Promise(function(resolve, reject){
			setTimeout(function(){
				var num = Math.ceil(Math.random()*20); //生成1-10的随机数
				console.log('随机数生成的值：',num)
				if(num<=10){
					resolve(num);
				}
				else{
					reject('数字太于10了即将执行失败回调');
				}
			}, 2000);
		   })
		   return p
	   }
 
	promiseClick().then(
		function(data){
			console.log('resolved成功回调');
			console.log('成功回调接受的值：',data);
		}, 
		function(data){
			console.log('rejected失败回调');
			console.log('失败执行回调抛出失败原因：',data);
		}
	);

then 和 catch

关于then 和catch这两个函数，then里边可以写两个函数作为参数，第一个参数表示执行成功的回调，第二个参数表示执行失败的回调；但是如果在then里边不写第二个参数的话，那么直接在then后边使用catch 也是表示执行promise里边reject的方法；

同时如果then里边的第一个参数出现了异常，那么这个函数并不会直接卡死，而是会直接执行后边的catch的方法。

promiseClick().then(
		function(data){
			console.log('resolved成功回调');
			console.log('成功回调接受的值：',data);
			console.log(noData);
		}
	)
	.catch(function(reason, data){
		console.log('catch到rejected失败回调');
		console.log('catch失败执行回调抛出失败原因：',reason);
	});

all的用法

与then同级的另一个方法，all方法，该方法提供了并行执行异步操作的能力，并且在所有异步操作执行完后并且执行结果都是成功的时候才执行回调

race的用法

all是等所有的异步操作都执行完了再执行then方法，那么race方法就是相反的，谁先执行完成就先执行回调。先执行完的不管是进行了race的成功回调还是失败回调，其余的将不会再进入race的任何回调。