이번에는 기본 JavaScript 지식 요약을 가져오겠습니다. 총 11개의 지식 포인트가 있습니다. (8) 사전 컴파일 실행 과정을 살펴보겠습니다.
JS running trilogy
1단계: 구문 분석
2부: 사전 컴파일
3부: 해석 및 실행
사전 컴파일
구문 분석은 의미 분석이라고도 하며 구문 분석은 기사 전체입니다. 예를 들어, 여러 줄의 코드를 작성했는데, 이러한 코드가 실행되면 한 줄씩 해석되어 실행됩니다. 그러나 실행 전에 시스템은 실행 첫 번째 단계에서 해당 코드를 스캔하여 해당 코드가 있는지 확인합니다. 예를 들어 대괄호, 한자 등이 적은 경우 전체 텍스트를 스캔하지만 실행하지 않습니다. 이 프로세스를 스캔 후 구문 분석이라고 합니다. 전체 텍스트를 미리 컴파일한 후 한 줄 해석한 후 실행합니다. 한 줄, 즉 설명과 실행입니다.
사전 컴파일 전주곡imply global 暗示全局变量: 即任何变量,如果变量未经声明就赋值,自变量就位全局对象所有 eg : a = 123; eg : var a = b = 123;선언된 모든 전역 변수는 모두
eg:var a = 123;===> window.a = 123; //例子: function test (){ console.log("a"); } test();//成功打印出a, box();//写在方法之前也成功打印出a,为什么能执行就是有预编译的过程 function box (){ console.log("a"); } var a =123; console.log(a);//输出123 console.log(a);//输出undefined,不报错; var a = 123; //但是如果直接打印会报错; console.log(b)//报错 //也是预编译的效果 //如果想偷懒记住两句话 //函数声明整体提升 //变量 声明提升개선 사항을 설명합니다. 함수 선언: 함수 선언을 작성하면 어디에 작성하든 시스템은 항상 이 함수를 로직 맨 앞으로 가져옵니다. 따라서 어디에서 호출하든 위 또는 아래에서 호출되든 본질적으로 함수 아래에서 호출되며 항상 함수 선언을 승격합니다. 논리 앞쪽으로 이동변수 선언이 개선되었습니다. 예를 들어var a = 123;//사실 이는 다음의 두 부분입니다. var a;//변수를 먼저 선언
a = 123;//변수에 값을 할당
function a(a){ var a = 123; var a = function(){ } a(); }var a = 123;이 두 문장으로는 해결할 수 없습니다 위를 설명하기 전에 먼저 impiy global이 무엇인지 이해해야 합니다imply globala: Imply global 변수: 즉, 변수에 선언되지 않고 값이 할당되면 독립 변수가 모든 전역 개체를 대신하게 됩니다.eg: a = 123 eg: var a = b = 123;
a = 10; console.log(a); // 10을 인쇄한 다음 window 속성에 10을 갖습니다. var b = 20; // Window에도 전역 도메인인 bwindow가 있다고 선언했습니다.
공식적으로 사전 컴파일됨
AO 객체 생성
형식 매개변수 및 변수 선언을 찾고, 변수 및 형식 매개변수 이름을 AO 속성 이름으로 사용하며, 값은 정의되지 않습니다.
실제 매개변수 값과 형식 매개변수 변경 Unify
Look 함수 본문에 함수 선언을 하고 함수 본문에 값을 할당합니다
function fn (a){ console.log(a); var a = 123; console.log(a); function a (){}; console.log(a); var b = function (){ } console.log(b); } fn(1);
이 예에서는 매개변수, 변수, 함수 이름을 모두 a라고 합니다. 일단 덮어쓰기 현상이 확실합니다. 이는 이전과 매우 모순됩니다. 함수가 실행되기 직전에 사전 컴파일을 수행한다고 합니다.
먼저, 사전 컴파일
입니다. 첫 번째 단계: AO 객체 생성, 전체 이름은 Activation 객체가 범위이며 실행 컨텍스트라고도 함
AO{ }
2단계: 형식 매개변수 및 변수 선언 찾기, 변수 및 형식 매개변수 이름을 AO 속성 이름으로 사용 값이 정의되지 않았습니다
AO{ a : undefined b : undefined }
3단계: 실제 매개변수 값 변경 형식 매개변수로 통합
AO{ a : 1; b : undefined }
4단계: 함수 본문에서 함수 선언을 찾아 함수 본문에 값을 할당합니다
AO{ a : 1, b : undefined, //b是是函数表达式,不是函数声明,所以不变 //然后有a了 有b了,然后将这个函数声明的名作为AO对象挂起来 d : }//然后值赋予函数体,也就是把a和b的属性值,变成函数体//覆盖掉a 和b的的属性值//也就变成下面的//因为第四步的优先级最高AO{ a : function a () {} b : undefined, //b是是函数表达式,不是函数声明,所以不变 d : function d () {} }
이 시점에서 pre -컴파일 과정이 끝나면 코드 실행을 시작하고 함수를 실행합니다
그런 다음 위의 예를 살펴보겠습니다
//预编译结果AO{ a : function a () {} b : undefined, d : function d () {} }//开始执行代码function fn (a){ //第一步开始打印a //根据上面预编译的结果, //所以打印结果是function a () {} console.log(a); //第二步执行 var a = 123; //因为在预编译的第二步里面,变量已经提升了 //所以第二步只执行的赋值 //a = 123;去AO对象里面去找a //也就变成 //AO{ //a : 123 这个才是a的存储值 //b : undefined, //d : function d () {} //} var a = 123; //所以打印出123 console.log(a); //因为这句在话在预编译的时候系统已经看了 //所以不在看这句话 function a (){}; //所以下面的console.log(a) //还是打印123; console.log(a); //一样下面的var b这句话在预编译的时候已经看了,所以不在看 //AO{ //a : 123 //所以b的值变成function(){} //b : function(){} //d : function d () {} //} var b = function (){ } //所以打印出function(){} console.log(b); }
fn(1);
예제를 살펴봅니다function test(a , b){ console.log(a); c = 0; var c; a = 3; b = 2; console.log(b); function b () {} console.log(b); }//这下我们就很快的得出打印的东西//a-->1//b-->2//b-->2
글로벌 컨텍스트의 첫 번째 단계는 GO 전역 개체를 먼저 생성하는 것이며 나머지는 동일합니다.
GO === window
그런 다음 질문은 GO 여부입니다. AO가 먼저 오거나 AO가 먼저 옵니다
GO를 먼저 실행하는 것이 정답입니다
이 기사의 사례를 읽은 후 방법을 마스터했다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
관련 자료:
JavaScript 기본 지식 요약(6) 함수, 초기 범위(1부)JavaScript 기본 지식 요약(6) 함수, 초기 범위(2부)
기본 JavaScript 지식 요약(7) Recursion
위 내용은 JavaScript 기본 지식 요약 (8) 사전 컴파일 실행 과정의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!