Asynchronous learning

(1)promise
1： Realization principle
It is mainly realized through callback function , The callback function is encapsulated inside , adopt then Method chain call , Show asynchronous code in the form of synchronization .
2:promise Characteristics
There are only three states ： wait for , success , Failure
The state can only be changed once
3：promise The shortcomings of
Once executed, it cannot be cancelled , If an error occurs, it should be caught through the callback function
4：promis Constructor calls and promise The difference between chain calls
The call to the constructor is executed immediately

new Promise((resolve, reject) => {
    
  console.log('new Promise')
  resolve('success')
})
console.log('finifsh')
// new Promise -> finifsh

Promise Implementation of the chain call , That is to say, every call then After that, all the people who returned were Promise, And it's a brand new Promise, The reason is that the state is immutable . If you are in the then in Used return, that return The value of will be Promise.resolve()` packing

Promise.resolve(1)
  .then(res => {
    
    console.log(res) // => 1
    return 2 //  Package as  Promise.resolve(2)
  })
  .then(res => {
    
    console.log(res) // => 2
  })

5：promise The implementation of the

function myPromise(excus)
{
    
    let that=this;
    // Record the current state 
    that.state="pending";
    // The value of success 
    that.value=null;
    // The reason for the failure 
    that.rean=null;
    // The staging area is used to solve asynchronous tasks 
    that.resolvedCallbacks = [];
    that.rejectedCallbacks = [];
  

    // Change the state of success 
    function resovle(value)
    {
    
        if(that.state=='pending')
        {
    
            that.state="Resolve";
            that.value=value;
            that.resolvedCallbacks.forEach(item=>{
    
                item(value);
            })

        }
    }
    // Change the state of failure 
    function reject(value)
    {
    
        if(that.state=='pending')
        {
    
            that.state='Reject';
            that.rean=value;
            that.rejectedCallbacks.forEach(item=>{
    
                item(rean);
            })
        }
    }
    
    // Execute now 
    excus(resovle,reject);
}
//then
myPromise.prototype.then=function(resovle,reject){
    
    
    // Resolve asynchronous calls 
    that=this;
    resovle =typeof resovle ==='function'?resovle:function(data){
    
        return data;
    }
    reject =typeof reject ==='function'?reject:function(err){
    
        throw err;
    }
    
   
    if(that.state=='pending')
    {
    
        that.resolvedCallbacks.push(resovle);
        that.rejectedCallbacks.push(reject);
    }
    return new myPromise((onfullfilled,Onreject)=>{
    
        if(that.state==='Resolve')
        {
    
            try{
    
            x=onfullfilled(that.value);
            console.log(x);
            resovle(x);
            }catch(e){
    
             reject(e);
            }
        }
    })

}

var p=new myPromise((resovle,reject)=>{
    
  setTimeout(() => {
    
    resovle('123');  
  }, 1000);
});
p.then((result) => {
    
   console.log(result);
},(err) => {
    
    console.log(err);
});

//promise Implement asynchronous publisher subscription mode 

6：promiseall The implementation of the

function promiseAll(Promises)
{
    
   return new Promise(function(resolve,reject){
    
     if(!Array.isArray(Promises))
     {
    
         return reject(new TypeError("argument"));
     }
     var countNum=0;
     var promiseNum=Promises.length;
     var resolvedvalue=new Array(promiseNum);
     for(let i=0;i<promiseNum;i++)
    {
    
        Promise.resolve(Promises[i]).then(function(value){
    
            countNum++;
            resolvedvalue[i]=value;
            if(countNum===promiseNum)
            {
    
                return resolve(resolvedvalue);
            }
        },function(reason){
    
            return reject(reason);
        })
    }
   })
}

var p1=Promise.resolve(1),
    p2=Promise.resolve(2),
    p3=Promise.resolve(3);
 
 promiseAll([p1,p2,p3]).then(function(value){
    
 	console.log(value)
 
 })

(2)：async And await
1：async function
It will return one promise object , adopt promise.resolve() encapsulate
2：await and async Matching use of
advantage ： and promise Compare , Processed then Chain call of , More concise
shortcoming ： That is, without dependence , Will result in performance degradation . Use when there are no dependencies promise.all（） More efficient .
await Implementation principle of ：
Mainly promise The combination of grammar sugar and generator ,await Implemented through a generator , Save the information in the current stack , When executing asynchronous code, read the information in the stack and the returned promise Object combination

generator
When we instantiate a generator , Will return an iterator Iterator.
And then through yield/next Control the execution order of the code , When we execute yield The execution of code is suspended inside the generator function , The outside of the generator is still active , Internal resources are preserved , It's just a pause .
When we execute next When , The execution will start from the suspended position .

Why? next Than yield One more ？
Because when we instantiate the generator , The code is not executed immediately , To pass the next Start the generator , hinder yield and next Make a correspondence . therefore next than yield More than a .