プレゼンテーションシナリオ: スライド28、29、30

スライド28、29、30では、JavaScriptの変数宣言キーワードについて説明します。

JavaScriptはvar、let、constなどのキーワードを使用して変数を宣言します。

var（古い、あまり使われない）

varはJavaScriptで変数を宣言する古い方法です（ES6以前から存在）。

varで宣言された変数は関数スコープを持ちます（{}のペアに制限されません）。

プログラムを実行すると、JSは自動的にコードを実行する前にvarの宣言をスコープの先頭に移動します（これをホイスティングと呼びます）が、初期値はデフォルトでundefinedです。

例：

var city = "Ho Chi Minh";
console.log(city); // Ho Chi Minh

varは{}の外でも存在し使用できるため、現代のコードではvarはあまり使われず、代わりにletまたはconstが使用されます。

let（新しい、推奨）

letは、JavaScriptの新しいキーワードです（2015年、ES6で登場）。varの代わりに変数を宣言するために使用されます。これはvarの多くの欠点を克服します。

変数がプログラム内で存在し使用できる範囲（スコープ）：

letで変数を宣言すると、その変数は宣言された{ ... }のペアの内部でのみ存在します。
{ }の外に出ると、その変数は使用できなくなります。
varを使用すると、変数は{ }の外でも存在し使用できます。

例：

function demo() {
    var x = 1;  // var = function scope
    let y = 2;  // let = block scope
}
console.log(x); // 1
console.log(y); // Error

letは{ }ブロック内でのみ有効なので、関数の外（または宣言範囲の外）では変数yは存在しません → console.log(y)を呼び出すとReferenceErrorが発生します。

const（新しい、推奨）

constは、JavaScriptで定数を宣言するために使用されるキーワードです。つまり：一度変数に値を代入すると、その値を変更することはできません。

constを使用する際のルール：

constでは、宣言時に値を代入する必要があります。そうしないとエラーが発生します。
ブロックスコープ（{}内の範囲）を持ちます。つまり、letと同様に、constで宣言された変数は、宣言された{ ... }のペアの内部でのみ存在し使用できます。そのブロックの外では変数は存在しなくなります。
再宣言（redeclare）または再代入（reassign）はできません。

constで変数を宣言すると、その変数を別の値に再代入することはできません。ただし、ObjectまたはArrayの場合、constは：

変数を再代入できません。つまり、新しい値で変数を上書きすることはできません。
ただし、内部のコンテンツを変更（追加、編集、削除）することは可能です。

例：

function demo() {
    const x = 10;
    x = 20;  // ❌ Error: cannot reassign a const variable

    const arr = [1, 2, 3];
    arr[0] = 99;    // ✅ allowed: modify element inside array
    arr = [4, 5];   // ❌ Error: cannot reassign the whole array
}

このように、constでは変数xに値を再代入することはできませんが、配列の場合は内部の要素を変更でき、配列全体を新しく再代入することはできません。