こんにちは!セミマサです。この記事は変数の備忘録になります。
変数の宣言
JavaScriptの変数宣言はvar,let,constの3種類がある。これらをつけなくても変数宣言はでき、その場合グローバル変数として扱われる。
var:関数スコープ。
let:ブロックスコープ。
const:ブロックスコープ。再代入ができない。
グローバル変数とローカル変数
var global = 2;
const variable_test = ()=>{
var local = 1;
test = 5;
return global + local;
};
const variable_test2 = ()=>{
var local = 3;
return test + local;
};
console.log(variable_test());//3
console.log(variable_test2());//8
console.log(local);//エラー
上記ソースにおいてglobalとtestがグローバル変数、localがローカル変数となっている。
・関数外で宣言した変数globalがvariable_testで参照できていたり、variable_test内で宣言した変数testがvariable_test2で参照できていることからグローバル変数はどこからでも参照可能なことがわかる。
・逆にローカル変数localは関数内でしか参照できないため、console.log(local);はエラーが発生する。
変数の巻き上げ
変数の宣言 (および一般的な宣言) はコードを実行する前に処理されますので、変数はコード内のどこで宣言しても、コードの先頭で宣言したものと等価になります。
var – JavaScript | MDN より引用
JavaScriptの変数には上記した巻き上げという仕様がある。
var global2 = 5;
const variable_test3 = ()=>{
console.log(global2);//undefined
var global2 = 3;
console.log(global2);//3
};
variable_test3();
//↓実際の挙動はこう
/*
var global2 = 5;
const variable_test3 = ()=>{
var global2;//巻き上げ
console.log(global2);
var global2 = 3;
console.log(global2);
};
variable_test3();
*/
3行目のconsole.logは5を返すと思いがちだが、実際に返ってくるのはundefinedである。変数の巻き上げによってローカル変数global2の宣言のみが先頭にもっていかれることでこのような結果になる。
変数の型
const number = 1;
console.log(typeof number);//number
const string = "test";
console.log(typeof string);//string
const object = {name:"user",pass:"password"};
console.log(typeof object);//object
const nu = null;
console.log(typeof nu);//object
const nan = NaN;
console.log(typeof nan);//number
const boo = true;
console.log(typeof boo);//boolean
const arraylist = [1,2,3,4,5];
console.log(typeof arraylist);//object
const func = ()=>{
return 0;
};
console.log(typeof func);//function
・JavaScriptの変数にも型が存在し、typeofを使うことで厳密ではないものの型を取得できる。
変数のスコープ
関数スコープ
const variable_test5 = ()=>{
var local = 1;
if(local === 1){
var local2 = 2;
}
console.log(local2);//2
}
variable_test5();
関数スコープであるvarは宣言された関数内であればどこからでも参照できる。
ブロックスコープ
const variable_test6 = ()=>{
let local = 1;
if(local === 1){
let local2 = 2;
console.log(local2);//2
}
console.log(local2);//エラー
}
variable_test6();
letはブロックスコープなので、宣言されたブロック(ifとかforのくくり)内でのみ参照できる。
おわりに
変数に関しての備忘録でした。新しい発見があれば追記します。