es6 블록급 작용역 용법

2666 단어
// IIFE  
(function () {
  var tmp = ...;
  ...
}());

//  
{
  let tmp = ...;
  ...
}

블록급 작용역의 출현은 실제로 광범위하게 응용되는 즉각 실행 함수 표현식(IIFE)을 더 이상 필요로 하지 않게 한다.
function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    //  f
    function f() { console.log('I am inside!'); }
  }

  f();
}());

위 코드는 ES5, Jscript에서 블록 레벨 역할 영역 환경을 지원하지 않습니다. "I am inside!"를 얻을 수 있습니다.왜냐하면
if
내성명 함수f
함수 헤더로 올라가며 실제로 실행되는 코드는 다음과 같습니다.
// ES5/JScript , 
function f() { console.log('I am outside!'); }

(function () {
  function f() { console.log('I am inside!'); }
  if (false) {
  }
  f();
}());

ES6는 완전히 달라요. 이론적으로'I am outside!'('use strict'를 사용하여 es6 규범을 강제로 사용하면 위의 코드는 문제없습니다. 그렇지 않으면 아래에서 직면한 문제처럼)
블록급 작용역 내에서 성명된 함수는 let와 유사하기 때문에 작용역 외에 영향을 미치지 않는다.그러나 만약 당신이 정말로 ES6 브라우저에서 위의 코드를 실행한다면 오류를 보고할 것입니다. 이것은 무엇 때문입니까?
원래 블록급 작용역 내에서 성명된 함수의 처리 규칙을 바꾸면 오래된 코드에 큰 영향을 미칠 수 있다.이로 인해 발생하는 호환되지 않는 문제를 줄이기 위해 ES6는 부록 B에 브라우저의 실현은 위의 규정을 준수하지 않고 자신의 행위 방식을 가질 수 있다고 규정했다.
블록 레벨 역할 영역에서 함수를 선언할 수 있습니다.
함수 성명은 var와 유사하다. 즉, 전역 작용역이나 함수 작용역의 머리부분으로 올라간다.
또한 함수 성명은 블록급 작용역의 머리부분까지 올라간다.
상기 세 가지 규칙은 ES6의 브라우저에만 유효하고 다른 환경의 실현은 준수할 필요가 없으며 블록급 작용역의 함수 성명을 let로 처리하는 것을 주의하십시오.
이 세 가지 규칙에 따라 브라우저의 ES6 환경에서 블록 레벨 역할 영역에서 성명된 함수는 var 성명된 변수와 유사합니다.
//   ES6  
function f() { console.log('I am outside!'); }

(function () {
  if (false) {
    //  f
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function (  use strict)

위의 코드는 ES6에 맞는 브라우저에서 오류를 보고합니다. 왜냐하면 실제 실행되는 것은 아래의 코드이기 때문입니다.
//   ES6  
function f() { console.log('I am outside!'); }
(function () {
  var f = undefined;
  if (false) {
    function f() { console.log('I am inside!'); }
  }

  f();
}());
// Uncaught TypeError: f is not a function

환경이 초래하는 행위 차이가 너무 크다는 것을 감안하여 블록급 작용역에서 함수를 성명하는 것을 피해야 한다.만약 확실히 필요하다면, 함수 성명문이 아니라 함수 표현식으로 써야 한다.
//  
{
  let a = 'secret';
  function f() {
    return a;
  }
}

//  
{
  let a = 'secret';
  let f = function () {
    return a;
  };
}

또 주의해야 할 점이 하나 있다.ES6의 블록 레벨 역할 영역은 함수의 규칙을 설명할 수 있습니다. 괄호를 사용하지 않은 경우에만 성립되며, 괄호를 사용하지 않으면 오류가 발생합니다.
//  
'use strict';
if (true) {
  function f() {}
}

//  
'use strict';
if (true)
  function f() {}
이상은http://es6.ruanyifeng.com/#docs/let

좋은 웹페이지 즐겨찾기