最近になって、Docker、Reactなどのフロントエンド技術を勉強し始めたのだが、Reactを扱うにあたって必須となるES6記法があやふやだったので、Progateで学び直した。
実務でJSを書く時は全てES5以前の記法で書いており、変数は全て「var」で宣言していたのだが、流石に時代遅れ感が否めないので、この機にES6へ書き直してみることにした。
今回はまず、ES6の変数(定数)宣言で新たに追加された「let・const」と「var」の違いについてまとめる。
ES5以前の変数定義:var
ES5以前では変数を宣言する場合、varを使う。
varは後からvarを使って同名の変数を同じスコープ内で再定義しても問題なく動作する。
var hoge = "abc";
// 再定義してもエラーにならない
var hoge = "def";
ES6の変数定義:let
ES6で変数を宣言する場合、letを使う。
letは変数の再定義が禁じられているため、誤って変数を上書きしてしまうことを予防することができる。
let hoge = "abc";
// 変数なので中身の書き換えはOK
hoge = "def";
// 再定義はエラーになる
let hoge = "def";
ES6の定数定義:const
ES6ではconstを使って定数を定義できるようになった。
const hoge = "abc";
// 定数なので書き換えはエラーになる。当然再定義も不可
hoge = "def";
ES6のletとconstにより、より他のプログラミング言語に近い感覚でコードを書けるようになった。
とりあえず現在のプロジェクトで書かれている古いコードを書き直し、実践で慣れるところから始めようと思う。