[1장][주하] 리액트 개발을 위해 꼭 알아야 할 자바스크립트 (2)

[hayamaster]

퀴즈

A: 다음 코드의 출력을 작성하세요.

Promise.resolve().then(() => {
  console.log('출')
})

window.requestAnimationFrame(() => {
  console.log('까')
})

console.log('맞')

setTimeout(() => {
  console.log('나')
}, 0)

B: 다음 코드의 출력을 작성하세요.

Array.from([1, 2, 3], (x) => x + x).forEach((i) => {
  if (i === 2) return

  setTimeout(() => {
    console.log(i + 1)
  }, 0)

  Promise.resolve().then(() => {
    console.log(i)
  })
})

답

정답

A: 맞출까나
설명: 실행되는 순서는 마이크로 태스크 큐 -> requestAnimation API -> 태스크 큐 순서입니다.

B: 4, 6, 5, 7
설명: 생성된 배열은 [2, 4, 6]입니다. i가 2일 때를 제외하고 로직을 돌게됩니다. setTimeout은 태스크 큐에 있으므로 마이크로 태스크 큐에 들어있는 Promise를 실행 후, 동작합니다.

댓글 작성법

(다음과 같이 답을 작성해 댓글로 달아주세요)
<details>
<summary>정답</summary>
<div markdown="1">
정답 설명
</div>
</details>

[hyoribogo]

A 맞 출 까 나
B 4 6 5 7

[HeeSeok-kim]

A. 맞출까나
B. 4,5,6,7

[khj0426]

맞 출 까 나
4 6 5 7