【5分で学習】Javascriptの変数宣言の方法!varとletとconstの違い!

 変数の宣言は、どのプログラミング言語においても必須ですね。

 プログラミング言語では、ラベルを名前と呼び、箱にはそれぞれ型があります。そこに当てはめるものはです。しかし、初心者にとっては変数の宣言って理解がしにくいですよね。

JavaScriptで変数を宣言する方法を見てみましょう!

 

varで変数を宣言する

 varを使用して変数を宣言することはもう推奨されてありません。

varは関数スコープ!

 C言語などを使用している場合は、中括弧がいわゆるブロックを宣言していると理解している人はいると思います。 一般的な変数宣言はブロックスコープで行われます。(たとえば、中括弧の外側からは、その変数にアクセスできません)。 varは関数スコープです。つまり、varを使用した宣言は関数全体に認識されます。 関数の外部で宣言された場合でも、スクリプト全体で認識されています。逆に言えば、不要なエラーが発生する理由にもなってしまいます。

varは釣り上げられる

console.log(city);
var city = 'Takamatsu';
// -> undefined

 変数宣言される前に変数にアクセスすることができます。しかし、この例では値は保持していませんね。これをもっと詳しくすると、

var city;
console.log(city);
city = 'Takamatsu';
// -> undefined

 みたいな感じです。後から代入も可能です。

varは再代入可能

var a = 23;
var a = 42;
console.log(a);
// -> 42

 これは、厳密モードがオフの場合にのみ機能します。 varを操作するとエラーが発生しやすいというもう1つの例です。再代入することができてしまうので、間違えて変数の値を更新してしまう可能性があります。

letで変数を宣言する

 他のプログラミング言語も勉強している場合は、letは変数の宣言通りに動きます。 言い換えれば、letはブロックスコープといいます。 varとはまったく対照的に、letを使用して宣言した場合、変数は釣り上げられません。

console.log(city);
// -> ReferenceError
let city = 'Berlin';

 この場合は、varと違ってエラーになります。

 letを使用して宣言された変数のスコープを設定する場合は、新しい関数を宣言する代わりに、新しいブロックを作成します。 親スコープで宣言された変数は、子のスコープにも認識されます。

let a = 5;
{
console.log(a);
// -> 5
a = 7;
let b = 8;
}
console.log(a);
// -> 7
console.log(b);
// -> ReferenceError

 letは再宣言ができません。

let a = 5;
let a = 7;
// -> SyntaxError

constで変数を宣言する

 constは、多くの点でletに似ています。 しかし、letを使用した宣言とは異なる部分があるので、注意しましょう。

  • constを、値で初期化する必要があります
  • 別の値を割り当てることはできない

const a = [];
a.push(1,2,3);
console.log(a);
// -> [1,2,3]
const a = [];
a = [1,2,3];
// -> TypeError

 したがって、配列またはオブジェクトを割り当てた後でも、それを扱うことはできますが、初期化後に定数に新しい値を割り当てることはできません

まとめ

 今回の記事で推奨させてもらうのはconstを使う、その後にエラーが出たらletを使うということです。今日はvar let constの違いを知れたと思います。是非JaveScriptで宣言してみてください!