[45장] 프로미스

[juyeon-park]

데브코스 4기 프롱이들 모던 JS Deep Dive 책 뿌수기😎

아래 템플릿을 복사해서 1개이상 퀴즈를 만들어주세요. 객관식, 주관식, 단답형 모두 상관없습니다!

Q. 퀴즈 내용
1.  1번
2.  2번
3.  3번

<details>
<summary>퀴즈 정답</summary>
<div markdown="1">    
정답 설명
</div>
</details>

[jonghyunlee95]

Q.

1. 아래 코드가 몇초 뒤에 출력될 지 맞춰보세요
2. 다음 코드를 읽고 콘솔에 출력 될 결과를 맞춰보세요

const project1 = () => 
  new Promise(resolve => setTimeout(() => resolve('프로젝트 '), 1000));

const project2 = () =>
  new Promise(resolve => setTimeout(() => resolve('너무 '), 500));

const project3 = () => 
  new Promise(resolve => setTimeout(() => resolve('고생 많으셨습니다!!'), 1000));

const project4 = () => 
  new Promise(resolve => setTimeout(() => resolve('다들 '), 100));

Promise.all([project4(), project1(), project2(), project3()])
  .then((arr) => console.log(arr.join('')))
  .catch(console.log);

퀴즈 정답

1. 1초
2. 다들 프로젝트 너무 고생 많으셨습니다!!

[eeseung]

Q. 다음은 프로미스의 비동기 처리 상태 정보입니다. 표와 문장의 빈칸을 채워 주세요.

프로미스의 상태 정보	의미	상태 변경 조건
(1)	비동기 처리가 아직 수행되지 않은 상태	프로미스가 생성된 직후 기본 상태
(2)	비동기 처리가 수행된 상태(성공)	resolve 함수 호출
(3)	비동기 처리가 수행된 상태(실패)	reject 함수 호출

(2) 또는 (3) 상태를 (4) 상태라고 한다. (4) 상태는 (2) 또는 (3) 상태와 상관없이 (1)이 아닌 상태로 비동기 처리가 수행된 상태를 말한다.

퀴즈 정답

(1) pending (2) fulfilled (3) rejected (4) settled

[dudwns]

Q. 다음 문제를 읽고 빈 칸을 채우시오.

• 프로미스의 then, catch, finally 후속 처리 메서드는 언제나 프로미스를 반환하므로 연속적으로 호출할 수 있다. 이를 ( 1 ) 이라 한다.
• ( 2 ) 메서드는 가장 먼저 fulfilled 상태가 된 프로미스의 처리 결과를 resolve하는 새로운 프로미스를 반환한다.
• 프로미스의 후속 처리 메서드의 콜백 함수는 ( 3 )에 저장된다.

퀴즈 정답

1. 프로미스 체이닝
2. Promise.race
3. 마이크로태스크 큐

[hyoribogo]

Q. 다음 코드의 실행 결과를 써주세요.

setTimeout(() => console.log(1), 0)
Promise.resolve()
  .then(setTimeout(() => console.log(2), 1000))
  .then(setTimeout(() => console.log(3), 500))

퀴즈 정답

1
3
2

해설:
마이크로태스크 큐에 등록되는 건 setTimeout 함수
태스크 큐에 등록되는 건 setTimeout의 콜백 함수

따라서 1, 3, 2 순으로 출력된다.

[suehdn]

Q. 다음 코드의 에러가 catch블록에서 캐치 되지 않는 이유를 설명해주세요!

try {
 setTimeout(() => { trow new Error('에러입니다!')},1000);
} catch (event) {
 console.log(event)
}

퀴즈 정답

setTimeout 함수의 콜백함수를 호출한 것은 setTimeout 함수가 아니고 에러는 호출자 방향으로 전파되기 때문에 캐치되지 않는다.