JavaScript pre-parsing_javascript 기술 이해
- WBOY원래의
- 2016-05-16 18:43:261094검색
실제로 또는 어떤 현상은 이것이 사실이 아님을 증명합니다. "JavaScript Definitive Guide" 및 관련 온라인 정보를 통해 JavaScript에 "사전 구문 분석" 동작이 있음을 알게 되었습니다. 이 기능을 이해하는 것이 중요합니다. 그렇지 않으면 실제 개발 중에 해결할 수 없는 많은 문제가 발생할 수 있으며 심지어 프로그램 버그로 이어질 수도 있습니다. 이 현상을 분석하기 위해, 그리고 제가 배운 내용을 요약하여 이 글에서는 점차적으로 JavaScript "사전 파싱"을 이해할 수 있도록 안내하겠습니다. 제 의견이 틀렸다면 정정해 주시기 바랍니다.
(1) 자바스크립트가 런타임 시 위에서 아래로만 파싱된다면 함수를 먼저 정의한 후 호출하기 때문에 다음 코드가 제대로 실행될 수 있다는 것은 이해가 됩니다.
코드 복사 코드는 다음과 같습니다.
function showMsg()
{
alert ('This is message');
}
showMsg(); // This is message
(2) 함수를 호출한 후에 정의할 수 있다는 것도 알고 있습니다. 코드는 다음 코드와 마찬가지로 정상적으로 작동할 수 있습니다. showMsg()가 호출될 때 showMsg()가 아직 정의되지 않은 것 같지만 정상적으로 작동하며 이는 JavaScript가 "사전 구문 분석"되었음을 나타냅니다.
코드 복사 코드는 다음과 같습니다.
showMsg() // 메시지입니다.
function showMsg()
{
alert('This is message');
}
(3) 위는 함수의 예시이고, 여기서는 일반 변수의 또 다른 예입니다. 다음 예제를 실행하면, 첫 번째 문장의 msg가 정의되었지만 초기화되지 않았음을 나타내는 undefed가 팝업됩니다. var msg; 아래 두 번째 문장을 주석 처리하면 "msg가 정의되지 않았습니다" 오류가 보고됩니다. 이는 또한 JavaScript가 "사전 구문 분석"되었음을 나타냅니다.
코드 복사 코드는 다음과 같습니다.
alert(msg); 🎜>var msg='This is message';
코드 복사 코드는 다음과 같습니다.
showMsg() // 메시지입니다. 2
function showMsg()
{
alert('메시지 1입니다.')
}
showMsg() // 메시지 2입니다.
function showMsg()
{
alert('메시지 2입니다');
}
(5) JavaScript "사전 구문 분석"은 변수나 함수를 환경에 미리 구문 분석하는 것입니다. 호출할 수 있습니다(가변 실행 환경). 다음 코드는 경고(msg) 이전에 msg의 정의를 본 것으로 보이지만 프로그램은 여전히 "msg가 정의되지 않았습니다"라는 오류를 보고합니다. 이는 함수에 정의된 변수가 함수의 전용 변수이므로 호출할 수 없기 때문입니다. 이는 JavaScript의 "사전 구문 분석"이 정의된 모든 변수를 창과 같은 전역 개체로 구문 분석하는 것을 의미하지 않음을 나타냅니다. function showMsg()
{
alert('메시지 1입니다.')
}
showMsg() // 메시지 2입니다.
function showMsg()
{
alert('메시지 2입니다');
}
코드 복사 코드는 다음과 같습니다.
function showMsg()
{
var msg='메시지입니다';
}
alert(msg); // msg가 정의되지 않았습니다
(6) JavaScript "사전 구문 분석"이 섹션에서 수행됩니다. , 정확하게는 <script> 블록으로 나누어져 있습니다. 다음 코드는 동일한 페이지의 두 스크립트 블록에 표시되며 동일한 이름을 가진 세 개의 함수를 정의합니다. 프로그램 실행 결과는 두 번째 스크립트 블록의 showMsg()가 처음 두 개의 showMsg()를 포함하지 않는 반면, 첫 번째 스크립트 블록의 두 번째 showMsg()는 첫 번째 showMsg()를 포함함을 보여줍니다. <br><br><div class="codetitle"><span><a style="CURSOR: pointer" data="50995" class="copybut" id="copybut50995" onclick="doCopy('code50995')">코드 복사<u></u></a> 코드는 다음과 같습니다.</span></div> <div class="codebody" id="code50995"><body> script type= "text/javascript"> <br>showMsg(); //메시지 2입니다. <br>function showMsg() <br>{ <br>alert('메시지 1입니다.'); } <br>function showMsg() <br>{ <br>alert('메시지 2입니다.') <br>} <br></script>{
var msg='메시지입니다';
}
alert(msg); // msg가 정의되지 않았습니다