ECMAScript 5 엄격 모드, JSON 등의 새로운 기능

8267 단어 jsonmodeES5strict
원문: ECMAScript 5 Strict Mode, JSON, and More
앞서 ECMAScript 5′s의 Object와 Property 시스템을 분석했습니다.이것은 언어 발전의 새로운 방향이며 중점적으로 주목할 만하다.
또한 ECMAScript 5에는 API와 함께 주목할 만한 새로운 기능도 추가되었습니다.그 중에서 가장 큰 변화는 엄격한 모델과 원생적인 JSON 지원을 도입한 것이다.
엄격한 모드(Strict Mode)
ECMAScript 5의 엄격 모드는 전체 스크립트나 함수를 '엄격' 상하문에서 실행할 수 있도록 하는 새로운 기능입니다.'엄격'상하문은 특정한 행위를 막고 이상을 던진다(이 모델에서 사용자에게 더 많은 이상 정보를 피드백한다).
ECMAScript 5는 ECMAScript 3과 뒤로 호환되며, ECMAScript 3에서 사용되지 않는 모든 특성은 엄격한 모드에서 비활성화되거나 예외가 발생합니다.
엄격한 모델은 다음과 같은 몇 가지 장점을 가져왔다.
  • 흔히 볼 수 있는 인코딩 함정 몇 개를 포착하고 이상
  • 을 던졌다.
  • 비교적 안전하지 않은 코드의 운행이나 버퍼링을 막는다
  • 의심스럽거나 주도면밀하지 못한 언어 특성을 고려하는 것을 금지한다
  • 엄격한 모드에 대한 자세한 내용은 ES5 표준 설명서 235페이지를 참조하십시오.
    주의해야 할 것은 ECMAScript5의 엄격한 모드와 화성 브라우저의 엄격한 모드는 다르다는 것이다. (화성 브라우저의 주소 표시줄에 about:config를 입력하고 설정 페이지에 들어가서javascript.options.strict 옵션을 설정하여 브라우저의 엄격한 모드를 사용할 수 있다.)ES5의 엄격한 모델은 일련의 서로 다른 잠재적인 오류를 막는다. (화성 브라우저는 단지 일부 우수한 실천을 강제적으로 실시하는 것일 뿐이다.)
    어떻게 엄격한 모델을 사용합니까?
    간단해.프로그램 시작 부분에 다음 코드를 추가하면 엄격한 모드가 활성화됩니다.
    "use strict";
    

    또는 함수 맨 위에 추가하여 함수 범위 내에서만 엄격한 모드를 사용할 수 있습니다.
    function imStrict(){
      "use strict";
      // ... your code ...
    }
    

    엄격한 모드를 사용하기 위해 새로운 문법을 사용하지 않았습니다. "use strict"문자열을 간단하게 추가할 뿐입니다.이것은 스크립트에서 엄격한 모드를 사용할 수 있고, 구판 브라우저에 아무런 영향을 주지 않으며, 구판 브라우저는 안전하게 무시할 수 있다는 것을 의미한다.
    ECMAScript 5에는 새로운 구문이 거의 도입되지 않았습니다.이것은 어느 정도에 우아한 등급을 지원하는 ES5 스크립트를 작성할 수 있다는 것을 의미한다. 이것은 ES4에서는 지원할 수 없다.ES5 엄격 모드의 사용 방식은 우아한 강등의 좋은 예이다.
    외부 코드에 영향을 주지 않고 전체 자바스크립트 라이브러리를 엄격한 모드에서 실행할 수 있는 우아한 방법이 있습니다.
    // Non-strict code...
    
    (function(){
      "use strict";
    
      // Define your library strictly...
    })();
    
    // Non-strict code...
    

    많은 자바스크립트 라이브러리는 위의 방식(즉 패킷을 닫았다)을 사용하여 작성을 하는데 이런 쓰기 방법은 엄격한 모드가 가져오는 장점을 쉽게 사용할 수 있다.
    그러면 엄격한 모드를 사용하면 어떤 변화가 생길까요?
    변수 및 속성
    정의되지 않은 변수에 값을 부여하려고 시도합니다. 예를 들어foo="bar"는 실패합니다.이전 버전의 ES는 자동으로 이 속성을 전역 대상 아래 정의합니다. (예를 들어 window.foo) 현재 실행할 때 이상을 던집니다.이 변화는 짜증나는 버그를 분명히 피했다.
    메타데이터 writable에false로 설정된 속성에 값을 부여하고 메타데이터 configurable에false로 설정된 속성을 삭제하거나 메타데이터 extensible에false로 설정된 대상에 새 속성을 추가하면 오류가 발생합니다(속성의 메타데이터 설정 방법 등은 ECMAScript 5 Objects and Properties 참조).
    변수, 함수, 매개 변수를 삭제하면 오류가 발생합니다.
    var foo = "test";
    function test(){}
    
    delete foo; // Error
    delete test; // Error
    
    function test2(arg) {
          delete arg; // Error
    }
    

    대상의 직접량에서 속성을 중복 정의하면 실행할 때 이상이 발생합니다
    // Error
    { foo: true, foo: false }
    

    eval
    사실상, 'eval' 이라는 키워드를 사용하는 모든 방식은 금지되어 있다. 예를 들어 'eval' 함수를 변수에 값을 부여하거나 대상의 속성 이름으로 부여하는 것이다.
    // All generate errors...
    obj.eval = ...
    obj.foo = eval;
    var eval = ...;
    for ( var eval in ... ) {}
    function eval(){}
    function test(eval){}
    function(eval){}
    new Function("eval")
    

    또한 엄격한 모드에서는 eval 함수를 통해 새로운 전역 변수를 도입할 수 없습니다.
    eval("var a = false;");
    print( typeof a ); // undefined
    

    Functions
    arguments 객체를 다시 작성하면 오류가 발생합니다.
    arguments = [...]; // not allowed
    

    매개변수를 반복해서 정의하면 다음과 같은 오류가 발생할 수 있습니다.
    function( foo, foo ) {}
    

    엄격한 모드에서arguments에 접근합니다.caller와arguments.callee가 실행될 때 이상이 발생합니다.따라서 익명 함수를 참조하려면 다음과 같이 이름을 지정해야 합니다.
    setTimeout(function later(){
      // do stuff...
      setTimeout( later, 1000 );
    }, 1000 );
    

    엄격한 모드에서는 내장 함수의arguments와caller 속성을 제거합니다. 물론 이 두 속성을 정의할 수 없습니다.
    function test(){
      function inner(){
        // Don't exist, either
        test.arguments = ...; // Error
        inner.caller = ...; // Error
      }
    }
    

    마지막으로 오래된 버그는 null이나 undefined를 Function으로 사용합니다.prototype.call 또는 Function.prototype.apply 방법의 첫 번째 인자일 때 함수 내부의this는 전역 대상을 가리킨다.엄격한 모드로 이 행위를 막고 이상을 던진다.
    (function(){ ... }).call( null ); // Exception
    

    with(){}
    엄격한 모드에서 with 문장은 사용할 수 없습니다. 실제로 엄격한 모드에서 with 문장을 사용하면 실행할 때 문법 오류가 발생합니다.
    ECMAScript 5의 엄격한 모델은 실행할 때 행동의 변화를 많이 가져왔다(언어의 스타일 선호도를 강화했다. 예를 들어 with 문장을 제거하고 남겨진 언어 차원의 함정을 복원한다. 예를 들어 대상의 직접량에서 속성을 중복적으로 정의할 수 있다).개발자들이 이러한 변화를 어떻게 받아들이기 시작하고, 이러한 변화가 최종적으로 자바스크립트 개발에 어떻게 영향을 미치는지는 매우 흥미로운 일이다.
    JSON
    ES5 두 번째 주요 언어 특성은 네이티브 JSON 지원입니다.나는 이 특성이 마침내 표준의 일부분이 되어 매우 기쁘다.
    이와 동시에 JSON을 사용하는 프로그램을 Crockford의 json2로 옮기기 시작합니다.js상.json2.js는 ES5의 표준을 완전히 지원하고 원생 지원이 없을 때 우아하게 등급을 낮출 수 있다.
    JSON 대상은 두 가지 주요한 방법이 있는데 그것이 바로 JSON이다.parse(JSON 문자열을 JavaScript 대상으로 반서열화)와 JSON.stringify(JavaScript 객체를 JSON 문자열로 시리얼화)
    JSON.parse( text )
    JSON 문자열은 JavaScript 객체로 역정렬됩니다.
    var obj = JSON.parse('{"name":"John"}');
    // Prints 'John'
    print( obj.name );
    JSON.parse( text, translate )
    

    이 방법은 사용자 정의 반서열화나 대상 속성을 제거하기 위해 반서열화 함수를 전송하는 것을 지원합니다.
    function translate(key, value) {
      if ( key === "name" ) {
        return value + " Resig";
      }
    }
    
    var obj = JSON.parse('{"name":"John","last":"Resig"}', translate);
    // Prints 'John Resig'
    print( obj.name );
    
    // Undefined
    print( obj.last );
    JSON.stringify( obj )
    

    JavaScript 객체를 JSON 문자열로 시리얼화합니다.
    var str = JSON.stringify({ name: "John" });
    // Prints {"name":"John"}
    print( str );
    JSON.stringify( obj, ["white", "list"])
    

    시리얼화할 객체 등록 정보 목록을 시리얼화하도록 지정합니다.
    var list = ["name"];
    var str = JSON.stringify({name: "John", last: "Resig"}, list);
    // Prints {"name":"John"}
    print( str );
    JSON.stringify( obj, translate )
    

    사용자 정의 서열화 함수를 사용하여 서열화 대상을 사용합니다.
    function translate(key, value) {
      if ( key === "name" ) {
        return value + " Resig";
      }
    }
    
    var str = JSON.stringify({"name":"John","last":"Resig"}, translate);
    // Prints {"name":"John Resig"}
    print( str );
    JSON.stringify( obj, null, 2 )
    

    지정한 공백 수를 서열화 결과에 구분자로 추가합니다.
    var str = JSON.stringify({ name: "John" }, null, 2);
    // Prints:
    // {
    //   "name": "John"
    // }
    print( str );
    JSON.stringify( obj, null, "\t" )
    

    다른 문자열을 구분자로 사용합니다.
    var str = JSON.stringify({ name: "John" }, null, "\t");
    // Prints:
    // {
    \t"name": "John"
    } print( str );

    또 언어의 기본 유형에 새로운 방법이 추가되었지만 솔직히 말하면 이런 새로운 방법들은 그다지 재미있지 않다.String, Boolean, Number 대상의value Of 방법을 호출하면 대상의 원시 값을 직접 얻을 수 있고, Date의value Of는 toISOString 방법과 같은 결과를 되돌려줍니다.
    // Yawn...
    String.prototype.toJSON
    Boolean.prototype.toJSON
    Number.prototype.toJSON
    Date.prototype.toJSON
    

    .bind()
    Function.prototype.bind(thisArg, arg1, arg2….)
    언어 Function 객체에 새로 추가된 bind 메서드는 바인딩 함수라는 새 함수를 만듭니다.이 귀속 함수를 호출할 때, 귀속 함수는 그것을 만들 때 bind 방법을 전송하는 첫 번째 인자를this로 하고, bind 방법을 전송하는 두 번째 인자와 이후의 인자에 귀속 함수를 실행할 때 자체의 인자를 순서대로 원 함수로 호출합니다.
    var obj = {
      method: function(name){
        this.name = name;
      }
    };
    
    setTimeout( obj.method.bind(obj, "John"), 100 );
    

    Date
    이제 ISO 시간 형식 문자열을 사용하여 Date 인스턴스를 초기화하고 Date 객체를 ISO 시간 형식 문자열로 내보낼 수 있습니다.
    Date 객체 작성자는 먼저 ISO 시간 형식을 사용하여 날짜 문자열을 변환한 다음 다른 Date에서 사용할 수 있는 입력을 사용하여 변환을 시도합니다.
    Date 객체에 ISO 날짜 형식의 문자열을 출력하는 toISOString 메서드가 추가되었습니다.
    var date = new Date("2009-05-21T16:06:05.000Z");
    
    // Prints 2009-05-21T16:06:05.000Z
    print( date.toISOString() );
    

    .trim()
    string 기본은 Trim 메소드를 지원하며, Steven Levithan은 Trim 메소드를 심도 있게 분석합니다.
    Array
    JavaScript Array 객체의 확장 방법은 이미 오랫동안 존재해 왔고, 마침내 표준 문서의 일부분이 되었다.표준 문서가Array 대상에 새로 추가된 확장 방법은 indexOf,lastIndexOf,every,some,forEach,map,filter,reduce,andreduceRight입니다.
    또한 Array가 표준으로 추가되었습니다.isArray 방법은 객체가 배열 객체인지 여부를 판단하는 데 사용되며 다음 코드와 매우 비슷한 기능을 제공합니다.
    Array.isArray = function( array ) {
      return Object.prototype.toString.call( array ) === "[object Array]";
    };
    

    나는 이 모든 새로운 특성이 ES5를 매우 재미있는 가방으로 만들었다고 생각한다.이것은 ES4가 약속한 것처럼 앞서지 않고 규모가 크지만 수량이 상당히 많은 업데이트를 제공하여 뚜렷한 BUG 수량을 줄이고 언어 자체를 더욱 안전하고 효율적으로 한다.

    좋은 웹페이지 즐겨찾기