JavaScript 변수가 정의되지 않음 vs 정의되지 않음

Question

다음 JavaScript가 첨부 된 HTML 페이지가 있습니다. 경고는 전화를 정의되지 않은 표시됩니다

alert(box); 
var box = "Thinking outside the box"; 

:

내가로 변경하면 "상자 정의되지 않은 catch되지 않는 오류 ReferenceError는"콘솔에서

alert(box); 
box = "Thinking outside the box"; 

내가 얻을. 나는 이것을 설명 할 수 있어야한다. 나는 이것이 왜 일어나는 지 모호한 생각을 가지고있다. 나는 var를 사용할 때 JavaScript가 경고가 실행되기 전에 변수가 있다는 것을 알고 있지만 반드시 값을 할당하지는 않았습니까? 내가 여기서 떨어져? 이것을 이해하는 데 도움이 필요합니다.

Answer 1

var을 사용하여 변수를 정의하면 변수의 선언이 범위의 맨 위에 "올려 짐"되므로 변수가 전체 범위에 대해 정의됩니다. 변수의 초기화 (초기 값 지정)는 코드의 동일한 위치에 유지됩니다.

따라서 두 번째 예에서 을 실행하면 box 변수는 호이스트 된 var 문 때문에 이미 선언되었습니다. 두 번째 예 : 초기화되지하지만

이

var box; 
alert(box); 
box = "Thinking outside the box"; 

이 (선언 box 변수를 만든다 :

alert(box); 
var box = "Thinking outside the box"; 

합니다 (box 변수의 선언이 범위의 상단에 게양된다)이 기본적으로 동일하다) 앞에 변수를 선언하면 변수가 선언되었지만 아직 값이없는 결과가 표시됩니다 (alert()보고 undefined은 변수가 존재하지만 아직 초기화되지 않은 상태입니다).

첫 번째 예는 var를 사용하지 않으며,이 모든 이름 box에서 어떤 변수가없고, 따라서 당신이 uncaught reference error를 얻을 당신이 alert(box) 할 시점에 있도록하여 더 게양가 없습니다.

hoisting의 세부 사항을 설명하는 많은 게시물이 여기에 있습니다. 여기에 긴리스트가 있습니다 : https://stackoverflow.com/search?q=javascript+variable+hoisting 가변 호이 스팅에 대한 자세한 설명을 볼 수 있습니다.

참고 : 기능 선언은 또한 끌어 올려서 일부 게시물은 개념이 거의 동일하지만 변수 선언 대신 함수 선언에 관한 것입니다.

Answer 2

이것은 가변 호이 스팅과 관련이 있습니다. 이것이 의미하는 바는, 변수 선언 (및 일반적으로 선언)은 코드가 실행되기 전에 처리되며, 코드의 아무 곳에서나 변수를 선언하는 것은 맨 위에 선언하는 것과 동일합니다. 이것은 변수가 선언되기 전에 사용 된 것처럼 보일 수도 있음을 의미합니다.

당신은 다음 작업을 수행 할 때 : 그시에,

첫 번째 경우

var box; 
alert(box); 
box = "Thinking outside the box" 

가 게양되지 않은, 당신은 따라서 어떤 변수 선언을하지 않으며, :

alert(box) 
var box = "Thinking outside the box" 

이 암시 적으로 이해된다 포인트 박스는 undefined

왜 이런 일이 발생합니까? 측면 읽으면서

For completeness, let’s mention that actually at the implementation level things are a little more complex. There are two stages of the code handling, where variables, function declarations, and formal parameters are created at the first stage, which is the stage of parsing and entering the context. In the second stage, the stage of runtime code execution, function expressions and unqualified identifiers (undeclared variables) are created. But for practical purposes, we can adopt the concept of hoisting, which is actually not defined by ECMAScript standard but is commonly used to describe the behaviour.

- Stoyan Stefanov, "JavaScript Patterns"

, 안전 목자에서 this 기사를 링크 :

의 Stoyan 스테파노는 그의 책 "자바 스크립트 패턴"에서 설명 하듯이는 권상은 자바 스크립트 인터프리터의 구현의 결과이다.