ES6 필지 필회(8) - async 함수

4674 단어
async 함수
1. ES2017 표준은 async 함수를 도입했습니다. 이것은 Generator 함수에 대한 개선입니다. 먼저 파일을 읽는 예를 보겠습니다.
Generator 쓰기 방식은 다음과 같습니다.
var fs = require('fs');

var readFile = function (fileName) {
  return new Promise(function (resolve, reject) {
    fs.readFile(fileName, function(error, data) {
      if (error) return reject(error);
      resolve(data);
    });
  });
};

var gen = function* () {
  var f1 = yield readFile('/etc/fstab');
  var f2 = yield readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};

async 쓰기 방법은 다음과 같습니다.
var asyncReadFile = async function () {
  var f1 = await readFile('/etc/fstab');
  var f2 = await readFile('/etc/shells');
  console.log(f1.toString());
  console.log(f2.toString());
};

비교에 의하면 async 함수는Generator 함수의 별표(*)를 async로 바꾸고 yield를 await로 바꾸는 동시에 코모듈이 필요하지 않고 더욱 의미화된 것이다.
2. async 함수는 Promise 대상을 되돌려주고 내부return 문장이 되돌려주는 값은 then 방법으로 함수를 되돌려주는 매개 변수가 됩니다.
async function f() {
  return 'hello world';
}

f().then(res => console.log(res))
// "hello world"

3.async 함수가 되돌아오는 Promise 대상은 내부의 모든 await 명령 뒤에 있는 Promise 대상이 실행될 때까지 기다려야 상태가 바뀝니다. 리턴 문장이나 오류가 발생하지 않는 한.즉, async 함수 내부의 비동기 조작이 끝나야만 then 방법이 지정한 리셋 함수를 실행할 수 있다.
4. async 함수 내부에서 오류가 발생하면 되돌아오는 Promise 대상을reject 상태로 바꾸고 오류 대상은catch 방법의 리셋 함수에 수신됩니다.
async function f() {
  throw new Error(' ');
}

f().then(
  res => console.log(res),
  err => console.log(err)
)
// Error:  

5.await 명령 뒤에는 Promise 객체가 있습니다.그렇지 않으면 즉시 resolve의 Promise 객체로 바뀝니다.
async function f() {
  return await 'Hello World';
}

f().then(res => console.log(res))
// 'Hello World'

상기 코드에서 await 명령의 매개 변수는'Hello World'입니다. 이것은 Promise 대상으로 바뀌고 즉시resolved
6.await 명령 뒤에 있는 Promise 대상이 reject 상태로 변하면 reject의 매개 변수는catch 방법의 리셋 함수에 수신됩니다
async function f() {
  await Promise.reject(' ');
}

f().then(res => console.log(res))
   .catch(err => console.log(err))

//  

7.async 함수 중 하나의await 문장 뒤의Promise가reject로 바뀌면 전체 async 함수는 실행을 중단합니다.
async function f() {
  await Promise.reject(' ');
  await Promise.resolve('hello world'); //  
}

f();  //  

8. 만약 우리가 이전의 비동기 조작이 실패하더라도 뒤의 비동기 조작을 중단하지 않기를 원한다.그러면 저희가 첫 번째 await를 try에...catch 구조에서 이 비동기 조작이 성공하든 안 되든 두 번째await는 실행됩니다.
async function f() {
  try {
    await Promise.reject(' ');
  } catch(e) {
    
  }
  return await Promise.resolve('hello world');
}

f().then(res => console.log(res))

// hello world

또는 await 뒤에 있는 Promise 대상과catch 방법을 따라 앞에서 발생할 수 있는 오류를 처리합니다.
async function f() {
  await Promise.reject(' ')
    .catch(err => console.log(err));
  return await Promise.resolve('hello world');
}

f()
.then(res => console.log(res))
//  
// hello world

9. await 뒤의 비동기 동작이 잘못되면 asyn c 함수와 같은 Promise 대상이 리젝트됩니다.
async function f() {
  await new Promise(function (resolve, reject) {
    throw new Error(' ');
  });
}

f().then(res => console.log(res))
   .catch(err => console.log(err))
// Error: 

10. 실수를 방지하기 위해서도 try에 두는 방법...catch 코드 블록에 여러 개의await 명령이 있으면try에 통일적으로 놓을 수 있습니다.catch 구조에서.
async function f() {
  try {
    await new Promise(function (resolve, reject) {
      throw new Error(' ');
    });
  } catch(e) {
  }
  return await('hello world');
}

f().then( res => console.log(res) )
// 'hello world'

11. await를 사용할 때 다음과 같은 몇 가지를 주의해야 한다.
  • await 명령 뒤에 있는 Promise 대상, 실행 결과는rejected일 수 있으므로 await 명령을try에 두는 것이 좋습니다.catch 코드 블록에 있습니다
     async function myFunction() {
       try {
         await operations();
       } catch (err) {
         console.log(err);
       }
     }
    
     //  
    
     async function myFunction() {
       await operations()
       .catch(function (err) {
         console.log(err);
       });
     }   
    
  • 여러 개의await 명령 뒤의 비동기적인 조작은 계발 관계(즉 서로 의존하지 않음)가 존재하지 않으면 동시에 촉발시켜 프로그램의 실행 시간을 단축시키는 것이 가장 좋다
     //  
     let [foo, bar] = await Promise.all([getFoo(), getBar()]);
    
     //  
     let fooPromise = getFoo();
     let barPromise = getBar();
     let foo = await fooPromise;
     let bar = await barPromise;
    
  • await 명령은 async 함수에만 사용할 수 있으며, 일반 함수에만 사용하면 오류가 발생합니다
     async function func(db) {
       let docs = [{}, {}, {}];
    
       //  
       docs.forEach(function (doc) {
         await db.post(doc);
       });
     }
  • 좋은 웹페이지 즐겨찾기