Promise's understanding and its instance method

Is a programming solution
Three states ：pending（ Have in hand ）,fulfilled（ Have succeeded ）、rejected（ Failed ）

characteristic ： The state is not affected by the outside world , Only results of asynchronous operations , Decide which state it is currently
Once the state changes, it will not change again （pending–>fufilled,pending–>rejected）

usage ：

promise It's a constructor , Used to generate promise example
promise Constructor takes a function as an argument , This function has two arguments
resolve： take promise The state of the object never completes and becomes successful
reject： take promise The state of the object never completes to fail

        const p=new Promise(function(resolve,reject){
    
            resolve()// Return the result of asynchronous operation , Passed as a parameter 
            reject()// Return the result of asynchronous operation , Passed as a parameter 
        })

promise Instance object of

then： When the instance state changes , It's a new promise example , That is to say promise The reason for chain writing

catch： Used to specify the callback function where the error occurred , Let's pass catch replace then The second parameter in

finally： Used to specify whether promise What is the final state of the object , Will perform the operation

        const p=new Promise(function(resolve,reject){
    
            setTimeout(() => {
    
                const time=new Date().getTime()
                if(time%2==0){
    
                    resolve(' Success data ,time'+time)
                }else{
    
                    reject(' Failed data ,time'+time)
                }
            },1000);
        })
        //then
        p.then((value)=>{
    
            console.log(value)
        },(reason)=>{
    
            console.log(reason)
        })
        //catch
        p.then((value)=>{
    
            console.log(value);
        }).catch((reason)=> {
    
            console.log(reason);
        })
        //finally
        p.finally(()=>{
    
            console.log(' result ');// Failure will result in an error , Success returns directly to 
        })

What is callback hell , And how to use promise Solve callback hell ,then

        function getData(){
    
            return new Promise((resolve,reject)=>{
    
                setTimeout(() => {
    
                    console.log(1);
                    resolve(2)
                }, 1000);
            })
        }
        getData().then((value)=>{
    
            return new Promise((resolve, reject) => {
    
                setTimeout(() => {
    
                    console.log(value);
                    resolve(3)
                }, 2000);
            })
        }).then((value)=>{
    
            return new Promise((resolve, reject) => {
    
                setTimeout(() => {
    
                    console.log(value);
                }, 3000);
            })
        })

promise.all

Used to transfer multiple promise example , Pack it as a promise example

promise.all（） Parameters can not be arrays , But it must be iterator Interface

pAll The state of , from p1、p2、p3 To decide , Only when these three are successful ,pAll For success
But as long as there is one failure , Then it's failure , At this time, the return value of the first failed instance , Will pass to pAll Callback function for

If as an instance of a parameter , I've defined myself catch Method , So once it rejected, It won't touch pAll Of catch Method

        let p1 = new Promise((resolve, reject) => {
    
            resolve(' success 01');
        })
        let p2 = new Promise((resolve, reject) => {
    
            reject(' Failure 02 The data of ');
        }).catch((reason)=>{
    
            console.log(' Failure ');
        })
        let p3 = new Promise((resolve, reject) => {
    
            resolve(' success 02');
        })
        let pAll=Promise.all([p1,p2,p3])
        console.log(pAll);
        pAll.then((value)=>{
    
            console.log(value);
        }).catch((reason)=>{
    
            console.log(reason);
        })

The results of multiple requests are merged

function getBannerList() {
    
            return new Promise((resolve, reject) => {
    
                setTimeout(() => {
    
                    resolve(' Data of the rotation chart ')
                }, 1000);
            })
        }
        function getMusicList() {
    
            return new Promise((resolve, reject) => {
    
                setTimeout(() => {
    
                    resolve(' Music data ')
                }, 2000);
            })
        }
        function getCateList() {
    
            return new Promise((resolve, reject) => {
    
                setTimeout(() => {
    
                    resolve(' Song list classification data ')
                }, 3000);
            })
        }
        function initLoad(){
    
            let All=Promise.all([getBannerList(),getMusicList(),getCateList()])
            // console.log(All);
            All.then((value)=>{
    
                console.log(value);
            })
        }
        initLoad()