The difference between async await promise

The difference between async await primise

• async/await: is a solution to asynchronous problems using synchronous thinking

1. async/await is a new feature of ES7

2. async/await is a new way of writing asynchronous code. Previous methods include callback functions and Promise

3. async/await is implemented based on Promise and cannot be used for ordinary callback functions.

4. async/await, like Promise, is non-blocking

5. async/await makes asynchronous code look like synchronous code and solves the problem of synchronization of asynchronous code

The return value of the function defined by async is a Promise object. In other words, async itself is a syntactic sugar, and the syntactic sugar represents keywords with certain functions. Therefore, the async function can be regarded as multiple asynchronous operations, packaged into A Promise object, and the await command is the syntactic sugar of the internal then command.

async function

The function of async function: Create and return a promise object:

        async function foo (p){
    
    
            console.log('foo run',p);
            return 1
        }
        var res = foo(1);
        console.log(res); //Promise { <state>: "fulfilled", <value>: 1 }
						  //<state>: "fulfilled"
						  //<value>: 1

From the above code, we can see that foo created by async is actually a promise object. The result of the Promise returned by the async function is determined by the result of the function execution. There are several ways to pass the async return value:

//1.async函数的 return
        async function foo (p){
    
    
            return p
        }
        var res = foo(1);
        res.then((m)=>{
    
    
            console.log(m); //1
        })
//2: new promise中 resolve实参
        async function foo(){
    
    
            return new Promise((reslove,reject)=>{
    
    
                    reslove(112)
            })
        }
        foo().then((m)=>{
    
    
            console.log(m); //112
        })
//3: then 中return  (catch finally 中retrun)
        async function foo(){
    
    
            return foo1().then((m)=>{
    
    
                return m
            })
        }
        async function foo1(){
    
    
            return 2
        }
        foo().then((n)=>{
    
    
            console.log(n); //2
        })
//4: Promise.resolve() 实参  Promise.reject() 实参
        async function foo(){
    
    
            return Promise.resolve(12)
        }

        foo().then((m)=>{
    
    
            console.log(m);//12
        })

await function

** The expression on the right side of await is usually a promise object, but it can also be other values ​​**

1. If the expression is a promise object, await returns the value of the promise success
2. If the expression is another value, use this value directly as the return value of await
3. The await function must be written within the async function

async function f() {
    
    
  // 等同于
  // return 123;
  return await 123;
}

f().then(v => console.log(v))
// 123

function foo(m){
    
    
    return new Promise((reslove,reject)=>{
    
    
         setTimeout(reslove,m)
     })
   }
async function foo1(){
    
    
      for(let i = 1 ; i<5 ; i++){
    
    
          console.log(i); //1,2,3,4每隔1s执行一次
         await foo(1000)
      }
}
foo1()

Promise

It is a built-in object in ES6, actually a constructor, and a new solution for asynchronous programming in JS.
You can read another article by the author

promises in es6

the difference

1. Promise is ES6 and async is ES7
2. Using async functions can make the code much simpler. There is no need for then like Promise, there is no need to write anonymous functions to handle the resolve value of Promise, there is no need to define redundant data variables, and nested code is avoided.
3. You cannot customize the use of try/catch for error capture in Promise, but in Async/await you can handle errors like synchronous code. In short, Async/await better solves the problem of asynchronous code synchronization.
4. Promise has many parallel artifacts, such as Promise.all\Promise.race, etc. These are things that async cannot handle