JavaScript 再入門(その5) 変数と宣言

変数と宣言

JavaScriptで新しい変数を宣言するのには、 var / const*ES2015 / let*ES2015 の3つがあります。
const と let はブロックレベルの変数を宣言することができます。

var

var は変数を宣言した関数内で使用できます。(関数スコープ)

function sampleFunc() {
	var funcVal = 'Function Value' ;
	console.log( funcVal ) ; // Function Value
}
sampleFunc() ;
console.log( funcVal) ; // スコープ外でエラーとなる ReferenceError: funcVal is not defined

関数内であれば、ブロック外でも参照可能です。
値が設定されるまでは undefined となります。

function sampleFunc() {
	console.log( val ) ; // undefined
	if (true) {
		var val = 'value' ; // ブロック内で宣言
		console.log( val ) ; // value
	}
	console.log( val ) ; // value
}
sampleFunc() ;

const

const は再代入できない変数です。
宣言したブロック内で使用できます。(ブロックスコープ *ES2015 )

const globalVal = 'Global const value' ;
if (true) {
	const localVal = 'Local const value' ;
	console.log( globalVal ) ; // Global const value
	console.log( localVal) ; // Local const value
}
console.log( globalVal ) ; // Global const value
console.log( localVal ) ; // スコープ外でエラーとなる ReferenceError: localVal is not defined
globalVal = 'ABC' ; // タイプエラーとなる Uncaught TypeError: Assignment to constant variable.

let

let は再代入可能な変数です。
宣言したブロック内で使用できます。(ブロックスコープ *ES2015 )

let globalVal = 'Global const value' ;
if (true) {
	let localVal = 'Local const value' ;
	console.log( globalVal ) ; // Global const value
	console.log( localVal) ; // Local const value
}
console.log( globalVal ) ; // Global const value
console.log( localVal ) ; // スコープ外でエラーとなる ReferenceError: localVal is not defined
globalVal = 'ABC' ;
console.log( globalVal ) ; // ABC

参考リンク

MDN 開発者向けのウェブ技術 > var
MDN 開発者向けのウェブ技術 > const
MDN 開発者向けのウェブ技術 > let
MDN 開発者向けのウェブ技術 > JavaScript のデータ型とデータ構造
MDN 開発者向けのウェブ技術 > JavaScript「再」入門