🐷

【JavaScript】変数宣言について

2023/10/27に公開

JavaScriptの勉強を始め、カリキュラムをただこなしていても頭に入った感覚がないのでここに書き出して復習します。

変数宣言の種類

JavaScriptの変数宣言は以下の3種類になります。

【ver】

var string = "HELLO"

【let】

let string = "HELLO"

【const】

const string = "HELLO"

JavaScriptで変数を宣言する際には、この3つを使用していくことになりますが、varを使用することは今ではほとんどないとのこと。これについては後程説明します。

それぞれの変数宣言の違いと特徴

再宣言の記述例

jsファイル
var nickname = "taro"
console.log(nickname)
var nickname = "ichiro"
console.log(nickname)
再宣言とは

一度、宣言した変数名で再度、変数宣言を行うことを再宣言といいます。
再宣言を行うことができるのはvarのみとなります。

再代入の記述例

jsファイル
var nickname = "taro"
console.log(nickname)
nickname = "jiro"
console.log(nickname)
再代入とは

変数に値を代入した後で、別の値を代入することを再代入と言います。
再代入はvarとletで、可能です。constでは再代入ができません。

スコープとは

変数にはスコープ(有効範囲)というものがあり、定義した変数の有効範囲になります。
グローバルスコープとローカルスコープが存在し、ローカルスコープには関数スコープ
ブロックスコープが存在します。

varのスコープ

varでは関数スコープ(ローカルスコープ)、グローバルスコープの変数を宣言できます。

グローバルスコープとは

グローバルスコープとはどこからでも参照できる変数です。
関数スコープは関数の中でvarによって宣言された変数です。
関数スコープの有効範囲は関数内になります。

letのスコープ

letではブロックスコープ(ローカルスコープ)の変数を宣言することができます。
ブロックとは() 、{}の組で区切られたものを指します。

constのスコープ

constのスコープはletと同じブロックスコープになります。

一覧表

var let const
再宣言 × ×
再代入 ×
スコープ 関数 ブロック ブロック

変数宣言の使い分け

変数宣言の際に意識すべきはスコープと再代入。
スコープが広いことで意図しないエラーが発生したり、期待通りの結果が得られないリスクが高くなり修正作業にも時間が消費してしまうため、スコープの広いvarを使用する場面がほとんどないとのこと。
上記の一覧でもわかるようにletは再代入が可能であり、constは再代入が不可能。
基本的には新たに値を代入する必要のないものをconstで宣言し、letは再代入をする場面でしようするものという認識。

まとめ

  • verを使用する場面はほとんどない
  • ループのための変数等やむを得ない場合を除き、できる限りconstを使用するほうがいいという流れがある。(constを使っていれば、長いコードでも宣言部分だけを見れば、ずっとそのコード中ではその値を保持していると分かり、保守や機能追加のコストが下がるため)

実践で使用していないため、復習していてもなんとなくでしかまだ理解ができませんが今後使用するようになった際に見返しやすいようこれからも小出しで書いていければと思います。

Discussion