1/3 공부 기록

https://learnjs.vlpt.us/async/

3장. 자바스크립트에서 비동기 처리 다루기

 

1. 동기

다수의 워커가 존재할 때 1명의 워커가 작업을 가지면 다른 워커는 작업자가 끝날 때까지 기다려야 하는것

2. 비동기

다수의 워커가 각자 자신의 일들을 하는 것 (동시에 여러가지 작업 및 기다리는 과정에서 다른 함수 초루)

 

비동기 처리 작업들

• Ajax Web API 요청
  서버 쪽에서 데이터를 받아와야할 때, 요청을 하고 서버에서 응답을 할 때까지 대기해야하기에 비동기로 처리
• 파일 읽기
• 암호화/복호화
• 작업 예약 - 몇 초 후에 스케쥴링 해야하는 상황에선 setTimeout을 사용하여 비동기적으로 처리

const myPromise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve(1);
  }, 1000);
});

myPromise.then(n => {
  console.log(n);
});

function increaseAndPrint(n) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const value = n + 1;
      if (value === 5) {
        const error = new Error();
        error.name = 'ValueIsFiveError';
        reject(error);
        return;
      }
      console.log(value);
      resolve(value);
    }, 1000);
  });
}

increaseAndPrint(0)
  .then(n => {
    return increaseAndPrint(n);
  })
  .then(n => {
    return increaseAndPrint(n);
  })
  .then(n => {
    return increaseAndPrint(n);
  })
  .then(n => {
    return increaseAndPrint(n);
  })
  .then(n => {
    return increaseAndPrint(n);
  })
  .catch(e => {
    console.error(e);
  });

 

async / await

 

function sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
}

async function process() {
  console.log("안녕하세요!");
  await sleep(1000);
  console.log("반갑습니다!");
}

process();

async/await 문법 사용 시 함수 선언 할 때 함수 앞에 async 키워드 필요하다.

Promise 앞부분에 await을 넣어주면 해당 프로미스가 끝날때까지 기다렸다가 다음 작업을 수행 할 수 있다.