スコープの名前検索

①現在のスコープを探す

一番優先されるのは、
参照箇所と同じスコープ内の変数です。

上の行から読み込んでいくので、
参照前に宣言だけでもしておく必要があります。（変数の基本）

①-A

以下の順番

1. 宣言
2. 代入
3. 参照
   →参照可

①-B

以下の順番

1. 参照
2. 宣言
3. 代入
   →ReferenceError発生

②親スコープを探す

参照しているスコープに、探している変数が見つからなかった場合、
その親スコープに探しに行きます。

スコープから外に出ているので、
宣言が参照箇所より下の行でも問題ありません。
ですが、実行箇所よりは上である必要があります。

②-A

関数の実行箇所よりも上の行で宣言
→参照可

test.js

function userName(){
    return firstName + " - " + lastName;
}

let firstName;
let lastName;

console.log(userName());
// undefined - undefined

②-B

関数の実行箇所よりも下の行で宣言
→ReferenceError発生

test.js

function userName(){
    return firstName + " - " + lastName;
}

console.log(userName());

let firstName = "Ringo";
let lastName = "Sheena";
// ReferenceError: Cannot access 'firstName' before initialization