変数 - Javascript

変数の宣言

let を使うと初期値がない変数や値の再代入が可能な変数を宣言できます。

let str = "a";
console.log(str); // 結果  a

// --------------------------------------

let name;
name = "太郎";
console.log(name);

一度、宣言された変数と同じ変数名を定義することはできません。

let str = "a";
let str = "b";

console.log(str);

// 結果
SyntaxError: Identifier 'str' has already been declared

変数をまとめて設定するには、カンマで区切り１行で定義することができます。

let name = "太郎", age = 28
console.log(name);
console.log(age);

定数の宣言

const を使うと定数を宣言できます。一度、宣言された定数に値の再代入することはできません。

const str = "a";
str = "b";

console.log(str);

// 結果
TypeError: Assignment to constant variable.

変数の命名規則

変数名のことを識別子と言う場合もあります。変数の命名規則を無視するとエラーが発生します。

変数の命名規則には次のような物があります。

  • 予約語は使用しない
  • 1文字目は、アルファベットかアンダースコアかドル記号のいずれかで始める
  • ２文字目以降は、アルファベットかアンダースコアかドル記号か数字のいずれかが使用できる
  • 大文字と小文字は区別される

var

var は、値の再代入が可能な変数を宣言できます。 var の使い方は let とほとんど同じです。

var には同じ名前の変数を再定義できてしまう為、間違えて変数を二重に定義してしまうミスが生じることがあります。また、変数の巻き上げという意図しない挙動があります。

var を利用するのを避け let や const 利用したほうがよいでしょう。

変数名をつける時の留意点

  • 名前からデータを類推しやすい
  • 長すぎず、短すぎず、だいたい 8 ～ 20 文字
  • 紛らわしくない
  • 1 文字目のアンダースコアは、特別な意味を持つ場合があるので利用しない
  • 決められた記法で統一する
  • 基本的には英単語にする
記法 概要 例
camelCase 記法 先頭単語の頭文字は小文字、それ以降の単語の頭文字は大文字 firstName
Pascal 記法 すべての単語の頭文字は大文字 FirstName
アンダースコア記法 すべての単語は小文字、単語同士は「 アンダースコア 」でつなぐ first_name

ブロックスコープ

ブロックの中で宣言された let 変数は宣言されたブロック内でのみ有効になります。

次の場合は、ブロックの外で変数 num を呼び出しているため、エラーになります。

if(true){ let num = 10;}

console.log(num);

// 結果
ReferenceError: num is not defined

次の場合は、同じ変数が宣言されていますが、ブロックの中の num はその中でのみ有効なので、エラーになりません。

let num = 5;

if(true){
    let num = 10;
}

console.log(num); # 5

分割代入

複数の戻り値を返す関数などでも利用します。

let [a, b] = [1, 2];

console.log(a);
console.log(b);

function hello(){
    const a = "hello";
    const b = "javascript";

    return [a, b];
}

let [a, b] = hello();
console.log(a);
console.log(b);