ホームページ > 記事 > ウェブフロントエンド > JavaScript ES6におけるconst、let、varの比較を詳しく解説
この記事では主に JavaScript の const、let、var の比較に関する関連情報をサンプルコードを通じて詳しく紹介します。必要な方は参考にしてください。以下の編集者と一緒に見てみましょう。
ECMAScript 6 変数を宣言するための新しい const および let コマンドが追加されました。
宣言方法 | 変数昇格 | スコープ | 初期値 | 重複定義 |
const | No | ブロックレベル | 必須 | 許可されない |
させてください | いいえ | ブロックレベル | 不要 | 許可されない |
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、定数に値を割り当てることはできませんが、定数のプロパティには値を割り当てることができます
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); } // 依次打印,为啥呢
for ループで let メソッドを使用すると、期待どおりに変数を宣言できることがわかります。
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 は変数のスコープを減らし、弱く型付けされた JavaScript の const 固定変数 (つまり、固定変数型) を完全に回避します。つまり、パフォーマンスは大幅に向上する可能性があります。アプリケーションで変数を宣言するには、const および let を使用することをお勧めします。
概要
以上がJavaScript ES6におけるconst、let、varの比較を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。