2021年12月17日 JavaScript (JS Primer) 関数とスコープ
const, let , var再復習
const
値の再代入も同じ変数名での再定義もできません。
let
値の再代入はできるが、同じ変数名での再定義はできません。
var
値の再代入も、同じ変数名での再定義もできます。 しかし、値が簡単に書き換え可能なので、ほとんど使用しません。
| 値の再代入 | 同じ変数名での再定義 | |
|---|---|---|
| const | ❌ | ❌ |
| let | ⭕️ | ❌ |
| var | ⭕️ | ⭕️ |
関数宣言と巻き上げ
functionキーワードを使った関数宣言もvarと同様に、もっとも近い関数またはグローバルスコープの先頭に巻き上げられます。 以下の通り、関数の呼び出しは宣言より前に行うこともできます。
hello(); // => "Hello" function hello(){ return "Hello"; }
関数がスコープの先頭に巻き上げられて解釈されて実行されています。
- varで宣言された変数へ関数を代入した場合はundefinedとなり、関数の呼び出しエラーとなります。
[コラム] 即時実行関数
即時実行関数はletやconstとブロックスコープで置き換えられるため、現在では不要なものとなりましたので参考程度に紹介されています。
- 『即時実行関数』はその名の通り『即時実行される無名関数』です。
- グローバルに影響しない、ローカルのスコープを作り出しそのまま処理を実行することができます。
varとletのスコープについて理解が浅かったので深堀りしました。
| const | let | var | |
|---|---|---|---|
| 再宣言 | ❌ | ❌ | ⭕️ |
| 再代入 | ❌ | ⭕️ | ⭕️ |
| スコープ | ブロック | ブロック | 関数 |
| ホイスティング | エラー | エラー | undefined |
私の場合はスコープの認識が浅く腑に落ちていなかったです。
varではブロック内で宣言をするとグローバルスコープで宣言したかのように振る舞ってしまうため、わざわざ関数を定義する必要があり、即時実行関数を使っていましたが、constとletのスコープはブロックとなったため、即時実行関数を定義する事なく、グローバルスコープを汚さずに済む仕様になりました。
