JavaScript ES 新機能ブロックスコープ

JavaScript ES 新機能ブロックスコープ

序文:

ブロックレベルのスコープについて学ぶ前に、スコープについて理解しておく必要があります。スコープとは、コード内のメンバーが機能する範囲のことです。

1. ブロックスコープとは何ですか?

いわゆるブロックレベル スコープとは、変数が宣言されているコード ブロックまたはサブコード ブロック内でのみ使用できることを意味します。 ECMAScript 2015より前のバージョンにはブロックレベルのスコープはありません。ECMAScript ECMAScript 2015JavaScriptでブロックレベルのスコープを有効にする let キーワードが提供されています。サンプルコードは次のとおりです。

/*
 * ブロックレベルスコープではletキーワードのみ使用可能* letキーワードはブロックレベルスコープを宣言できるだけでなく、グローバルスコープや関数スコープでも使用可能*/
// グローバルスコープ let a = 100; // グローバル変数 (function () {
  // 関数スコープ let b = 200; // ローカル変数 })()
(真)の場合{
  // ブロックスコープ let c = 300; // ローカル変数 }
コンソールログ(a); // 100
console.log(b); // 例外をスローします console.log(c); // 例外をスローします

2. ブロックスコープが必要なのはなぜですか?

ECMAScript 5はグローバル スコープと関数スコープのみがあり、ブロック スコープはありません。この状況にはいくつかの問題があります:

ローカル変数はグローバル変数を上書きする可能性がある

var v = 100;
(関数(){
  console.log(v); // 未定義 
  var v = 200;
})


ループ本体でカウントに使用される変数がグローバル変数としてリークされる

// ループ本体を定義します for (var v = 0; v < 10; v++) {
  console.log("これは for ループです"); // これは for ループです * 10
}
コンソール.log(v); // 10

ループが完了した後に変数が手動で解放されない場合、そのライフサイクルはスクリプトとともに存続し、メモリを占有します。

3. 関数宣言あり

ECMAScript5標準では、関数はグローバル スコープと関数スコープでのみ宣言でき、ブロック スコープでは宣言できないと規定されています。

ケース1:

(真)の場合{
  関数 f() {}
}


ケース2:

試す {
  関数 f() {}
} キャッチ(e) {
  // ...
}

上記の 2 つの関数宣言は、 ECMAScript5によれば不正です。

ECMAScript 2015標準では、ブロック レベルのスコープ内で関数を宣言することはvarキーワードを使用することに似ていると規定されており、現在のブロック レベルのスコープ外からはアクセスできないことを意味します。

{
  関数fun() {
    console.log('これは楽しい');
  }
}
fun(); // これは楽しい
// 上記は次の関数と同等です {
  var fn = 関数() {
    console.log('これはfnです');
  }
}
fn(); // これはfnです
// let キーワードを使用すると、ブロックスコープ外からはアクセスできません {
  f = 関数() {
    console.log('これはfです');
  }
}
f(); // ReferenceError の例外をスローします: f は定義されていません

JavaScript ESの新しいブロックレベルスコープ機能に関するこの記事はこれで終わりです。ES の新しいブロックレベルスコープ機能の詳細については、123WORDPRESS.COM の以前の記事を検索するか、以下の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。

以下もご興味があるかもしれません:
  • JavaScript の基礎: スコープ
  • JavaScript 上級プログラミング: 変数とスコープ
  • JavaScript スコープチェーンの基本原理のグラフィカルな説明
  • JavaScript の静的スコープと動的スコープを例を使って説明します
  • Javascript のスコープとクロージャの詳細
  • JS の難しさ 同期と非同期、スコープとクロージャ、プロトタイプとプロトタイプ チェーンの詳細な説明
  • JavaScriptスコープについての簡単な説明

<<:  スパンの最小高さを定義するソリューションは効果がありません

>>:  Web でよく使われるフォントの紹介 (iOS および Android ブラウザでサポートされているフォント)

推薦する

VMware ESXi のインストールと使用記録(ダウンロード付き)

目次1. ESXiをインストールする2. ESXiをセットアップする3. ESXiを起動するESXi...

nginx設定ファイルの解釈の詳細な説明

nginx 設定ファイルは主に 4 つの部分に分かれています。 main{#(グローバル設定) ht...

VUE v-for の :key の詳細な説明

v-for タグにキーが追加されていない場合。 <!DOCTYPE html> <...

CentOS6.8 は cmake を使用して MySQL5.7.18 をインストールします。

オンライン情報を参考に、cmakeを使用してCentOS6.8サーバーにMySQL5.7.18をイン...

Linux で特定のユーザーにフォルダーのすべてのコンテンツを許可するにはどうすればよいですか?

【問題分析】 chown コマンドを使用できます。ここで ch は change (変更) を表し...

VMwareでCentOSがインターネットにアクセスできない問題を素早く解決

昨日、VMware に CentOS7 をインストールしました。Tomcat パッケージを転送するた...

MySQL データベースの大文字と小文字の区別の問題

MySQL では、データベースはデータ ディレクトリ内のディレクトリに対応します。データベース内の各...

Ubuntu 16.04 64ビット版を3つのステップで32ビットプログラムと互換性を持たせる

ステップ1: システムのアーキテクチャを確認する dpkg --print-architecture...

MySQL 最適化ソリューション リファレンス

最適化によって発生する可能性のある問題最適化は必ずしも単純な環境で実行されるわけではなく、実稼働環境...

Linux リモート コントロール Windows システム プログラム (3 つの方法)

場合によっては、Windows システム上のプログラムを Linux 上でリモートで実行する必要があ...

制限およびオフセット ページング シナリオを使用すると速度が遅くなるのはなぜですか?

質問から始めましょう5 年前、私が Tencent にいたとき、ページング シナリオでは MySQL...

円形/扇形メニューを2分で実装する方法を教えます(基本バージョン)

序文このプロジェクトでは円形のメニューが必要です。オンラインで検索しましたが、適切なものが見つからな...

Ubuntu環境でのSSHの詳細なインストールと使用

SSH は Secure Shell の略で、安全な伝送プロトコルです。Ubuntu クライアントは...

Vue の計算プロパティの詳細な説明

目次補間式方法計算された要約する今日は、Vue の計算プロパティについてお話ししましょう。計算プロパ...

MySQL スケジュールタスク (EVENT イベント) を詳細に設定する方法

目次1. イベントとは何ですか? 2. 「イベント」機能を有効にする1. 機能が有効になっているかど...