JavaScript変數(shù)スコープと巻き上げの理解：包括的なガイド

プログラミングの礎(chǔ)石である可変スコープは、プログラム內(nèi)の変數(shù)のアクセシビリティを決定します。 このガイドは、変動する宣言方法、グローバル対ローカルスコープ、およびしばしば驚くべき巻き上げの概念をカバーするJavaScriptのスコーピングメカニズムを掘り下げます。これらの概念を習(xí)得することは、堅牢でエラーのないJavaScriptアプリケーションを構(gòu)築するために重要です。

重要な概念：

JavaScriptは、グローバルとローカルの2つの主要な範(fàn)囲タイプを採用しています。ローカルスコープは、さらに機能スコープ（

の場合）およびブロックスコープ（
• およびvar）に細分化されます。 letconst宣言は関數(shù)の上部に巻き上げられ、
と
• はブロックの上部に巻き上げられますが、「時間的なデッドゾーン」を作成します。 プログラム全體でアクセス可能なグローバル変數(shù)は、潛在的な競合と偶発的な上書きのために一般的に落膽します。 var関數(shù)宣言は完全に巻かれており、標(biāo)準(zhǔn)の巻き上げルールに付著する関數(shù)式とは異なり、定義の前に呼び出しを有効にします。 letJavaScriptのスコーピングおよび巻き上げルールの適切な理解と適用は、一般的な変數(shù)関連のバグを防ぎ、コードの信頼性を高めます。 const
• 可変スコープ詳細：
JavaScriptの変數(shù)の範(fàn)囲は、宣言の場所によって決定され、プログラム內(nèi)のアクセシビリティを定義します。 変數(shù)宣言には3つの方法が存在します：レガシー
• キーワードと最新の
および

キーワード。 一方、

は唯一のオプションでしたが、ES6以前、、はより厳格なルールを提供し、コードの信頼性を向上させます。

JavaScriptには、グローバルとローカルの2つの主要なスコープがあります。ローカルスコープは、さらに関數(shù)スコープ（

の場合）およびブロックスコープ（varおよびletの場合）に分岐します。 関數(shù)スコープは、ブロックスコープの特殊な形式です constvarグローバルスコープ：letconst

スクリプト內(nèi)の最も外側(cè)のスコープは、グローバルスコープです。ここで宣言された変數(shù)はグローバルになり、プログラムのどこからでもアクセス可能になります：

var let便利ですが、潛在的な競合と上書きにより、一般的にグローバル変數(shù)は落膽します。 const

ローカルスコープ：

ブロック內(nèi)で宣言された変數(shù)（例えば、、

、関數(shù)）は、そのブロックのローカルです。 関數(shù)は、

、

、および

// Global Scope
const name = "Monique";

function sayHi() {
  console.log(`Hi ${name}`);
}

sayHi(); // Hi Monique

で宣言された変數(shù)の範(fàn)囲を定義します。 コードブロックは、

および

のスコープのみを定義します。

は関數(shù)スコープに制限されています

letおよびconstブロックスコープを?qū)毪?、各ブロックの新しいローカルスコープを作成します。スタンドアロンブロックは、スコープも定義します：

// Global Scope
const name = "Monique";

function sayHi() {
  console.log(`Hi ${name}`);
}

sayHi(); // Hi Monique

ネストされたスコープが可能であり、內(nèi)側(cè)のスコープは外側(cè)のスコープからの変數(shù)にアクセスしますが、その逆ではありません。

スコープの視覚的メタファー：

世界を想像してみてください。國には國境（スコープ）があり、國內(nèi)の都市には獨自のスコープなどがあります。 グローバルな範(fàn)囲は、すべてを網(wǎng)羅する世界の海のようなものです。 この類推は、スコープの仕組みを示しています。変數(shù)の検索は、最も內(nèi)側(cè)のスコープで始まり、発見されるかエラーが発生するまで外側(cè)に進みます。このルックアップは、語彙（靜的）スコーピングと呼ばれます

巻き上げ：

JavaScriptの「ホイスト」メカニズムは、コンピレーション中に変數(shù)と関數(shù)宣言をスコープの上部に移動します。 ただし、宣言のみが巻かれています。割り當(dāng)てはそのまま殘っています。 これを考えてみてください：

出力は

{
  // standalone block scope
}

undefinedが宣言されているが、まだ割り當(dāng)てられていないためです。 エンジンはそれを次のように解釈します：state

console.log(state); // undefined
var state = "ready";

およびlet変數(shù)も巻き上げられますが、初期化されていないため、宣言の前に「時間的デッドゾーン」（TDZ）が生じます。 TDZ內(nèi)でそれらにアクセスすると、a const。ReferenceError

関數(shù)と巻き上げ：

関數(shù)宣言は完全に巻かれており、定義の前に通話を許可します。

ただし、関數(shù)式は、標(biāo)準(zhǔn)の巻き上げルールに従います（宣言が掲げられ、割り當(dāng)てが殘ります）。 クラスは、

変數(shù)と同様に動作します。

var state; // hoisted
console.log(state);
state = "ready";

let主要な違いとベストプラクティス：

：function-scoped。

• varおよび
：block-scoped。
• letすべての宣言は巻かれています。const
関數(shù)は変數(shù)の前に巻き上げられます。
関數(shù)宣言は、変動宣言よりも優(yōu)先されますが、割り當(dāng)てではありません。
• よくある質(zhì)問：

• 可変スコープとは？変數(shù)がアクセス可能な領(lǐng)域。
• グローバルvs.ローカルスコープ？グローバル：どこでもアクセスできます。ローカル：ブロックまたは関數(shù)に制限されています。
• ブロックスコープ？ブロックで定義されたローカルスコープ（およびletを使用）。 const
ホイストはどのように機能しますか？
• 宣言は範(fàn)囲の最上部に移動されます。
宣言と巻き上げの初期化？
• 宣言は巻き上げられており、初期化は殘っています。
and
• ？ ??hoistedで巻き上げられますが、初期化されていません。 TDZが適用されます let JavaScriptのスコーピングと巻き上げを理解することにより、開発者はよりクリーナー、より予測可能で、エラーが発生しやすいコードを書き込むことができます。 コードの組織と保守性を向上させるために、ブロックスコープ（constおよび）を活用することを忘れないでください。

以上がjavascript変數(shù)スコープと巻き上げを分類しますの詳細內(nèi)容です。詳細については、PHP 中國語 Web サイトの他の関連記事を參照してください。