5.1 グローバルスコープ
スコープ (scopes) は、プログラムの異なる部分での変数や関数の可視性を決定します。JavaScriptには、グローバル、ローカル、ブロックスコープの3つの主要なスコープがあります。これらのスコープを理解することは、データ管理を効率的に行い、コードのエラーを防ぐために重要です。
グローバルスコープ には、どの関数やコードブロックの外でも宣言されたすべての変数と関数が含まれます。これらの変数と関数は、コードのどこからでもアクセスできます。
例 1: グローバル変数の宣言
var globalVar = 'I am a global variable';
function showGlobalVar() {
console.log(globalVar); // グローバル変数へのアクセス
}
showGlobalVar(); // 出力: I am a global variable
console.log(globalVar); // グローバル変数へのアクセス
例 2: グローバル関数
この例では、変数 globalVar と関数 globalFunction() はグローバルスコープ内で宣言され、コードのどこからでもアクセスできます。
function globalFunction() {
return 'I am a global function';
}
console.log(globalFunction()); // 出力: I am a global function
5.2 ローカルスコープ
ローカルスコープ には、関数内で宣言された変数と関数が含まれます。これらの変数と関数は、その関数内でのみアクセスでき、その外ではアクセスできません。
例 3: ローカル変数の宣言
この例では、変数 localVar は関数 localScopeExample() 内で宣言され、その関数外ではアクセスできません:
function localScopeExample() {
var localVar = 'I am a local variable';
console.log(localVar); // ローカル変数へのアクセス
}
localScopeExample(); // 出力: I am a local variable
console.log(localVar); // エラー: localVar is not defined
例 4: ローカル関数
この例では、関数 innerFunction() は関数 outerFunction() 内で宣言され、 outerFunction() の外ではアクセスできません:
function outerFunction() {
function innerFunction() {
return 'I am a local function';
}
console.log(innerFunction()); // ローカル関数へのアクセス
}
outerFunction(); // 出力: I am a local function
console.log(innerFunction()); // エラー: innerFunction is not defined
5.3 ブロックスコープ
ブロックスコープには、コードブロック内で let および const を使用して宣言された変数が含まれます。 これらの変数は、そのブロック内でのみアクセスでき、外ではアクセスできません。
例 5: letでの変数宣言
この例では、変数 blockVar は if ブロック内で宣言され、その外ではアクセスできません:
if (true) {
let blockVar = 'I am a block-scoped variable';
console.log(blockVar); // ブロック変数へのアクセス
}
console.log(blockVar); // エラー: blockVar is not defined
例 6: constでの変数宣言
この例では、変数 i は for ブロック内で宣言され、その外ではアクセスできません:
for (const i = 0; i < 3; i++) {
console.log(i); // ブロック変数へのアクセス
}
console.log(i); // エラー: i is not defined
ブロックスコープの特徴
例 7: ネストされたブロック
この例では、変数 innerVar は内部ブロック内でのみアクセス可能で、変数 outerVar は外部と内部の両方のブロックでアクセス可能です:
if (true) {
let outerVar = 'I am in the outer block';
if (true) {
let innerVar = 'I am in the inner block';
console.log(outerVar); // 外部ブロック変数へのアクセス
console.log(innerVar); // 内部ブロック変数へのアクセス
}
console.log(outerVar); // 外部ブロック変数へのアクセス
console.log(innerVar); // エラー: innerVar is not defined
}
5.4 様々なスコープの相互作用
例 8: グローバルおよびローカルスコープの相互作用
この例では、関数 scopeExample() はグローバル変数 globalVar と自身のローカル変数 localVar にアクセスできます:
var globalVar = 'I am a global variable';
function scopeExample() {
var localVar = 'I am a local variable';
console.log(globalVar); // グローバル変数へのアクセス
console.log(localVar); // ローカル変数へのアクセス
}
scopeExample(); // 出力: I am a global variable
// I am a local variable
console.log(globalVar); // グローバル変数へのアクセス
console.log(localVar); // エラー: localVar is not defined
例 9: 関数スコープとの相互作用
この例では、関数スコープ arrowFunction() はグローバル変数 globalVar と自身のローカル変数 localVar にアクセスできます:
let globalVar = 'I am a global variable';
const arrowFunction = () => {
let localVar = 'I am a local variable in arrow function';
console.log(globalVar); // グローバル変数へのアクセス
console.log(localVar); // ローカル変数へのアクセス
};
arrowFunction(); // 出力: I am a global variable
// I am a local variable in arrow function
console.log(globalVar); // グローバル変数へのアクセス
console.log(localVar); // エラー: localVar is not defined
GO TO FULL VERSION