문법 · JS · intermediate

비동기 맛보기 (문제 범위 밖이지만)

Promise와 async/await가 뭔지 정도만. 채점 문제는 동기 solve가 기본.

배우기 · JavaScript 문법 · 12분 · 7/10 · javascript · 비동기

이 트랙 목차 (10)
  1. 1. 값·변수·타입: let, const, Number, String
  2. 2. 조건과 논리: if, else, &&, ||, 삼항
  3. 3. 반복: for, while, for...of, 배열 메서드
  4. 4. 함수: 선언, 화살표, 스코프, 순수 함수
  5. 5. 배열과 문자열 다루기
  6. 6. 객체·Map·Set
  7. 7. 비동기 맛보기 (문제 범위 밖이지만)
  8. 8. 오류 읽기: TypeError · undefined · 스택
  9. 9. 정규식 맛보기: test · match · replace
  10. 10. JSON 파싱 맛보기

이 사이트 채점과의 관계

문제의 solve동기로 끝나는 것을 전제로 합니다.
await로 네트워크를 기다리거나, 타이머로 미루면 채점이 기대와 다르게 동작할 수 있습니다.

그래도 웹 개발에서는 비동기가 핵심이라, 문법 차원에서만 짧게 봅니다.

Promise

const p = Promise.resolve(42);
p.then((v) => console.log(v));

async / await

async function load() {
  const res = await fetch('/api'); // 브라우저는 CSP에 막힐 수 있음
  return res.json();
}

async 함수는 항상 Promise를 반환합니다.

연습 문제에서는

입력을 파싱하고 계산하고 즉시 return 하세요.
미리보기·연습장의 자유 실험과 채점 계약을 혼동하지 않으면 됩니다.

왜 채점에서는 거의 안 쓰나

solve는 입력을 받아 즉시 답을 반환해야 합니다.
네트워크·타이머에 기대면 채점이 끝나기 전에 결과가 비어 있을 수 있습니다.

알아 두면 좋은 한 줄

async function f() {
  return 1; // 실제로는 Promise
}

await는 Promise가 끝날 때까지 기다립니다.
알고리즘 문제 트랙에서는 “있다” 정도만 알고, 본 연습은 동기 파싱·계산·return에 집중하세요.

연습장에서 실험

자유 연습장에서 setTimeout으로 찍는 실험은 가능합니다.
그 코드를 문제 solve에 그대로 넣지 마세요.

한 줄 정리

채점 solve = 동기.
웹 UI = 이벤트가 비동기처럼 느껴지지만, 핸들러 안 계산은 보통 동기.

entangle하지 마세요.

더 깊게

읽은 뒤 연습장에서 예제 코드를 한 번 타이핑해 보세요. 눈으로만 보면 하루 뒤 사라집니다.

관련 원리 카드와 문제 태그로 바로 이어서 풀면, 문법·패턴이 한 묶음으로 남습니다.

막히면 30분 규칙: 입력을 로그로 확인 → 기대/실제 한 줄 비교 → 그래도 안 되면 배우기 레슨으로 잠시 복귀.

관련 짧은 원리

관련 문제