varとletの違いとは？変数と定数・JavaScriptでの使い分けもプログラマーがわかりやすく解説

ライター／woinary

某社で社内向け業務システムの開発、運用を30年近くやっていたシステム屋さん。現在はフリーランス。ガジェットやゲーム、ラノベが大好きなおっさんです。

JavaScriptのvarとletとの違いは？

image by iStockphoto

JavaScriptで変数を宣言する際に使うキーワードに「var」と「let」があります。どちらも同じように見えますが別の物です。元々はvarがあったのですが、なぜletが追加されたのか。まずはJavaScriptの歴史から解説していきます。

歴史が長いJavaScript

JavaScriptは1995年にウェブブラウザで様々な動きのあるウェブサイトを作るために開発されました。当初はシンプルな言語でしたが、ウェブサイトが広がるにつれて機能が強化されていきます。その結果、本格的なプログラミング言語として様々な分野で使われるほどに。

その間、バージョンアップも続き、JavaScriptのプログラミングの考え方や書き方も変化したのです。JavaScriptは新しい考えを導入する場合も、昔のプログラムも極力動くようにしています。その結果、昔からの書き方と最近の書き方が混在してしまうことに。その結果、分かりにくい部分が出てきてしまっています。

3分でわかる「Java」と「JavaScript」の違い！何で似た名前なの？文法や用途の違いも現役エンジニアがわかりやすく解説

JavaScriptとPHPの違いとは？仕組みや特徴もプログラマーがわかりやすく解説

変数を宣言するvarとletの違いは？

「var」も「let」も変数を宣言する際に使うキーワードです。細かい違いは後で説明しますが、ざっくりとした違いは下記の2点です。

1.varは昔からある書き方、letは新しい書き方
2.varは再宣言できる、letは再宣言できない

変数と定数とは？

image by iStockphoto

宣言の違いを見ていく前に、まずは変数と定数についておさらいしておきます。変数は「箱」に例えられることが多いです。プログラムの中で使う数値や文字列などを一時的に保持しておく箱というのが変数の説明になります。箱に対して物を自由に出し入れできるのと同じく、変数も中身を自由に書き換えることが可能です。

一方、変数と似ていますが、最初に宣言したら中身を変えることができないものが定数。一般的にプログラムの中に数値や文字列を直接書き込むことはよくないとされています。そのため、意味のある数値や文字列に名前をつけて自由に呼び出すことができるようにしたものが定数です。

// よくない例：「10」を直接記載←修正したい場合は3ヶ所要修正
let num = 10
if (num >= 10) {
console.log("10以上")
} else {
console.log("10未満")
}
// よい例：「10」を定数で宣言←1ヶ所直せば全体を1度に修正可
const MAX = 20 // 上限を指定する定数
let num = 15
if (num >= MAX) {
console.log(MAX,"より大きい")
} else {
console.log(MAX,"未満")
}

var：変数・過去の書き方

varは変数を宣言する昔からある書き方です。「var a」のように書いたり、中身を指定して「var a = 1」のように書きます。どちらもaという変数の宣言です。JavaScriptではvarやletを使わずに、いきなり「a = 1」と書いても動作します。ただし、わかりにくいため変数は必ず宣言するようにしましょう。

let：変数・現在の書き方

一方、letは新しい書き方です。使い方はvarと同じなので「let a」や「let a = 1」と書くことができます。現在、varは非推奨となっているので、特段の理由がない限りはletを使うのが正しいルールです。相違点は後で解説します。

const：定数・再代入できない変数

変数の次は定数です。定数の書き方もvarやletと同じように「const MAX = 10」のように書きます。中身は必ず必要です。また、定数の名前は他の変数と同じルールでつけますが、「MAX」のように大文字だけで書くことが慣例になっています。そうしなければいけないわけではないですが、変数は小文字だけ、定数は大文字だけ、と決めておくとわかりやすいです。

varとletは再宣言できる？letが推奨される訳とは？

変数と定数を見てきましたが、なぜletが必要なのかを解説します。その前に、まずは再宣言について。一度「var a = 0」と宣言した後に、また「var a = 10」と宣言することを再宣言と呼びます。varは再宣言できるのに対して、letは再宣言できない（エラーになる）というのが一番大きな違いです。

元々は再宣言に対して特にエラーにしていませんでした。しかし、すでに宣言している変数を誤って再宣言してしまうと不具合の原因になります。また、その原因を探すのも難しいので、再宣言できないように変更されました。ただ、varの動作を変えてしまうと既存のプログラムが動かなくなったり、異常動作してしまいます。そのため、varとは別に新しくletというキーワードを作ったのです。

varとletはどう使い分ける？

image by iStockphoto

varとletについて見てきましたが、どう使い分けるのでしょう？また、他の言語ではどうなっているのでしょう？続いてその点を解説していきます。

varは過去のもの、これからはlet

すでに説明した通り、varでの変数宣言は昔のプログラムを動かすためにあるので、基本的には利用しないことが推奨されています。ただ、違いは再宣言の可不可以外にも。まず、変数が有効な範囲がvarでは関数の中全体ですが、letでは{と}で囲まれた範囲という違いがあります。また、varでの変数宣言はプログラム中のどこに書いても、必ず関数の先頭で書いたものとみなされますが、letはそうではありません。

どうしてもvarを使いたい場合には使うことは可能です。ただし、他の書き方がないか十分に検討して使用してください。

最近の流行はconst

また、最近のJavaScriptの書き方では、なるべくletでの変数宣言を使わずに、constでの定数宣言を使うことが推奨されています。なぜならば、変数は自由に変更できると説明しましたが、プログラムのミスなどで本来変更したくない場合でも変更できてしまうためです。その意図しない変更を防ぐために定数を使うことを推奨しています。

昔のコンピュータは使える容量が小さかったので、変数を少なくして使い回すことが多かったのです。しかし、現在は容量も大きくなったので、必要に応じて定数を宣言して変更が必要なものなのか、不要なのかをわかりやすくするようにプログラミングの考え方も変化しています。

他の言語では意味が違う

JavaScriptについてvarとletの違いを見てきましたが、他のプログラミング言語ではどうでしょう。多くのプログラミング言語に変数と定数の考え方があります。ただ、その宣言方法はプログラミング言語によってまちまちです。

例えば、アップルがiPhoneやiPad、Mac用のアプリ開発用に公開しているプログラミング言語がSwift。Swiftではletは定数の宣言、varは変数の宣言となっています。また、Pythonでは変数の宣言にletもvarも使いません。「a = 0」のように書くだけです。さらにPythonには定数がありません。ただし変数は小文字、定数として使う変数は大文字という慣例は他のプログラミング言語と同じです。