JavaScript 変数と定数のサンプル(ECMAScript 2015)

JavaScriptの変数と定数のサンプルです。
ECMAScript 2015対応です。

目次

ECMAScript (エクマスクリプト)

JavaScriptの標準の仕様です。
Ecma Internationalという標準化を行う団体が策定しています。

ECMAScript 2015は、ECMAScript 6、ES6とも呼ばれます。2015年に公開されました。

https://ja.wikipedia.org/wiki/ECMAScript

 

変数の宣言

変数の宣言は、変数の前にvarまたはletを付けます。

letはECMAScript 2015で使用できるようになりました。

<script>

	var i = 2;

	let j = 2;

</script>

 

varとletの違い

varとletの違いです。
letのスコープは、ブロック内のみです。ブロックとは、{ }で囲んだ箇所です。

4行目は、ブロック内でvarを宣言しています。
6,9行目とも値は表示されます。

13行目は、ブロック内でletを宣言しています。
15行目は値が表示されますが、18行目はブロックの外なのでエラーになります。

<script>

{
	var i;
	i = 1 + 2;
	console.log(i); //3
}

console.log(i); // 3


{
	let j;
	j = 1 + 2;
	console.log(j); //3
}

console.log(j); // Uncaught ReferenceError:j is not defined

</script>

 

変数を使用する時の注意点

変数の宣言をせずに(変数の前にvar/letをつけない)、その変数に値を代入すると、グローバル変数になってしまうので注意が必要です。

Strictモードであればエラーにしてくれるので、なるべくStrictモードを使用した方がよいです。
Strictモードを使用する時は"use strict";と記述します。

2行目は、Strictモードにしています。
3行目は、変数の宣言をせずに値を代入しようとしているのでエラーになっています。

<script>
	"use strict";
	i = 2; //Uncaught ReferenceError: i is not defined
</script>

以下は、MDNのStrictモードのページです。
https://developer.mozilla.org/ja/docs/Web/JavaScript/Strict_mode

 

定数の宣言

定数の宣言には、constを使用します。
constはECMAScript 2015で使用できるようになりました。

3行目は、constで宣言しています。一般的に定数名は全て大文字で書きます。
8行目は、定数に値を代入しようとしているのでエラーになります。

<script>

const COLOR1 = "red";

console.log(COLOR1); // red


COLOR1 = "blue"; //Uncaught TypeError: Assignment to constant variable.

</script>

関連の記事

JavaScript データ型

 はまったらエンジニア特化型Q&Aサイト
【teratail(テラテイル)】で質問しましょう!


△上に戻る