【JavaScript】変数を定義するとき var, let, constの違いは？

はじめに

JavaScriptを書く際に、変数定義する際にvarやletやconstを使うかと思います。
正直これの違いってよくわからないまま書いていたりしないでしょうか？

自分もなんとなくで使い分けてたりするわけですが、最低限エラーにはならないようにしたいものです。
そこでそれぞれの違いを少し丁寧に解説してみようと思います。

概要

まずはそれぞれの違いについて簡単に説明します。
一言で説明するとそれぞれ以下のような特徴があります。

var

再定義、再代入可能

let

再定義不可、再代入可能

const

再定義、再代入不可

もう少しわかりやすく

再定義とか再代入とか言われてもよくわからんと思うかもしれないです。

■ 定義
　定義とは変数の宣言のことで、varとかletとかconst〜と記述することです。
■ 代入
　代入とは一度宣言した変数に値を入れることです。

具体的にコードでみてみましょう。（JQueryを使って書きます）

jsファイル

$(function() {
  var varSample = "var1です"
  let letSample = "let1です"
  const constSample = "const1です"

  console.log(varSample) // var1です
  console.log(letSample) // let1です
  console.log(constSample) // const1です

  var varSample = "var2です" // 再定義可能
  let letSample = "let2です" // 再定義不可（エラーになります） 
  const constSample = "const2です" // 再定義不可（エラーになります）

  varSample = "var3です" // 再代入可能
  letSample = "let3です" // 再代入可能
  constSample = "const3です" // 再代入不可（エラーになります）
})

同じ変数名ではletは１回だけ使用可能、constは１回だけ使用可能で中身の変更は不可ということです。

補足

とりあえずvarを使っておけばエラーにはならないですが、letかconstのみで使い分けることが推奨されているようです。
確かに変数は再宣言する必要がないですし、上書きされたくない変数はconstを使って定数とすれば予期せぬエラーが起こりにくそうですね。
（以前書いた記事でvarを使ったことがあったので反省しておきます。）

変数にすべきか定数にすべきかの判断は、コードを書きながら「やっぱりこっち」みたいになるかと思いますが、その辺の感覚はだんだん鍛えていくしかなさそうです。

最後に

変数の違いが少し理解できたかと思うので、なるべくletとconstだけで使い分けて書けるようになりたいものです。ご意見あればコメントいただけると助かります。