ホームページ > 記事 > ウェブフロントエンド > JavaScript ES6におけるconst、let、varの比較を詳しく解説
この記事では主に JavaScript の const、let、var の比較に関する関連情報をサンプルコードを通じて詳しく紹介します。必要な方は参考にしてください。以下の編集者と一緒に見てみましょう。
ECMAScript 6 変数を宣言するための新しい const および let コマンドが追加されました。
宣言方法 | 変数プロモーション | スコープ | 初期値 | 重複定義 |
const | いいえ | ブロックレベル | 必須 | 許可されません |
させてください | いいえ | ブロックレベル | 必須 | 許可されない |
var | はい | 関数レベル | 不要 | 許可される |
変数プロモーション: constとlet最初の使用を宣言する必要があります。変数のプロモーションはサポートしていません
console.log(c1, l1, v1); // 报错 // Uncaught ReferenceError: c1 is not defined const c1 = 'c1'; let l1 = 'l1'; var v1 = 'v1';
スコープ: const、ブロックレベルのスコープをサポートし、変数のカバレッジを効果的に回避します
const c21 = 'c21'; let l21 = 'l21'; var v21 = 'v21'; if (0.1 + 0.2 != 0.3) { const c21 = 'c22'; let l21 = 'l22'; var v21 = 'v22'; console.log(c21, l21, v21); // 输出 c22 l22 v22 } console.log(c21, l21, v21); // 输出 c21 l21 v22
ブロックレベルのスコープ、内部変数は外側の層から直接アクセスできません
if (0.1 + 0.2 != 0.3) { const c22 = 'c22'; let l22 = 'l22'; var v22 = 'v22'; console.log(c22, l22, v22); // 输出 c22 l22 v22 } console.log(c22, l22, v22); // 报错 // Uncaught ReferenceError: c22 is not defined // 同样地, l22 is not defined
const は、値を割り当てることはできない定数を定義しますが、定数のプロパティには値を割り当てることができます
const c231 = {}; const c232 = []; c231.name = 'seven'; c232.push(27); console.log(c231, c232); // 输出 {name: "seven"} [27] // 禁止给对象赋值,应该使用 Object.freeze const c233 = Object.freeze({}); const c234 = Object.freeze([]); c233.name = 'seven'; // 普通模式下不报错 // 严格模式下报错 // Uncaught TypeError: Cannot add property name, object is not extensible c234.push(27); // 普通模式下就会报错 // Uncaught TypeError: Cannot add property 0, object is not extensible console.log(c233, c234); // 输出 {} []
グローバル変数は最上位の属性として設定されなくなりましたオブジェクト (ウィンドウ) を使用して、グローバル変数の汚染を効果的に回避します
const c24 = 'c24'; let l24 = 'l24'; console.log(c24, l24); // 输出 c24 l24 console.log(window.c24, window.l24); // 输出 undefined undefined
期待どおりの for ループ
for (var i = 0; i != 3; i++) { setTimeout(function() { console.log(i); },10); } // 依次打印 for (let i = 0; i != 3; i++) { setTimeout(function() { console.log(i); },10); } // 依次打印,为啥呢
let メソッドを使用して for ループ内で変数を宣言することが、期待どおりであることがわかります。
for ループ内で毎回 let が変数を再宣言します。JavaScript エンジンは最後のループの値を記憶しているため、初期化 i は前のラウンドに基づいて計算されます。
for ループには少なくとも 2 つのレベルのスコープがあることがわかります。以下の例を見ると理解しやすくなります。
for (let i = 0; i != 3; i++) { let i = 'seven'; console.log(i); } console.log('eight'); // 依次打印 seven seven seven eight
初期値: const 宣言された変数には初期値が設定されている必要があり、繰り返し代入することはできません。
const c3 = 'c3'; let l3 = 'l3'; var v3 = 'v3'; console.log(c3, l3, v3); // 输出 c3 l3 v3 c3 = 2; // Uncaught TypeError: Assignment to constant variable l3 = 2; v3 = 2; console.log(c3, l3, v3); // 输出 c3 2 2 const c32; // 报错 // Uncaught SyntaxError: Missing initializer in const declaration
定義の重複: const と let は繰り返しの定義をサポートしません
const と let は変数のスコープを減らし、変数の汚染を完全に回避します。パフォーマンスを向上させた。アプリケーションで変数を宣言するには、const および let を使用することをお勧めします。
概要
以上がJavaScript ES6におけるconst、let、varの比較を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。