ホームページ > 記事 > ウェブフロントエンド > ES6 のブロックレベル スコープの詳細な紹介 (コード例)
この記事では、ES6 のブロックレベルのスコープに関する詳細な紹介 (コード例) を紹介します。必要な方は参考にしていただければ幸いです。
今日は、ES6 のブロックレベルのスコープについて説明します。
グローバル スコープと関数スコープ
ES5 には、グローバル スコープと関数スコープのみがあります。これにより、関数のスコープがグローバル スコープをカバーするか、ループ内の変数がグローバル変数にリークされます。
例:
// 1.函数作用域覆盖了全局作用域,发生了变量提升,函数声明大于var声明的变量,因此函数里面的a提到了前面,在打印a,初始化一个undefined给a,所以打印出了undefined。 var a = '1'; function fn() { console.log(a); if (3<2) { var a = 3; } } fn(); // undefined // 2.循环中的变量泄露为全局变量 for(var i=0;i<5;i++) { console.log(i); } console.log(i); // 5;
ES6 ブロック レベル スコープ
let コマンドを使用して新しいブロック レベル スコープを追加すると、外側のスコープは追加できません。内部スコープに移動すると、非常に安全かつクリアになります。外層と内層で同じ変数名を使用しても相互に干渉しません。
// 1.外层作用域无法获取到内层作用域 function fn1() { let a = 41; if(1 == 1) { let a = 3; console.log(2,a); // 2 3 } console.log(1,a); // 1 41 } fn1(); { { let food = 'apple'; } console.log(food); // Uncaught ReferenceError: food is not defined } { { let food = 'apple'; } console.log(food); // Uncaught ReferenceError: food is not defined } // 2. 外层和内层都使用相同变量名,也都互不干扰 { { let food = 'apple'; console.log(food); // apple } let food = 'orange'; console.log(food); // orange }
ブロック レベルのスコープと関数の宣言
ES5 では、関数はトップレベルのスコープと関数のスコープでのみ宣言でき、ブロック レベルで宣言することはできません。ドメイン。しかし、ES6 では、関数をブロック スコープで宣言できます。
しかし、関数宣言がコードの先頭に来るため、特定の問題が発生します。したがって、ES6 では関数を表すには関数式を使用することが最善です。
例:
//1.函数声明报错 { if (4 < 2) { function fn() { console.log('我在函数里面!'); } } } fn(); // Uncaught TypeError: fn is not a function //2.函数表达式没错 { let fa = '111'; let fn = function () { console.log('我在函数里面!'); } console.log(fa,fn); // 111 ƒ () { console.log('我在函数里面!');} }
注: ES6 のブロック レベルのスコープで関数を宣言できる条件は中かっこで囲む必要があります。そうしないとエラーが発生します。報告。
えええええ以上がES6 のブロックレベル スコープの詳細な紹介 (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。