LoginSignup
0
1

More than 3 years have passed since last update.

[Javascript] Const, Let, Varの違い(ES6関連)

Posted at

Javascriptの変数

Javascriptには、変数を宣言するキーワードのconstletvarがあります。
これらのキーワードは以下について違いがあります。

・初期値
・重複した値割り当て
・呼び出し範囲

まずconst, let, var すべての変数は下記のように
、コンマで区切って複数の変数を定義することができます。

const category= "header",
      key= "content-Type",
      value= "application/json";

Constについて

constは値が変わらない変数を宣言するキーワードです。
constは必ず初期値を設定しなければならず、
宣言した変数に対して、あとで値を割り当てることはできません。

const で宣言した変数に値を再度割り当てる場合には、
次のようなエラー(TypeError)が発生します。

const key = "content-Type";
key = "appId"; 
// Result => TypeError: invalid assignment to const 'key'

変数に値を割り付ける必要がない場合には、
const キーワードで変数宣言することを推奨します。

ループなどの繰り返しの途中で特定変数が参照する値を変えなければならないときがあります。
その場合は変数に再割り当てできるletキーワードで宣言します。

Letについて

letは初期値を指定しなくても大丈夫です。
初期値を指定しない場合、undefined 値に初期化されます。

let key;
// `key` is initialized `undefined`

letが宣言されたkeyという変数に"content-Type"という文字列を代入しています。

let key;
key = "content-type";

Varについて

var キーワードは初期値を宣言しなくてもよく、
値を再割り当てしても良いという点でletに似ています。
しかし、varキーワードは同じ名前の変数を定義し直すことができます。

letconstは同じ名前の変数を定義することができず、
次のような構文エラー(Syntax Error)が発生します。
したがって、ミスとして変数を二重に定義するミスを防ぐことができます。

let key;
let key; // => SyntaxError: redeclaration of let key

varの場合には、同じ名前の変数を定義し直すことができます。
これは間違いで同じ変数の名前で定義しても間違いはなく、
以前に宣言した値を閉じてしまいます。

var x = 1;
var x = 2;
// x is 2

letは、変数を宣言する前にその変数を参照するとReferenceErrorが発生します。

console.log(x); 
//ReferenceError: can't access lexical declaration `x' 
before initialization
let x = 1;

varは変数を宣言する前に、その変数を参照してもundefined値が割り当てられます。

console.log(x); // => undefined
var x = 1;

まとめ

JavaScriptは変数を宣言するキーワードとして、constletvarについてまとめました。

constは値を再割り当てできない変数を宣言する時に使用されます。
letvarは再割り当てできる変数を宣言することができ、
初期値を宣言しなくてもかまいません。
var の場合のみ、同じ値を重複宣言することができます。

const は再割り当て不可能な変数を定義するキーワードです。
再割り当てを禁止することで、誤って他の値を割り当てることで発生するバグを減らすことができます。

したがって、変数を宣言する場合には、まずconstで定義できないかを検討の上、
不可能な場合はletの使用をお勧めします。

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1