JavaScript의 변수 선언 호이스팅 문제에 대한 간략한 분석(호이스팅)

1. 변수선언 호이스팅

호이스팅 영어 ['hɔˈstˈŋ] US ['hɔˈstˈŋ]

호이스팅, 리프팅

v. Hoist, raise (hoist의 현재분사)

먼저 밤을 보자

var cc = 'hello';
function foo(){
 console.log(cc);
 var cc = 'world';
 console.log(cc);
}
foo();
console.log(cc);

여기에는 undefine이 출력됩니다. 'world', 'hello'

여기에는 두 가지 주요 지식 포인트가 있습니다:

1. Scope

2, 변수 선언 승격

JavaScript는 인터프리터(Chrome의 V8 엔진 등) 환경에서 코드가 실행될 때 사전 파싱 과정을 거쳐 변수 선언과 함수 선언이 승격됩니다. 이 동작을 선언 호이스팅(Hoisting)이라고 합니다.

위의 예를 다시 보면 이 코드에는 전역 범위와 함수 foo 범위라는 두 가지 수준의 범위가 있고 변수는 다음과 같습니다. foo의 선언은 사전 구문 분석 과정에서 함수 범위의 맨 앞으로 승격되므로 코드는 다음과 같습니다.

var cc = 'hello';
function foo(){
 var cc;
 console.log(cc);
 cc = 'world';
 console.log(cc);
}
foo();
console.log(cc);

첫 번째 로그가 실행되면 cc 변수는 선언만 되고 할당되지 않으므로 인쇄되는 내용은 정의되지 않습니다

2. 함수 선언 개선

함수를 선언하는 방법에는 두 가지가 있습니다. 함수 선언 및 함수 표현식

// 函数声明
function foo(a, b) {
 return a + b;
}
// 函数表达式
var foo = function(a, b) {
 return a + b;
}

파서가 실행 환경에 데이터를 로드할 때 함수 표현식이 동일하게 생성되지 않습니다. 파서는 코드를 실행하기 전에 먼저 함수 선언을 읽고 이를 사용 가능(액세스 가능)하게 만듭니다. 함수 표현식의 경우 파서가 해당 코드 줄에 도달할 때까지 실제로 해석 및 실행되지 않습니다.

물론 var a = function b(){}와 같이 함수 선언과 함수 표현식을 동시에 사용할 수도 있습니다. 결과적으로는 함수 표현식의 효과만 가집니다. b는 자동으로 무시되므로 A변수 부스트 효과만 발생합니다.