>  기사  >  웹 프론트엔드  >  JavaScript 사전 파싱 및 관련 기술 분석_javascript 기술

JavaScript 사전 파싱 및 관련 기술 분석_javascript 기술

WBOY
WBOY원래의
2016-05-16 15:04:361061검색

이 글에서는 JavaScript 사전 파싱 및 관련 기술을 예시와 함께 설명합니다. 참고하실 수 있도록 모든 사람과 공유하세요. 자세한 내용은 다음과 같습니다.

변수

마찬가지로 이 두 가지 작은 예의 오류 비교 팁부터 시작해 보세요.

alert(y1);     //代码段1
var y1 = 'dddd';
alert(y2);     //代码段2 // alert(typeof y2);
y2 = 'xxxxx';

왜 하나는 정의되지 않은 메시지를 표시하고 다른 하나는 정의되지 않은 변수 오류를 발생시키는지 먼저 생각해 보세요. . 먼저 JavaScript 구문 분석 프로세스를 살펴보겠습니다.

Javascript는 프로세스를 실행하기 전에 이벤트 "사전 구문 분석"을 수행합니다. 구문 분석 엔진은 블록 수준에서 모든 var 변수 생성을 수행하고 초기 값인 정의되지 않음을 제공합니다. 이런 식으로 첫 번째 예에서 정의되지 않음이 나타나는 이유가 분명해집니다.

따라서 첫 번째 코드는 실제로

과 동일합니다.
var y1;
alert(typeof y1); //很自然,它此时值为undefined
y1 = 'dddd';

그렇다면 두 번째 코드 부분에서 다시 오류가 발생하는 이유는 더 이상 "사전 구문 분석" 단계가 아닙니다. (여기서는 브라우저가 스크립트 태그를 발견할 때 사전 구문 분석이라는 두 가지 작업만 수행한다고 가정합니다. , 실행. 사실 이 두 가지뿐이 아니지만, 실행 단계에서 오류가 발생하는 이유는 js가 실행 섹션 상태(파싱 전 단계)에서 y2의 상태를 알지 못하기 때문입니다. y2에 대한 정보는 캡처하지 않습니다. 물론 정의되지 않은 오류가 발생합니다. 여기에는 또 다른 문제가 수반됩니다. js는 약한 유형의 언어이고 변수를 정의하지 않고도 사용할 수 있는데 여기서 정의 오류가 발생하는 이유는 무엇입니까?

모든 일에는 이유가 있습니다. JavaScript에는 변수 읽기 및 쓰기가 고르지 않은 등 항상 그 자체로 이상한 특성이 많이 있습니다. 정의되지 않은 변수는 쓰기만 가능하고 읽을 수는 없습니다. 쓰기 가능이란 무엇입니까? 누구나 다음과 같은 쓰기 방식에 익숙합니다.

y2 = 'exam';  
//在没出现它的定义操作之前(即在它还没有自己的scope之前)该操作会将这段代码认为是定义一个全局变量,在window上注册一个属性y2,并赋值为exam

하지만 읽어보면 js 엔진이 관련 정보를 찾을 수 없어서 제멋대로 행동하고 정의되지 않은 오류를 가차없이 던지는 것이 js의 게임 규칙입니다. 그런데 왜 우리는 그 유형을 얻을 수 있습니까? js가 객체에 대해 어떻게 작동하는지 기억하세요. 존재하지 않는 속성 및 객체 유형에 액세스하는 경우 정의되지 않음이라는 메시지가 표시됩니다(현재는 창 객체의 속성이기 때문입니다).

또 다른 참고 사항: 변수 읽기와 쓰기는 동일하지 않습니다. 이 기능은 모든 개체의 속성을 읽는 데 사용됩니다. , 정의되지 않은 메시지가 표시됩니다.

결론

내 생각에 따르면, 변수와 객체의 쓰기 작업에는 일정한 유사점이 있습니다. 그러나 각각 읽기 작업에 대한 고유한 규칙이 있기 때문에 위의 문제가 발생합니다.
이런 식으로 다음 질문에 대한 답은 쉬워야 합니다.

if (!('a' in window)) {
  var a = 1;
}
alert(a);

기능

확장하자면, 함수. 위에서 언급한 사전 파싱을 기억하세요. 자바스크립트의 사전 파싱에는 var 변수의 사전 정의 외에도 함수 정의 추출도 포함되어 있습니다. 함수는 스크립트의 어느 위치에서나 정의할 수 있고 호출할 수 있습니다. 이전에 국한되지 않습니다.

그러나 함수를 정의하는 방법에는 var 메소드를 사용하여 함수를 선언하는 리터럴 정의라는 메소드가 포함됩니다

alert(typeof y3); //结果?
var y3 = function (){ console.log('1'); }

다음 규칙을 기억하세요. 호출은 명령문 뒤에 와야 합니다. 위 내용을 이해했다면 여기에 대한 답은 이미 명확해졌을 것입니다. 자바스크립트 엔진은 var를 사전 구문 분석할 때 초기 값으로 unundefined를 제공합니다. 이런 식으로 선언 전에 호출하면 자바스크립트 엔진은 아직 실제 값을 얻지 못하고 자연스럽게 "xxx는 함수가 아닙니다"라고 보고합니다. " 틀렸습니다. 이는 둘 다 함수 선언인 이유를 명확하게 설명하지만 하나는 선언 및 호출 순서와 관련이 있고 다른 하나는 그러한 제약 조건이 없습니다.

결론

js 실행 및 동적 수정의 결과인 함수이며 여전히 변수의 사전 구문 분석 규칙을 따릅니다(위 경고 시 리터럴 함수의 정보를 얻지 못했습니다).
둘이 섞이면 어떨까요? 아래를 보면 y4에 대한 변수와 함수가 모두 있습니다.

alert(typeof y4); //结果?
function y4(){
  console.log('y4')
}
var y4;

JavaScript 사전 파싱에서는 함수 선언 우선순위가 높기 때문에 y4는 당연히 함수형이지만 y4에 값을 할당한 후(현재 js 엔진이 실행 과정 중) js에 할당 작업을 수행합니다. 함수의 선언을 재정의합니다. 그래서:

alert(typeof y5);
var y5 = 'angle';
function y5(){
  console.log('ghost');  
}
alert(y5);

첫 번째 경고 결과는 js 실행 프로세스의 최상위에 있기 때문에 함수입니다. 두 번째로 경고할 때 해당 값은 5로 다시 작성되었습니다(아래 함수 정의 위치에 속지 마십시오.)

js의 파싱과 실행을 따로 생각해보니 갑자기 눈이 밝아지고, 저 글의 작성자가 말했듯이 "실행 환경을 이해하고 나면 객체를 호출하고, 클로저 패키지, 어휘 범위, 범위 체인과 같은 개념은 JS 언어의 많은 현상을 쉽게 해결할 수 있습니다. "

지금 보면 놀라운 것들이 많은 이 언어에도 그 유래를 추적할 수 있는 이유가 많이 있습니다.

더 나은 매개변수 판단 방법

위에서 많이 논의했는데, 어떻게 하면 JavaScript의 읽기와 쓰기가 고르지 않은데, 오류 보고 없이 매개변수 판단을 피할 수 있을까요?

예:

if(cusVar){ //这里的判断,是不是存在隐含的问题呢。 }

如何严谨一些呢。

if(window['cusVar']) { //保证它不报错。
  //或者这样的判断也是可行的 window.cusVar | typeof cusVar !== 'undefined'
  //干活咯
}

最后补充又一个小quiz, (理解 预解析与执行的分离)

var y7 = 'test';
function fun1(){
  alert(y7);
  var y7 = 'sex';
}
fun1();

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

希望本文所述对大家JavaScript程序设计有所帮助。

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.