프로그래머스 데브코스 웹 풀사이클 9주차 3일차

geun·2024년 1월 10일
0

데브코스

목록 보기
31/79
post-thumbnail

Node.js

비동기 처리

JS는 논블로킹 I/O 특징을 가지고있어서, 한가지 작업을 해도 비는 시간이 생기면 다른 작업을 시작한다. 그렇기 때문에 비동기 처리를 해줘야 작업을 원하는 순서대로 실행시킬 수 있다.
(순서를 맞춰 코드를 실행)

비동기 발생 함수 : setTimeOut(), query(), setInterval() 등....

비동기 처리 방식
1. 콜백 함수 : 할 작업을 다 수행하고 나서 다음 작업을 수행
2. promise 객체 사용
3. then & catch 사용
4. async await (es2017 추가)

Promise

JavaScript에서 CallBack함수는 비동기를 순차적으로 처리하기 위한 편법같은 존재이지 실제로 비동기를 위해 탄생한 객체로는 Promise 객체가 있다. Promise 객체는 비동기 작업의 성공, 실패와 그 결과값을 나타내어 비동기 작업을 비교적 깔끔하게 수행할 수 있다.

Promise Chaining

프로미스 함수에 then을 이어 붙여서 프로미스체이닝을 구현할 수 있다

let promise = new Promise(function (resolve, reject) {
  setTimeout(() => resolve("완료"), 3000);
})
  .then(
    function (result) {
      console.log(result);
      return result + "!!!!!";
    },
    function (error) {}
  )
  .then(
    function (result) {
      console.log(result);
      return result + "!!!!!";
    },
    function (error) {}
  )
  .then(
    function (result) {
      console.log(result);
    },
    function (error) {}
  );

결과

완료
완료!!!!!
완료!!!!!!!!!!

Async Await

async / await 문법은 비교적 최신에 추가된 (es2017) 문법으로 프로미스 객체를 좀 더 쉽게 사용하기 위해 사용한다. 즉, 비동기 처리를 위해 사용하는 신규 문법이라 볼 수 있다.

promise를 이용한 코드를 async await을 이용한 코드로 리팩토링한 결과이다.


let promise = new Promise(function (resolve, reject) {
  setTimeout(() => resolve("완료!"), 3000);
});

promise.then(
  function (result) {
    console.log(result);
  },
  function (error) {
    console.log(reject);
  }
);

async function f() {
  let promise = new Promise(function (resolve, reject) {
    setTimeout(() => resolve("완료!"), 3000);
  });
  let result = await promise;
  console.log(result);
}

f();

0개의 댓글