Async / await: 6 reasons to forget about promises

If you do not know, in Node.js, starting from version 7.6, support for the async / await mechanism is built in. They talk about it, of course, for a long time, but it’s one thing when “crutches” are needed to use some functionality, and quite another when it all goes, as they say, “out of the box.” If you have not tried async / await yet, be sure to try.

Today we will look at the six features of async / await, which make it possible to assign a new approach to writing asynchronous code to the category of tools that you should learn and use wherever possible, replacing what was before with them.

Basics of async / await

For those who are not familiar with async / await, here are the basic things that will be useful to know before moving on.

Async / await is a new way to write asynchronous code. Previously, a similar code was written using callbacks and promises.
')
Our proposal to “forget about promises” does not mean that they have lost their relevance in the light of new technology. In fact, async / await is based on promises. It should be borne in mind that this mechanism cannot be used with callbacks.
Constructions built using async / await, like promises, do not block the main thread of program execution.
Thanks to async / await, the asynchronous code becomes similar to synchronous, and in its behavior features of such code appear, which are very useful in some situations in which it was, for various reasons, inconvenient to use promises. But earlier it was impossible to do without them. Now everything has changed. This is where the power of async / await lies.

Syntax

, getJSON, , JSON-. , JSON- done.

:

const makeRequest = () =>
  getJSON()
    .then(data => {
      console.log(data)
      return "done"
    })

makeRequest()

async/await:

const makeRequest = async () => {
  console.log(await getJSON())
  return "done"
}

makeRequest()

, :

async. await , async. , , , , return, done.

, await async-, .

//         
// await makeRequest()

//   - 
makeRequest().then((result) => {
  // do something
})

await getJSON() , console.log getJSON(), , .

async/await ?

async/await .

▍1.

, , , async/await, . , , , , . , .then, , data, , , . , . , .

▍2.

async/await — try/catch. try/catch , JSON.parse, . .catch() . console.log .

const makeRequest = () => {
  try {
    getJSON()
      .then(result => {
        //  JSON   
        const data = JSON.parse(result)
        console.log(data)
      })
      //       
      // .catch((err) => {
      //   console.log(err)
      // })
  } catch (err) {
    console.log(err)
  }

, async/await. catch , JSON.

const makeRequest = async () => {
  try {
    //  JSON   
    const data = JSON.parse(await getJSON())
    console.log(data)
  } catch (err) {
    console.log(err)
  }
}

▍3.

, , , , , , , , , -. :

const makeRequest = () => {
  return getJSON()
    .then(data => {
      if (data.needsAnotherRequest) {
        return makeAnotherRequest(data)
          .then(moreData => {
            console.log(moreData)
            return moreData
          })
      } else {
        console.log(data)
        return data
      }
    })
}

. ( 6 ), , , , .

, async/await.

const makeRequest = async () => {
  const data = await getJSON()
  if (data.needsAnotherRequest) {
    const moreData = await makeAnotherRequest(data);
    console.log(moreData)
    return moreData
  } else {
    console.log(data)
    return data    
  }
}

▍4.

, , promise1, , , promise2, promise3. , .

const makeRequest = () => {
  return promise1()
    .then(value1 => {
      // do something
      return promise2(value1)
        .then(value2 => {
          // do something          
          return promise3(value1, value2)
        })
    })
}

promise3 value1, , , . value1 value2 Promise.all .

const makeRequest = () => {
  return promise1()
    .then(value1 => {
      // do something
      return Promise.all([value1, promise2(value1)])
    })
    .then(([value1, value2]) => {
      // do something          
      return promise3(value1, value2)
    })
}

. , value1 value2 , .

async/await, , , , . , , - .

const makeRequest = async () => {
  const value1 = await promise1()
  const value2 = await promise2(value1)
  return promise3(value1, value2)
}

▍5.

, , - .

const makeRequest = () => {
  return callAPromise()
    .then(() => callAPromise())
    .then(() => callAPromise())
    .then(() => callAPromise())
    .then(() => callAPromise())
    .then(() => {
      throw new Error("oops");
    })
}

makeRequest()
  .catch(err => {
    console.log(err);
    // 
// Error: oops at callAPromise.then.then.then.then.then (index.js:8:13)

, , , . , . , — callAPromise, (, , — , , ).

async/await, , .

const makeRequest = async () => {
  await callAPromise()
  await callAPromise()
  await callAPromise()
  await callAPromise()
  await callAPromise()
  throw new Error("oops");
}

makeRequest()
  .catch(err => {
    console.log(err);
    // 
    // Error: oops at makeRequest (index.js:7:9)
  })

, , . , , -, -. , makeRequest, , , — then, then, - then…