変数と関数
let 文による変数の定義
計算した値に名前をつけて後で再利用することができます。このような変数を定義するには、 let 〈変数名〉=〈初期値〉
という構文を使います。
let x = Math.sqrt(123); // 右辺の値を x という名前の変数に保管する
console.log(x.toString()); // 変数に保管した値を使う
console.log(x.toPrecision(10)); // 保管した値をもう一度使う
x = x * 2; // 変数に値を代入し直す
console.log(x.toString()); // 変数 x の値が変化している
波かっこ { }
で囲った部分で定義した変数は、外側で定義したものとは別の変数になります。
let x = 123;
console.log(x); // => 123
{
let x = 456; // 外側の変数とは別
console.log(x); // => 456
}
console.log(x); // => 123
ただし、内側で同じ名前の変数を定義する場合は、内側の let 文の前では外側の変数も内側の変数も参照できません。また、同じスコープでは同じ名前の変数を複数定義できません。
let x = 123;
console.log(x); // => 123
{
// console.log(x); // => エラー (ReferenceError: x is not defined)
let x = 456;
console.log(x); // => 456
// let x = 789; // => エラー (SyntaxError: Identifier 'x' has already been declared)
}
console.log(x); // => 123
let 文は ECMAScript 6 で導入された新たな文法です。
発展:var 文による変数の定義
JavaScript には、変数を定義するのに let 文以外に var 文というものもあります。let 文の方が後発で var 文よりも洗練されているので、新しく JavaScript を勉強する人は var 文を使う必要はないでしょう。
let 文の場合は波かっこ { }
で新しいスコープが作られますが、 var 文は同じ関数内の変数は(ほぼ)全てスコープを共有します。
変数の更新
最初のコード例ですでに使っていますが、一度定義した変数の値を変更するには、代入演算子(イコール) =
を使います。
let x = 5;
console.log(x); // => 5
x = x + 1;
console.log(x); // => 6
代入の際、「元の変数の値に何か演算を施したもの」(上の例だと足し算)を使う場合は、複合代入演算子を使えます。演算子の直後に(空白を入れずに)イコールを書くと複合代入演算子になります。
let x = 5;
console.log(x); // => 5
x += 1; // x = x + 1 と等価
console.log(x); // => 6
let y = 4;
console.log(y); // => 4
y /= 2; // y = y / 2 と等価
console.log(y);
さらに、変数の値を「1だけ増やす」「1だけ減らす」という演算は頻繁に使われるので、専用の演算子(インクリメント演算子・デクリメント演算子)が用意されています。
インクリメント演算子は ++
, デクリメント演算子は --
を使います。
let x = 5;
console.log(x); // => 5
console.log(x++); // => 5 (更新前の値)
console.log(x); // => 6
console.log(++x); // => 7 (更新後の値)
インクリメント演算子を変数の前に書くと、式の値として更新前の値が帰ってきます。変数の後に書くと、更新後の値が帰ってきます。デクリメント演算子も同様です。
let x = 6;
console.log(x); // => 6
console.log(x--); // => 6 (更新前の値)
console.log(x); // => 5
console.log(--x); // => 4 (更新後の値)
発展:定数(const 文)
let や var で宣言した変数は値を変更できます。逆に、値を変更しないと明示したい場合には const 文が使えます。
// test-const.js
const x = Math.exp(1);
console.log(x.toString());
x = x * 2; // エラー (TypeError: Assignment to constant variable)
実行結果:
$ node test-const.js
2.718281828459045
ほにゃらら/test-const.js:3
x = x * 2;
^
TypeError: Assignment to constant variable.
at Object.<anonymous> (ほにゃらら/test-const.js:3:3)
at Module._compile (module.js:571:32)
at Object.Module._extensions..js (module.js:580:10)
at Module.load (module.js:488:32)
at tryModuleLoad (module.js:447:12)
at Function.Module._load (module.js:439:3)
at Module.runMain (module.js:605:10)
at run (bootstrap_node.js:423:7)
at startup (bootstrap_node.js:147:9)
at bootstrap_node.js:538:3
const 文は ECMAScript 6 で導入された新たな文法です。
関数
いくつかの値を受け取り、所定の処理を実行し、何かしらの結果を返すものを、関数と呼びます。数学で関数と言ったら、引数のみで値が決まるものですが、JavaScriptの関数は引数以外の要素(例:現在時刻)で結果が変わるものもあります。
関数定義の文法は
function 〈関数名〉(〈引数〉) {
〈処理〉
}
となります。〈処理〉の中で return 〈式〉
という文が実行されると、その式の値が関数からの返り値となり、関数の実行が終了します。
例を見てみましょう。
// 引数に1を加えたものを返す関数を、 succ という名前で定義する
function succ(a) {
return a+1;
}
console.log(succ(3)); // 出力結果: 4
JavaScriptにおいては、関数も値の一種なので、変数に代入したり、関数に渡すことができます。
// 続き
let f = succ;
console.log(f(4)); // 出力結果:5
console.log(succ); // 出力結果:[Function]
無名関数
上で定義した succ 関数は、名前付きの関数として定義していましたが、名前をつけずに、式の中に直接記述することもできます。この場合の文法は (〈引数〉) => { 〈処理〉 }
(アロー表記)または function(〈引数〉) { 〈処理〉 }
となります。
さっきと等価なプログラムを、無名関数表記で書くと、次のようになります:
let succ = (a) => { return a+1; };
console.log(succ(3));
または
let succ = function(a) { return a+1; };
console.log(succ(3));
処理の内容が return 〈式〉
という形の文1つの場合は、アロー表記をさらに簡略化できます:
let succ = (a) => a+1;
console.log(succ(3));
アロー表記は ECMAScript 6 で新しく導入された記法です。