es6 で導入されたスコープ

「ブロック レベル スコープ」は es6 で導入されました。es5 では、グローバル スコープと関数スコープのみです。es6 では、一対の中括弧で囲まれたスコープがブロック レベル スコープであり、関数がブロック レベルのスコープで宣言されている場合、関数宣言ステートメントは let と同様に動作し、ブロック レベルのスコープの外で参照することはできません。

このチュートリアルの動作環境: Windows 10 システム、ECMAScript バージョン 6.0、Dell G3 コンピューター。

es6 で導入されたスコープ

ES6 ではブロックレベルのスコープが導入され、関数をブロックレベルのスコープで宣言できるようになりました。 ES6 では、ブロックレベルのスコープでは関数宣言ステートメントが let のように動作し、ブロックレベルのスコープ外では参照できないと規定しています。

ES6 標準では、中括弧のペアで形成されるスコープがブロックレベルのスコープです。

ES5 では、関数はトップレベル スコープと関数スコープでのみ宣言でき、ブロックレベル スコープでは宣言できないと規定されています。

ES5 にはグローバル スコープと関数スコープのみがあり、ブロックレベルのスコープがないため、多くの無理なシナリオが発生します。

(1) 内部変数は外部変数を上書きする可能性があります。

    var tmp = new Date();
    function f() {
        console.log(tmp);
        if (false) {
            var tmp = 'hello world';
        }
    }
    f();//undefined

(2) カウントに使用したループ変数がグローバル変数に漏れる

    var s = 'hello';
    for (var i = 0; i < s.length; i++) {
        console.log(s[i]);//h e l l o
    }
    console.log(i);//5

変数 i はループの制御にのみ使用され、ループ終了後は消えませんそしてそれはグローバル変数にリークされます。

例は次のとおりです:

// 浏览器的 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

ES6 標準では、関数がブロック レベルのスコープで宣言された場合、関数宣言は var で宣言された変数とみなされ、ブロック レベル スコープの最上位に昇格されます。関数が変数として使用され、変数名が宣言されている場合、関数本体は宣言されません。上記のコードは次と同等です:

// 浏览器的 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

[関連する推奨事項: JavaScript ビデオ チュートリアル 、Web フロントエンド ]

以上がes6 で導入されたスコープの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。