JavaScript：変数とデータ型（let / const）

出力 == 180

const 名前 = 値; と書き、console.log(名前) で出す。

const price = 180;
console.log(price);

変数は値に付けた名札。以降は 180 と書く代わりに price と書けるので、値を変えるときは宣言の1行だけ直せばよくなる。

解答 == B

const は「定数」の意味。

B

Assignment to constant variable. というエラーでその場で止まる。うっかり書き換える事故を防げるのが const の価値。

出力 == 500

2回目は let を付けずに total = 500; と書く。

let total = 0;
total = 500;
console.log(total);

再代入するときにlet を付け直さないのがポイント。付けると「二重宣言」のエラーになる。

____ tax = 0.1;
console.log(tax);

出力 == 0.1

「定数」を意味する5文字のキーワード。

const

税率のような途中で変わってはいけない値は const で守る。まず const、必要なら let——この順で考える。

解答 == B

JavaScriptに整数専用の型はない。

B

42 も 3.14 もどちらも number。他の言語のような int / float の区別がないのがJavaScriptの特徴。

出力 == 田中さんの点数は82点です

バッククォート ` で囲み、変数は ${name} のように埋め込む。

const name = "田中";
const score = 82;
console.log(`${name}さんの点数は${score}点です`);

バッククォートはキーボードの Shift + @（日本語配列）で入力できる。引用符 " とは別の記号なので注意。

const text = "42";
console.log(____(text) + 8);

出力 == 50

文字列を数値に変換する組み込み関数。先頭は大文字。

Number

変換しないと "428" という文字列になってしまう。入力された値は常に文字列なので、計算前の変換は必須の作業。

解答 == B

+ は文字列があるとどう振る舞うか。

B

数値の3が文字列に変換されて連結される。表示上は引用符が付かないので B。ちなみに "5" - 3 は 2 になる——- には連結の意味がないためで、この非対称さがバグの温床になる。

出力 == 180円 × 3 = 540円

${ } の中には計算式も書ける。${price * qty} のように。

const price = 180;
const qty = 3;
console.log(`${price}円 × ${qty} = ${price * qty}円`);

${ } の中には式が書けるので、計算結果を別の変数に入れなくてよい。JS01で + を継ぎ足して書いた明細が、ここで一気に読みやすくなる。

出力 == true / boolean

typeof で型が取れる。テンプレートリテラルで2つを並べる。

const isMember = true;
console.log(`${isMember} / ${typeof isMember}`);

true・false の2値だけを持つのが boolean。「〜かどうか」を表す変数は is や has で始めるのが慣習で、読む人に型が伝わる。

出力2行が完全一致

小計を const subtotal = ... で1回だけ計算し、税込ではその subtotal を使い回す。

const notePrice = 180;
const noteQty = 3;
const penPrice = 120;
const penQty = 5;
const taxRate = 0.1;

const subtotal = notePrice * noteQty + penPrice * penQty;
const total = Math.round(subtotal * (1 + taxRate));

console.log(`小計 ${subtotal}円`);
console.log(`税込 ${total}円`);

JS01では「180 * 3 + 120 * 5」を2回書いていたが、subtotal という名前を付けたことで1回で済んだ。単価を変えたければ宣言の1行を直すだけ。これが変数の本当の価値。

出力2行が完全一致

変換なしは inputAge + 5、変換ありは Number(inputAge) + 5。

const inputAge = "25";

console.log(`変換なし：${inputAge + 5}`);
console.log(`変換あり：${Number(inputAge) + 5}`);

255 という数字が出た瞬間、型変換を忘れたと分かる。フォームやAPIから来た値は必ず文字列なので、計算の前に Number() を通すのが鉄則。

出力2行が完全一致

数値に変換できない文字列は NaN になる。そのまま出力すればよい。

const text1 = "42";
const text2 = "abc";

console.log(`${text1} → ${Number(text1)}`);
console.log(`${text2} → ${Number(text2)}`);

NaN は Not a Number（数値ではない）の意味。NaN を含む計算はすべて NaN になるので、合計が NaN になったら「どこかで変換に失敗している」と疑う。

出力4行が完全一致

total += 値 と書くと total = total + 値 と同じ意味になる。const では再代入できないので let を使う。

let total = 0;

total += 120;
console.log(`+120 → 合計${total}円`);

total += 340;
console.log(`+340 → 合計${total}円`);

total += 250;
console.log(`+250 → 合計${total}円`);

console.log(`最終合計：${total}円`);

値が変化していくものは let——これが const との使い分けの基準。+= は積み上げ処理の定番で、次章以降のループで必ず使う。

出力3行が完全一致

3桁区切りは points.toLocaleString() で作れる。

const name = "佐藤";
const age = 28;
const isMember = true;
const points = 1250;

console.log(`${name}さん（${age}歳）`);
console.log(`会員：${isMember}`);
console.log(`保有ポイント：${points.toLocaleString()}pt`);

toLocaleString() は数値を「1,250」のように読みやすい桁区切りにする。金額やポイントの表示では必須で、自分でカンマを入れる処理を書く必要はない。