JavaScript 사전 컴 파일 원리 분석

오늘 은 많은 시간 을 써 서 역할 영역, 사전 컴 파일 등 지식 을 복습 하고 박문 을 많이 읽 었 다. 예전 에 본 책 (많은 책 들 이 사전 컴 파일 을 하지 않 은 것 같다) 을 뒤 져 보 니 처음에 자신 이 잘 배 웠 다 고 생각 했 지만 사실은 사고 잘못된 부분 (많은 박문 들 이 오도 성 을 가지 고 있다) 이 존재 한 다 는 것 을 알 게 되 었 다.오늘 밤 은 어 지 러 운 생각 을 정리 하고 먼저 사전 컴 파일 된 지식 을 정리 하 자. 나중에 시간 이 있 으 면 역할 영역 을 상세 하 게 설명 하 자.
여러분 은 이 사전 컴 파일 과 전통 적 인 컴 파일 은 다르다 는 것 을 알 아야 합 니 다.코드 생 성 이 라 든 지 나중에 시간 이 나 면 제 가 이해 하 는 JS 프 리 컴 파일 을 공유 해 드 리 겠 습 니 다.
자 바스 크 립 트 3 부작 실행
스 크 립 트 실행 js 엔진 은 무엇 을 했 습 니까?

문법 분석

사전 컴 파일

해석 집행

코드 를 실행 하기 전에 두 단계 의 문법 분석 이 간단 합 니 다. 바로 엔진 이 당신 의 코드 에 저급한 문법 오류 해석 이 있 는 지 확인 하 는 것 입 니 다.
JS 사전 컴 파일 은 언제 발생 합 니까?
제 가 처음에 사고 오류 도 여기 서 발생 했 습 니 다. 사전 컴 파일 이 언제 발생 했 는 지 여러분 들 이 위의 운행 과정 에 오해 가 생기 지 않 기 를 바 랍 니 다. 사전 컴 파일 은 script 내 코드 블록 이 실행 되 기 전에 발생 한 것 이 라 고 착각 합 니 다. 사전 컴 파일 은 확실히 script 코드 가 실행 되 기 전에 발생 했 지만 대부분 함수 가 실행 되 기 전에 발생 합 니 다.
JS 사전 컴 파일 인 스 턴 스
예 를 들 기 전에 먼저 이 몇 가지 개념 을 생각해 보 자.

변수 성명 var...

함수 성명 함수...

<script>
    var a = 1;//     
    function b(y){//    
        var x = 1;
        console.log('so easy');
    };
    var c = function(){//            ！！
        //...
    }
    b(100);
script>
<script>
    var d = 0;
script>

엔진 이 이 코드 에 대해 무엇 을 했 는 지 보 여 주세요.

페이지 가 생기 면 GO 전역 대상 (Global Object) (즉, 모두 가 알 고 있 는 window 대상)

을 만 들 었 습 니 다.

첫 번 째 스 크 립 트 파일 불 러 오기

스 크 립 트 를 불 러 온 후 문법 이 합 법 적 인지 분석 합 니 다

사전 컴 파일 시작

변수 성명 을 찾 습 니 다. GO 속성 으로서 undefined

값 을 부여 합 니 다.

함수 성명 을 찾 습 니 다. GO 속성 으로 함수 체

를 부여 합 니 다.

//   
GO/window = {
    //      GO  ，   document、navigator、screen    ，    
    a: undefined,
    c: undefined，
    b: function(y){
        var x = 1;
        console.log('so easy');
    }
}

실행 코드 해석 (실행 함수 b 까지)

//   
GO/window = {
    //            
    a: 1,
    c: function(){
        //...
    },
    b: function(y){
        var x = 1;
        console.log('so easy');
    }
}

함수 b 를 실행 하기 전에 사전 컴 파일 이 발생 합 니 다.

AO 이벤트 대상 만 들 기 (Active Object)

형 삼 과 변수 성명 을 찾 습 니 다. 값 은 undefined

를 부여 합 니 다.

실제 인삼 값 부 여 된 형 삼

함수 성명 찾기, 값 부여 함수 체

//   
AO = {
    //  AO  ，   arguments    ，    
    y: 100,
    x: undefined
}

실행 함수 의 코드 해석

첫 번 째 스 크 립 트 파일 이 실행 되 었 습 니 다. 두 번 째 스 크 립 트 파일 을 불 러 옵 니 다

두 번 째 스 크 립 트 파일 을 불 러 온 후 문법 분석

문법 분석 이 끝나 면 사전 컴 파일 을 시작 합 니 다.

최초의 사전 컴 파일 절 차 를 반복 합 니 다.

사전 컴 파일 단계 에서 변수 성명 과 함수 성명 이 발생 하고 초기 화 행위 (할당) 가 없습니다. 익명 함수 가 사전 컴 파일 에 참여 하지 않 고 해석 실행 단계 에서 만 변 수 를 초기 화 할 수 있 습 니 다.
총결산
사전 컴 파일 (함수 실행 전) ※ 1. AO 대상 (Active Object) 만 들 기 2. 함수 형 참 및 함수 내 변수 성명 찾기, 형 참 명 및 변수 명 은 AO 대상 의 속성, 값 은 undefined 3. 실 삼 형 참 이 통일 되 고 실 삼 값 은 형 삼 에 부여 4. 함수 성명 찾기, 함수 명 은 AO 대상 의 속성, 값 은 함수 참조
사전 컴 파일 (스 크 립 트 코드 블록 script 실행 전) 1. 전역 변수 성명 찾기 (암시 적 전역 변수 성명 포함, var 성명 생략), 변수 명작 전역 대상 의 속성, 값 은 undefined 3. 함수 성명 찾기, 함수 이름 은 전역 대상 의 속성, 값 은 함수 참조
사전 컴 파일 이 이해 향상 행위, this 지향, 역할 영역 과 성능 등 문제 에 큰 도움 이 되 었 음 을 이해 한 후에 저도 이런 문 제 를 정리 하 겠 습 니 다.
= = 홈 페이지 전송 게 이 트 = =