자바스크립트 변수 승격이란 무엇을 의미하나요?

JavaScript에서 변수 승격이란 변수 범위 내에서 변수가 선언된 위치에 관계없이 범위의 맨 위로 승격되지만 변수 초기화 순서는 변경되지 않음을 의미합니다. 변수 호이스팅의 실제 구현은 JavaScript 변수 및 함수 선언이 컴파일 단계 중에 메모리에 배치되는 것입니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, JavaScript 버전 1.8.5, Dell G3 컴퓨터.

변수 부스팅이란 무엇인가요?

변수 호이스팅(Hoisting)은 JavaScript 실행 컨텍스트가 어떻게 작동하는지에 대한 사람들의 이해이며 공식적인 변경 사항은 아닙니다.

말 그대로 이해하면 변수 승격이란 변수 및 함수 선언이 물리 계층의 범위 앞으로 이동된다는 의미입니다. 이러한 이해는 정확하지는 않지만 효과는 동일합니다.

일반인의 용어로, 변수 승격이란 변수 범위 내에서 변수가 선언된 위치에 관계없이 범위의 맨 위로 승격되지만 변수 초기화 순서는 변경되지 않음을 의미합니다.

변수 승격의 실제 구현은 JavaScript 변수 및 함수의 선언이 컴파일 단계에서 메모리에 배치된다는 것입니다. 이는 함수나 변수가 공식적으로 선언되기 전에 사용자가 사용할 수 있음을 의미합니다.

변수 승격 구현을 이해하려면 먼저 다음 두 가지 사항을 명확히 해야 합니다.

• javascript 코드는 한 줄씩 실행되지 않습니다.

• javascript 실행은 2단계로 나뉩니다.

  • 컴파일( 어휘 해석/사전 해석)

  • Execution

가변 승격이 이해에 도움이 됨

console.log(a);
var a = 'ghostwu';

위 코드 예의 경우 코드의 첫 번째 줄은 오류가 보고된 것으로 생각할 수 있습니다. a가 출력되고 a 변수가 정의되지 않았지만 올바른 결과가 정의되지 않았습니다.. 실제 코드와 결합된 js 실행 코드에 대한 위의 설명에 따르면 변수를 정의하기 위해 var a = "ghostwu"를 만날 때 js는 실제로 이 문장을 두 단계로 간주하고 var a는 컴파일 단계에서 발생하며 a = 실행 단계에서 'ghostwu'가 발생하면 var a가 현재 범위의 맨 앞으로 승격되고 a = 'ghostwu'는 실행 단계를 기다리며 그대로 유지되므로 다음 사례를 살펴보세요.

 a = 'ghostwu';
 var a;
 console.log( a );
 
 //上面这段代码经过编译之后，变成下面这样

 var a;  //被提升到当前作用域的最前面
 a = 'ghostwu'; //留在原地，等待执行
 console.log( a ); //输出ghostwu
 
 
 
  console.log( a ); 
   var a = 'ghostwu';

   //上面这段代码,经过编译之后，变成下面这样
   
   var a;
  console.log( a );//输出undefined,而不会报错
   a = 'ghostwu';

함수 선언 승격

함수 선언 승격을 설명하기 전에 먼저 함수를 정의하는 두 가지 일반적인 방법을 이해하겠습니다.

         //函数声明, 形如:
         function show(){
             console.log( '函数声明方式' );
         }
 
         //函数表达式, 形如:
         var show = function(){
             console.log( '表达式方式' );
         }

함수 표현식과 함수 선언은 컴파일 단계에서 서로 다른 해석 효과를 생성하므로 함수 명령문이 승격됩니다. 예를 들어 다음 코드를 참조하십시오.

         show();
         function show(){
             console.log( a );
             var a = 'ghostwu';
         }


//函数声明会被提升，所以上面的代码经过编译之后，就变成下面这样

    function show(){    //函数声明被提升到 当前作用域的最前面
    var a;    
     //var声明被提升到当前作用域的最前面, 注意，他不会提升到函数的外面, 因为当前的作用域是在函数中
    console.log( a );
    a = 'ghostwu';
   }
   show();//输出undefined

그러나 함수 표현식은 승격되지 않습니다. 다음 예를 참조하십시오.

show(); //报错,show is not a function
var show = function(){
 console.log( 'ghostwu' );
}
//对于上面这段表达式代码，经过编译之后:
var show;
show();  //执行之后就是 undefined(), 所以在表达式定义之前，调用函数报错了
show = function(){
  console.log( 'ghostwu' );  
}

그러나 다음 경우를 참조하십시오.

show(); //你好
var show;
function show(){
console.log( '你好' );
}
show = function(){
   console.log( 'hello' );
}

위 코드가 "Hello"를 출력하는 이유는 무엇입니까? 같은 이름의 함수 선언이나 변수 선언이 나타나면 함수 선언이 먼저 승격되고 변수 선언은 무시됩니다. 따라서 컴파일 후에는 다음과 같습니다.

function show(){
   console.log( '你好' );
}
show(); //你好
show = function(){
  console.log( 'hello' );
}
show();//如果这里在调用一次，就是hello, 因为show函数体在执行阶段被重新赋值了

그러나 동일한 이름을 가진 함수 선언이 있는 경우 다음 코드와 같이 후자가 이전 선언을 덮어씁니다.

show(); //how are you
var show;
function show(){
console.log( 'hello' );
}    
show = function(){
console.log( '你好' );
}
function show(){
console.log( 'how are you!' );
}  

//上面的代码经过编译之后，变成如下形式:
function show(){
   console.log( 'how are you!' );
}
show(); //how are you
show = function(){
 console.log( '你好' );
}
show(); //如果在这里再执行一次，结果：你好

참고:

• 변수 승격은 변수 선언을 향상시킬 뿐 할당 값을 증가시키지 않습니다.

• 변수 승격이라는 것이 있기 때문에 변수 승격으로 인한 악영향을 피하기 위해서는 변수를 정의할 때 var 대신 let을 사용하는 것이 가장 좋습니다.

【관련 추천: 자바스크립트 학습 튜토리얼】

위 내용은 자바스크립트 변수 승격이란 무엇을 의미하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!