The difference between asyncawait and promise

async

async Function definition

async Functions are functions declared with keywords .async yes “ asynchronous ” Abbreviation , So it should be easy to understand async Used to state a function It's asynchronous .

effect

For resolution ： Generated by asynchronous program bug

####async Syntax of functions

async function name([param[, param[, ... param]]]) {
    statements 
}

Parameters ：name The name of the function

param The name of the parameter to be passed to the function

statements An expression that contains the body of a function , have access to await

Return value ： A brand new promise, This promise Or it will pass a test by async The value returned by the function is resolved , Or it will pass through a from async Thrown in a function （ Or not captured in it ） Exception rejected

The following is async The concrete use example of ：

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

async Function must return a promise object . If one async The return value of the function does not appear to be promise, Then it will be implicitly packaged in a promise in .

for example , The following code :

async function foo() {
     //promise.[[promiseValue]] 
   return 1
}
// Equivalent to 
function foo() {
   return Promise.resolve(1)
}//{<fulfilled>: 1}

The following is true. async Some supplements to ：

• async Itself is a grammar sugar —> Grammatical sugar ： Keywords with certain functions

  • Grammatical sugar The role of ： can Reduce the amount of code 、 Increase the readability of the program , So as to reduce the chance of program code error

async Function return How to accept

Mode one

adopt promise.then-cb Formal parameter acquisition

 async function foo(){
            console.log(222222);
            return 123;
        }
let res = foo();
 res.then(data=>{
            console.log(data);//123
        })

Mode two

The second way to accept the return value of a function is await

  (async function (){
           console.log('async run');
           // The second way to accept the return value of a function is  await
           let res = await foo();
           console.log(res);
       })()
 async function foo(){
           console.log('foo run');
           return 123;  
       }
 //res effect ： Accept  async foo Function return value   yes promise
let res = foo();

await

await Definition

await It means waiting , So it should be easy to understand ,await Wait for an operation to complete .

effect

await The role of keywords Just get take Promise Content returned in , What you get is Promise Function resolve perhaps reject Value （await The function is to get promise.[[promiseValue]] Value ）

About await Points for attention

• await Must be written in async in

• await And then there's a promise Instance object

[[promiseValue]]

[[PromiseValue]] Is an internal variable , There is no outside access to , Only in then In order to get .

[promiseValue] Which can be assigned

• async Functional return
• new promise in resolve Actual parameters
• then in return （catch finally Medium return）
• promise.reslove() Actual parameters promise.reject() Actual parameters

Differences among the three

• promise and async/await Are a way to solve asynchronous programming , however async/await Make asynchronous code look like synchronous code .
• There is one more in front of the function async keyword .await Keywords can only be used for async Within the function defined .async The function returns one implicitly Promise, The promise Of resolve The value is return Value .

Why? async/await Better ？

Use async Functions can make code much simpler , No need to be like Promise Just as much then, There is no need to write anonymous functions to handle Promise Of resolve Value , There's no need to define redundant data Variable , It also avoids nested code .

async/await Give Way try/catch Can handle synchronous and asynchronous errors at the same time . In the following example ,try/catch Can't handle JSON.parse Error of , Because it is in Promise in , We need to use .catch, Such errors will make the code very redundant .