코드 땜장이

자바스크립트 함수, 선언부터 클로저와 this까지 한 번에 이해하기 빠른 답 자바스크립트에서 함수는 값처럼 다룰 수 있는 일급 객체라서 전달, 반환, 저장이 모두 가능합니다. 함수 선언식과 함수 표현식은 호이스팅 방식이 다르므로 호출 가능 시점이 달라집니다. 클로저는 함수가 자신이 만들어질 때의 스코프를 기억하는 동작이며, 상태 캡슐화의 핵심 도구입니다. 화살표 함수는 문법만 짧은 것이 아니라 this와 arguments를 자체적으로 만들지 않는다는 점이 중요합니다. 목차 한눈에 비교 실행 환경을 먼저 맞추기 함수는 값이면서 호출 가능한 객체다 선언식, 표현식, 화살표 함수의 차이 호이스팅과 TDZ를 오류 이름으로 읽기 클로저는 값을 복사하지 않고 환경을 붙잡는다 this와 arguments는 호출 방식과 선언 방식이 가른다 출력으로 읽는 디버깅 포인트 실무에서 어떤 형태를 고를까 한눈에 비교 Point 1 함수 선언식: 평가 단계에서 함수 객체까지 준비되므로 선언 전 호출이 가능하다. Point 2 함수 표현식: 변수 바인딩과 함수 값 할당이 분리된다. const 는 TDZ 때문에 ReferenceError , var 는 undefined 상태라 TypeError 가 난다. Point 3 화살표 함수: 함수 값이긴 하지만 자체 this , arguments , prototype 이 없고 생성자로 쓸 수 없다. Point 4 클로저: 외부 값을 “복사”해 두는 게 아니라, 선언 시점의 스코프 체인에 계속 연결된다. Point 5 undefined , ReferenceError , TypeError 는 모두 다른 신호다. 값이 없는지, 접근이 금지됐는지, 타입이 맞지 않는지 구분해서 읽어야 한다. 함수를 이해할 때는 문법 이름보다 먼저 네 가지를 보면 된다. 값처럼 전달되는가, 언제 호출 가능한가, 어떤 스코프를 기억하는가, this 를 스스로 가지는가. 이 기준이 잡히면 선언식, 표현식, 클로저, 화살표 함수가 따로 놀지 않는다. 실행 환경...

자바스크립트 호이스팅, undefined와 ReferenceError는 왜 다를까 빠른 답 호이스팅은 코드 이동이 아니라 실행 전 선언이 먼저 등록되는 과정으로 이해하는 편이 정확하다. var는 선언 시 undefined로 초기화되므로 값 할당 전 접근하면 undefined가 나온다. let과 const는 TDZ 구간이 있어 선언문 이전 접근 시 ReferenceError가 발생한다. 함수 선언문은 먼저 준비되지만 함수 표현식은 변수 규칙을 따라 다른 오류를 만들 수 있다. 목차 호이스팅은 코드가 올라가는 현상이 아니라 선언이 먼저 준비되는 과정이다 흐름으로 보기 실행 전에 일어나는 일: 생성 단계와 실행 단계 실험 환경 준비 한 파일로 비교하는 var, let, const, 함수 선언문, 함수 표현식 콘솔 출력으로 읽는 undefined, ReferenceError, TypeError의 차이 블록 스코프와 TDZ에서 자주 생기는 실수 실무에서 기억할 판단 기준 호이스팅은 코드가 올라가는 현상이 아니라 선언이 먼저 준비되는 과정이다 호이스팅을 "변수와 함수가 위로 끌어올려진다"라고만 외우면 실제 실행 결과를 설명하기 어려워집니다. 자바스크립트 엔진은 코드를 물리적으로 위로 옮기지 않습니다. 대신 현재 스코프에서 어떤 이름이 선언됐는지 먼저 파악하고, 그 이름들을 사용할 준비를 해 둡니다. 그래서 핵심은 "코드가 어디 있나"보다 "이 시점에 그 이름이 어떤 상태인가"입니다. 용어도 하나 바로잡아 두면 좋습니다. function hello() {} 를 흔히 함수 선언식이라고 부르지만, 함수 표현식과 구분하려면 함수 선언문이라고 부르는 편이 더 정확합니다. 이 글에서는 함수 선언문과 함수 표현식을 분리해서 설명합니다. 흐름으로 보기 자바스크립트 엔진은 먼저 소스 코드를 읽고 선언을 수집합니다. 그다음 var , let , const , 함수 선언문을 서로 다른 규칙으로 준비한 뒤, 실제 실...