2018年6月21日にプログラミング学習動画のドットインストールで、JavaScriptで学ぶFirebase入門というレッスンが公開されました。
“const”と”var” 2つの宣言子の使用例
[php]
const config = {
apiKey: "hogehogefugafuga",
authDomain: "myfirebasechatapp-hogehogefugafuga.firebaseapp.com",
databaseURL: "https://myfirebasechatapp-hogehogefugafuga.firebaseio.com",
projectId: "myfirebasechatapp-hogehogefugafuga",
storageBucket: "myfirebasechatapp-hogehogefugafuga.appspot.com",
messagingSenderId: "99999999999"
};
[/php]
その動画の中でオブジェクト変数である”config”を宣言するために”const”という変数宣言子が使われています。動画で「”const”はJavScriptの新しい記法である」とさらっと説明されています。
[php]
var config = {
apiKey: "hogehogefugafuga",
authDomain: "myfirebasechatapp-hogehogefugafuga.firebaseapp.com",
databaseURL: "https://myfirebasechatapp-hogehogefugafuga.firebaseio.com",
projectId: "myfirebasechatapp-hogehogefugafuga",
storageBucket: "myfirebasechatapp-hogehogefugafuga.appspot.com",
messagingSenderId: "99999999999"
};
[/php]
一方、GoogleのFirebaseで”Project Overview”を確認すると、導入用のスクリプトは変数宣言子として”var”が使われています。”var”はJavaScript学習者が必ず目にするおなじみの変数宣言子です。”const”と”var”はどのように違うのでしょうか?
“const”と”let”の特徴
“const“とはECMAScript6の規格で採用されている宣言子で、定数を宣言するための記法です。またECMAScript6の規格で新しく採用されている宣言子には”let“もあり、変数を宣言するための記法です。ECMAScript5の規格である”var”は、定数・変数の両方の宣言を兼ねた宣言子でした。
“const”宣言子の特徴
constはブロックスコープで再代入ができないローカル変数(定数)です。
[php]
const c = 1;
c = 2;
[/php]
const宣言子で代入された定数について、再代入をしようとするとエラーとして”Uncaught TypeError: Assignment to constant variable.“が表示されます。
[php]
const MY_ARRAY = [];
MY_ARRAY.push("A");
console.log(MY_ARRAY); // ["A"]
[/php]
ただし、定数の値がオブジェクト型のデータ型(配列やオブジェクト)の場合、その要素やプロパティの値を変更することは可能です。
“let”宣言子の特徴
letは波括弧内を変数の有効範囲とするブロックスコープで、使い方は基本的に”var”と同じです。
[php]
function letTest() {
let l = 1;
if (true) {
let l = 2;
console.log(l); // 2
}
console.log(l); // 1
}
letTest();
[/php]
ただしletはブロックスコープの変数であるため、”{}(波かっこ)”の中では変数の値が変わることはありません。
[php]function varTest() {
var l = 1;
if (true) {
var l = 2;
console.log(l); // 2
}
console.log(l); // 2
}
varTest();[/php]
一方varは波括弧内でブロックされませんので、波括弧の途中で変数の値が入れ替わることがあります