코드 땜장이

Promise resolve와 fulfilled의 차이: 호출하는 함수와 도달한 상태를 구분하기 빠른 답 resolve 는 Promise의 상태 이름이 아니라 Promise 생성자 안에서 제공되는 함수입니다. fulfilled 는 Promise가 성공 값으로 완료된 상태입니다. resolve(value) 에 일반 값을 넘기면 대개 fulfilled 가 되지만, rejected Promise나 실패하는 thenable을 넘기면 rejected 가 될 수 있습니다. resolve 호출은 동기 코드에서 일어나도 then 콜백은 현재 실행 흐름이 끝난 뒤 microtask로 실행됩니다. 목차 한눈에 비교 시간 흐름으로 이해하기 Promise의 상태와 값 구분하기 resolve를 호출해도 fulfilled가 아닐 수 있는 경우 콘솔 출력으로 보는 실행 순서 resolve, reject, then, catch를 함께 읽는 법 자주 나오는 오해 면접에서 설명할 때의 기준 한눈에 비교 개념 resolve 는 호출하는 함수이고, fulfilled 는 Promise가 가질 수 있는 상태입니다. 위치 resolve 는 new Promise((resolve, reject) => {}) 의 실행자 함수에 인자로 들어오고, fulfilled 는 Promise 내부 상태를 설명할 때 쓰입니다. 역할 resolve 는 전달된 값으로 Promise 해결 절차를 시작하고, fulfilled 는 그 절차가 성공 값으로 끝난 상태를 뜻합니다. 값 처리 resolve(1) 은 1 로 이행되지만, resolve(Promise.reject(error)) 는 바깥 Promise도 거부될 수 있습니다. 실행 시점 resolve 호출은 지금 실행 중인 코드에서 발생하고, then 콜백은 microtask 큐를 거쳐 나중에 실행됩니다. 오류 의미 fulfilled 는 성공 값이 있는 상태이고, 실패 이유가 있는 상태는 rejected 입니다. resolve 와 fulfilled 가...

ES6는 무엇을 바꿨을까: 최신 문법보다 중요한 자바스크립트 실행 의미 이해하기 빠른 답 ES6는 현재의 최신 버전이 아니라 2015년에 표준화된 ECMAScript 2015를 가리키는 중요한 전환점입니다. let 과 const 는 단순한 var 대체 문법이 아니라 블록 스코프와 TDZ 때문에 값 대신 오류가 관찰될 수 있습니다. 화살표 함수는 짧은 함수 문법보다 자신만의 this 를 만들지 않는다는 차이가 더 중요합니다. ES6 이전 문법은 레거시 코드, 트랜스파일 결과, 오래된 예제 해석을 위해 여전히 알아둘 필요가 있습니다. 목차 한눈에 비교 ES6는 최신 버전이 아니라 ECMAScript 2015라는 기준점이다 스코프와 선언 방식이 바꾸는 관찰 가능한 결과 this, 클래스, 모듈은 문법보다 실행 의미가 중요하다 구조 분해와 스프레드에서 값과 참조 구분하기 Promise는 값과 오류의 흐름을 함께 다룬다 Babel과 호환성 설정에서 나누어 봐야 할 것 흔한 오해와 현재 기준의 해석 ES6 이전 문법을 여전히 알아야 하는 이유 한눈에 비교 버전 기준 ES6는 ECMAScript 2015이며, 2026년 4월 기준 공식 연간 스냅샷은 ECMAScript 2025, 최신 편집본은 ECMAScript 2026 초안 흐름을 따릅니다. 선언 의미 var 는 함수 스코프와 undefined 초기화처럼 관찰되는 동작이 중심이고, let 과 const 는 블록 스코프와 TDZ로 접근 시점 오류를 드러냅니다. 값과 상태 const 는 값의 불변성을 보장하지 않고, 이름이 다른 값을 가리키도록 재할당하는 일을 막습니다. 함수 호출 일반 함수의 this 는 호출 방식에 따라 정해지고, 화살표 함수는 바깥 스코프의 this 를 그대로 사용합니다. 객체 모델 class 는 프로토타입 기반 객체 모델을 더 읽기 쉬운 형태로 쓰는 문법이지, 자바스크립트를 클래스 기반 언어로 바꾸지는 않습니다. 비동기 흐름 콜백 중심 코드에서 Promise 의 상태 전환과 오류 전...

자바스크립트 Promise를 상태 흐름과 실행 순서로 이해하기 빠른 답 Promise는 비동기 작업의 성공 값이나 실패 이유를 나중에 전달하기 위한 객체입니다. 상태는 pending 에서 fulfilled 또는 rejected 로 한 번만 바뀌며, 이후 다시 바뀌지 않습니다. then , catch , finally 콜백은 현재 동기 코드가 끝난 뒤 마이크로태스크로 실행됩니다. 복잡한 비동기 흐름은 긴 then 체인보다 async/await 와 좁은 범위의 try/catch 로 나누면 읽기 쉬워집니다. 목차 시간 흐름으로 이해하기 흐름으로 보기 값, 상태, 오류를 나눠 보기 Promise 생성자는 언제 실행될까 상태는 한 번만 결정된다 에러 전파와 catch의 의미 여러 작업을 조합할 때의 차이 then 체인과 async await 디버깅할 때 자주 보는 신호 흔한 오해 시간 흐름으로 이해하기 생성 시점 new Promise(...) 가 실행되면 executor 함수는 즉시 실행됩니다. → 대기 시점 아직 결과가 정해지지 않은 Promise는 pending 상태입니다. → 결정 시점 resolve 또는 reject 중 먼저 호출된 쪽으로 결과가 정해집니다. → 예약 시점 then , catch , finally 콜백은 마이크로태스크 큐에 등록됩니다. → 실행 시점 현재 동기 코드가 끝난 뒤 예약된 콜백이 실행됩니다. Promise를 “비동기니까 전부 나중에 실행되는 코드”로만 이해하면 콘솔 출력 순서가 자주 헷갈립니다. Promise 생성자 안의 executor는 동기적으로 실행됩니다. 나중에 실행되는 쪽은 Promise의 결과를 관찰하는 then , catch , finally 콜백입니다. 이 차이를 구분하면 상태 전환, 에러 전파, Promise.all 같은 조합 메서드의 동작을 더 차분하게 따라갈 수 있습니다. 흐름으로 보기 흐름 다이어그램 이 흐름에서 중요한 지점은 “작업이 시작되는 시점”과 “결과를 받는 콜백이 실행되...

자바스크립트 이벤트 루프: 싱글 스레드가 비동기 작업을 처리하는 방식 빠른 답 싱글 스레드는 자바스크립트 코드가 실행되는 콜 스택이 하나라는 뜻이지, 런타임 전체가 한 작업만 한다는 뜻은 아닙니다. 타이머, 네트워크, 파일 I/O 같은 대기 작업은 브라우저 Web APIs나 Node.js 런타임이 맡고, 완료된 콜백만 다시 실행 큐로 들어옵니다. Promise.then , queueMicrotask 같은 마이크로태스크는 일반 태스크보다 먼저 처리되므로 setTimeout 보다 앞서 실행될 수 있습니다. 브라우저와 Node.js는 이벤트 루프 구조가 다르고, Node.js 20 이후에는 타이머와 setImmediate 의 상대 순서를 설명할 때 오래된 자료와 차이가 있습니다. 목차 시간 흐름으로 이해하기 흐름으로 보기 싱글 스레드라는 말의 정확한 범위 이벤트 루프가 실행 순서를 정하는 방식 태스크와 마이크로태스크를 구분해야 하는 이유 브라우저와 Node.js의 차이 실행 환경을 남기는 설정 예시 Node.js에서 관찰하는 실행 순서 오류와 로그로 디버깅하기 흔한 오해 시간 흐름으로 이해하기 현재 작업 동기 코드가 콜 스택에서 위에서 아래로 실행됩니다. → 작업 위임 setTimeout , fetch , 파일 I/O 같은 대기 작업은 런타임으로 넘어갑니다. → 완료 대기 타이머 만료, 네트워크 응답, I/O 완료 콜백이 큐에 들어갑니다. → 마이크로태스크 현재 콜 스택이 비면 Promise.then , queueMicrotask 가 먼저 실행됩니다. → 다음 태스크 타이머, 이벤트 콜백 같은 태스크가 실행되고 브라우저는 렌더링 기회를 얻습니다. 흐름으로 보기 흐름 다이어그램 이 흐름에서 자바스크립트 엔진이 직접 모든 일을 붙잡고 있는 것은 아닙니다. 엔진은 현재 실행 중인 함수 본문을 처리하고, 오래 걸리는 대기 작업은 브라우저나 Node.js 런타임에 넘깁니다. 작업이 끝나면 콜백이 큐에 들어가고, 이벤트 루프가 콜 스택이 비는 시점에 맞...