>웹 프론트엔드 >JS 튜토리얼 >JavaScript는 어휘 평가, 캐치 및 성능 문제를 속입니다.

JavaScript는 어휘 평가, 캐치 및 성능 문제를 속입니다.

黄舟
黄舟원래의
2017-02-28 14:58:471524검색

일반적으로 실행 컨텍스트의 범위 체인은 변경되지 않습니다

자바스크립트의 어휘 범위는 정적이 아닙니다
(어휘 범위/정적 범위: 범위는 함수에 의해 결정됩니다. 코드 작성 시 선언 위치)
어휘를 속일 수 있는 여러 가지 메커니즘이 있습니다
with(), eval() 및 try-catch 문의 catch 절이 있습니다
with와 eval이 있어야 하는 곳 사용하지 않음(많은 문제 발생)
어휘를 속인다는 것은 어휘 범위를 속이는 것을 의미합니다
즉, 런타임에 범위 체인을 변경합니다
아래에서 설명하겠습니다. 어휘를 속일 수 있는 메커니즘

eval

eval() 함수는 문자열을 매개 변수로 받아들이고 문자열을 구문 분석하여 코드를 생성합니다

var a = 123;eval('console.log(a)');// 123

그래서 콘솔은 123을 인쇄했습니다.
eval 함수를 실행한 후
js 엔진은 이 코드가 동적으로 삽입되었고 스코프 체인이 수정되었음을 알지 못합니다
엔진은 평소와 같이 스코프 체인을 찾습니다
아래 코드를 참조하세요

var a = 1;function demo(){
    eval('var a = 2;');//欺骗词法
    console.log(a);// 2}
demo();

eval 함수가 실행되면 변수 a가 데모 함수 실행 환경의 최상위 범위에 추가됩니다.
이 로컬 환경의 A는 전역 환경의 a를 "그림자"로 만듭니다.
궁극적으로 프로그램은 2를 인쇄하게 됩니다

eval() 함수는 현재 범위를 수정할 수 있을 뿐만 아니라 전역 범위도 수정할 수 있습니다.
무슨 일이 있어도 런타임에 어휘 범위를 수정할 수 있습니다

ES5의 엄격 모드 이 함수에 몇 가지 제한 사항을 추가했습니다. 위 코드

var a = 1;function demo(){    'use strict';    eval('var a = 2;');
    console.log(a);// 1}
demo();

에 로컬 엄격 모드를 추가했습니다. 이번에는 콘솔이 1을 인쇄한 것을 발견했습니다.
이는 엄격 모드에서 eval()이 자체적으로 독립적이기 때문입니다. 실행 시 어휘 범위(실행 환경의 범위 체인을 엉망으로 만드는 것을 방지하기 위해)
이런 방식으로 선언은 자신이 위치한 범위를 수정할 수 없습니다.

이것은 두 가지가 있습니다
타이머 setTimeout() 및 setInterval()과 매우 유사한 코드를 동적으로 생성하는 다른 방법입니다. 첫 번째 매개변수는 코드 문자열
일 수 있으며 함수 생성자 new Function()의 마지막 매개변수는 동일합니다. 코드 문자열
을 사용하는 것은 eval()과 동일합니다. 이 사용법은 심각한 성능 문제를 일으킬 수 있습니다. 이 문제는 나중에

에서 논의할 것이며 다른 하나는

입니다. 권장되지 않는 기만적인 어휘 구문은 with 키워드입니다.
with는 일반적으로 객체의 여러 속성을 반복적으로 참조하는 지름길로 사용됩니다.
장점은 객체 자체를 반복적으로 참조할 필요가 없다는 것입니다
. 예를 들어 재사용하려는 경우 콘솔 개체

console.log(1);console.info(2);console.warn(3);

는 with 키워드

with(console){    log(1);    info(2);    warn(3);
}

JavaScript는 어휘 평가, 캐치 및 성능 문제를 속입니다.

를 사용합니다. with에는 문제가 없는 것 같지만, 살펴보면 다음

function demo(obj){
    with(obj){
        a = 5;
    }
}var obj1 = {a:1};var obj2 = {b:2};

demo(obj1);
console.log(obj1.a);// 5demo(obj2);
console.log(obj2.a);// undefinedconsole.log(a);//5 -->变量a居然泄漏到了全局环境

에서 The 키워드를 사용하면 obj1
의 a가 수정되지만 obj2에 a가 추가되지 않을 뿐만 아니라 부작용이 발생하고 전역
에 누출이 발생한다는 것을 알 수 있습니다. with는 객체를 완전히 분리된 어휘 범위로 처리할 수 있기 때문입니다(도메인 체인의 앞부분에 있는 범위에 넣음)
그래서 그 내부에서 실행이 발생합니다a = 5;
스코프 체인을 내려다보지만 그렇지 않습니다. 발견되었으므로 a 변수가 전역적으로 생성됩니다(var 선언 없이)

참고: with가 어휘 범위를 생성하더라도 with 내부의 일반 var 선언은 이 블록 범위로 제한되지 않습니다
즉, , with 외부 범위의 선언
이렇게

function demo(){
    var obj = {};    with(obj){        var b = 1;
        console.log(b); // 1
    }
    console.log(b); // 1}
demo();
console.log(b);// Uncaught ReferenceError: b is not defined

그리고 with 키워드는 단순히 ES5의 엄격 모드에서 사용할 수 없습니다
사용하려고 하면 다음과 같은 오류가 표시됩니다. this:

JavaScript는 어휘 평가, 캐치 및 성능 문제를 속입니다.

catch

eval 및 with 외에도 try-catch 문의 catch 절은 실행 환경의 범위 체인을 수정할 수도 있습니다.
try 코드 블록에서 오류가 발생하면 실행 흐름이 즉시 catch 절로 점프합니다
. 그런 다음 예외 객체를 변경 가능한 객체에 푸시하고 이를 범위 체인의 맨 앞에 놓습니다. 이는 다음과 매우 유사합니다. with
catch 절이 실행되면 범위 체인이 원래 상태로 복원됩니다.

그러나 eval 및 with와 달리 try-catch는 여전히 상대적으로 유용하며 필요하지 않습니다. (사용하지는 않았지만)

성능

스푸핑 어휘가 발생합니다. 성능 문제
js 엔진은 컴파일 단계에서 성능 최적화를 수행합니다. 코드 어휘를 기반으로 정적 분석을 수행하는 기능
식별자를 빠르게 찾기 위해 변수와 함수의 정의 위치가 미리 결정되어 있습니다.
그러나 eval이나 with는 식별자의 위치를 ​​결정할 수 없습니다. 정적으로 분석됨)
즉, eval과 with 앞에서 js 엔진의 모든 최적화는 의미가 없습니다. (간단히 멋지네요)
무의미하므로 js 엔진이 단순히 승리합니다. 최적화하지 마세요
이로 인해 프로그램이 더 느리게 실행됩니다

의 경우 고유한 성능 문제도 있습니다...
범위가 생성되어 함수의 모든 지역 변수가 발생합니다. 체인 객체의 두 번째 범위에 위치
액세스 비용이 더 높습니다

try-catch 문을 사용하려면 이렇게 하면 됩니다

try{    ...}catch(e){
    handleError(e);
}

catch 문에서 코드 조각만 실행되고 오류를 처리하는 함수에 위임됩니다
이 방법으로 지역 변수에 액세스할 수 없습니다
스코프 체인의 일시적인 변경은 성능에 영향을 미치지 않습니다

요약

요점 요약

  • 어휘 범위란 코드 작성 시 함수 선언 위치에 따라 범위가 결정되는 것을 의미합니다.
    컴파일 타임 어휘 분석 단계에서는 모든 식별자가 어디에 어떻게 선언되었는지 알 수 있습니다

  • eval은 코드 문자열에서 평가될 수 있으므로 런타임에 어휘 범위를 수정합니다.

  • 객체 참조를 범위로 처리하여 런타임에 어휘 범위가 생성됩니다.

  • eval은 엄격 모드에서 독립적인 어휘 범위를 생성하며 범위를 수정할 수 없습니다.

  • 엄격 모드에서는 With를 사용할 수 없습니다

  • eval 및 with(및 catch)는 실행 중에 어휘를 속이고 범위 체인을 수정할 수 있습니다.

  • eval 및 with는 js 엔진을 작동할 수 없게 만듭니다. 컴파일 단계에서 범위 검색을 최적화하여(정적으로 분석할 수 없음) 프로그램 속도를 저하시킵니다

너무 많이 말했지만 with 키를 사용하지 말라고 모든 사람에게 말하고 싶습니다. 단어 및 eval 함수 ~( ̄0 ̄)/

위 내용은 JavaScript를 속이는 lexical eval, with 및 catch 내용과 그 성능 문제에 대한 내용입니다. 자세한 내용은 PHP 중국어 홈페이지( www.php.cn)!


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