문서 편집 권한이 없습니다. 다음 이유를 확인해주세요: 요청한 명령은 다음 권한을 가진 사용자에게 제한됩니다: 사용자. 문서의 원본을 보거나 복사할 수 있습니다. * 관련 문서: [[자바스크립트]], [[컴퓨터공학]], [[공학 관련 정보]], [[나무위키 컴퓨터 프로젝트]], [[인터넷 관련 정보]] [목차] == 개요 == [[자바스크립트]] 코드를 인터프리터가 로드할 때, 변수의 정의가 그 범위에 따라 선언과 할당으로 분리되어 변수의 선언을 항상 컨텍스트 내의 최상위로 끌어올리는 것을 의미한다. 이는 오로지 변수에만 해당되는 것은 아니고 함수도 가능하며, 자바스크립트에서 함수의 호출을 첫 줄에서 하고 마지막 줄에 함수를 정의해도 문제없이 작동되도록 하는 유용한 특성이다. == 예제 == 가령 아래와 같은 코드가 있을 경우, {{{#!HTML <!-- HTML generated using hilite.me --> <div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"> <pre style="margin: 0; line-height: 125%"> <span style="color: #008800; font-weight: bold">function</span> sum (a, b) { <span style="color: #008800; font-weight: bold">var</span> x = add(a,b); <span style="color: #008800; font-weight: bold">return</span> x; <span style="color: #008800; font-weight: bold">function</span> add (c, d) { <span style="color: #008800; font-weight: bold">var</span> result = c+d; <span style="color: #008800; font-weight: bold">return</span> result; } } </pre></div> }}} 자바스크립트 인터프리터는 아래와 같이 읽는다. {{{#!HTML <!-- HTML generated using hilite.me --> <div style="background: #ffffff; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"> <pre style="margin: 0; line-height: 125%"> <span style="color: #008800; font-weight: bold">function</span> sum (a, b) { <span style="color: #008800; font-weight: bold">var</span> x = undefined; <span style="color: #008800; font-weight: bold">function</span> add (c, d) { <span style="color: #008800; font-weight: bold">var</span> result = c+d; <span style="color: #008800; font-weight: bold">return</span> result; } x = add(a,b); <span style="color: #008800; font-weight: bold">return</span> x; } </pre></div> }}} 변수의 경우 어디서 어떻게 선언을 하더라도 항상 컨텍스트내의 최상위로 끌고올라온 뒤 'undefined'를 할당해 둔다. 이후 함수 선언을 끌고 올라오고 난 뒤 변수의 할당과 함수의 실행문을 순서대로 가져온다. 즉 호이스팅은 자바스크립트 인터프리터가 코드를 읽는 방식이며, 이를 이해해야 원치않는 'undefined'가 출력되는 것을 막을 수 있다. [[분류:프로그래밍]] 호이스팅 문서로 돌아갑니다.