Asynchronous(비동기 처리)란?

: 특정 코드의 연산이 끝날 때까지 코드의 실행을 멈추지않고 다음 코드를 먼저 실행하는 자바스크립트 특성

대표적인 비동기 작업의 예🤔?

• 시간의 흐름(timeline)에 따른 애니메이션 따위의 작업을 할 때(setTimeout())

// #1
console.log('Hello');
// #2
setTimeout(function() {
	console.log('Bye');
}, 3000);
// #3
console.log('Hello Again');

• 파일 I/O(input/ output)
• 네크워크 요청(fetch)

Promise

• 비동기 처리에 사용되는 객체
• 데이터 get 요청을 해놓고 다음 코드들을 실행한다.
• get 요청의 응답이 성공적으로 받아지면 화면에 띄우는 등의 역할을 해줄 수 있다.
• Promise가 없다면, 응답을 받고 함수가 종료될 때 까지 브라우저는 가만히 기다릴것이다. 😓

Promise Chaining

.then()

• .then()으로 연결하면 된다.

1. 기본

new Promise(function(resolve, reject){
	setTimeout(function(){
    resolve(1);
    }, 1000);
}).then( res => console.log(res))

2. 함수를 미리 선언하고 이런식으로 활용 가능하다.

getData(getUserInfo)
  .then(parseValue)
  .then(auth)
  .then(diaplay);

.catch()

• 에러를 핸들링 할 때 .catch()를 사용한다.

getData().then.catch();