変数 スコープ

JSの変数には、スコープあります。

#①ブロックスコープ
ブロックスコープとは、関数やfor文、if文などで使われる{}の中で使われている変数です。これをブロックスコープといいます。このブロックスコープ内で宣言された変数をブロック外で呼び出そうとするとエラーが起きます。

#②関数スコープ
これは名前の通り、function() {}の中括弧内で使われた変数のことです。こちらも、関数内でのみ有効です。

またこれらの変数は、スコープ内の移動はが可能ですが、｛｝外では、無効になります。

#再宣言
スコープ内では変数を呼び出すことができます。しかし、スコープ内で、再宣言はできません。
例えば、極端な例ではありますが。

index.js

if (条件式) {
 let fruit = 'りんご';
 
 let fruit = 'バナナ';
}

これを再代入といいますが、これは、同じ階層のスコープ内なので呼び出すことができません。
ただし、同じ階層の再代入はできませんが、別の階層ならば可能です。

index.js

if (条件式) {
 let fruit = 'りんご';
 }
if (条件式){
 let fruit = 'バナナ';
}

この場合は、階層が違うので、変数の再宣言は成り立っています。

#巻き上げ
変数には、スコープがあり、更に階層が違えば使うことはできます。
しかし、違う階層で使ったとしても呼び出したあとにもう一度、再代入した場合。再代入された値が優先されます。

#グローバル変数
これは、スコープの外で宣言されたものを言います。
#ローカル変数
これは、スコープ内で宣言された変数を言います。

index.js

let fruit ;

if (条件式){
 let fruit = 'りんご';

 if(条件式) {
 let fruit = 'バナナ';
 }
}

let fruit;これがグローバル関数といいます。これは、スコープを気にせず使うことができます。
ただし、どこからでも書き換えられてしまいます。