コーディングクイズ No.17：JavaScript基礎（データ型の理解）

July 6, 2025

毎日コーディングクイズシリーズ！今回はJavaScript基礎のデータ型の理解について、実践的なクイズ形式で学習しましょう！

🎯 問題

ECサイトのショッピングカート機能を開発中です。商品の価格を比較して、送料無料の条件（3000円以上）を判定する処理を実装しています。以下のコードを実行した時の結果を予想してください。

// 商品価格の比較処理
let price1 = "3000";     // データベースから取得した文字列
let price2 = 3000;       // JavaScriptで計算した数値
let freeShippingLimit = 3000;

console.log("価格1の型:", typeof price1);
console.log("価格2の型:", typeof price2);
console.log("価格1 == 送料無料基準:", price1 == freeShippingLimit);
console.log("価格1 === 送料無料基準:", price1 === freeShippingLimit);
console.log("価格1 > 2999:", price1 > 2999);
console.log("価格1 + 500:", price1 + 500);

このコードの実行結果として正しいものはどれでしょうか？

A. 価格1の型: number / 価格1 === 送料無料基準: true / 価格1 + 500: 3500
B. 価格1の型: string / 価格1 === 送料無料基準: false / 価格1 + 500: “3000500”
C. 価格1の型: string / 価格1 === 送料無料基準: true / 価格1 + 500: 3500
D. 価格1の型: number / 価格1 === 送料無料基準: false / 価格1 + 500: “3000500”

答えを確認する

✅ 正解：B

正解

正解は B です！

解説

この問題のポイントは、JavaScriptの型システムと型変換の動作を理解することです。文字列の”3000″と数値の3000は、見た目は同じでも全く異なるデータ型として扱われます。

選択肢A: 不正解。`price1`は文字列”3000″で定義されているため、`typeof price1`は”string”を返します。また、文字列と数値の加算は文字列結合になるため、結果は”3000500″になります。
選択肢B: 正解！`price1`は文字列型、厳密等価演算子（===）は型も比較するためfalse、文字列と数値の加算は文字列結合となり”3000500″になります。
選択肢C: 不正解。厳密等価演算子（===）は型と値の両方を比較するため、文字列”3000″と数値3000は異なる型なのでfalseを返します。
選択肢D: 不正解。`price1`は文字列”3000″として定義されているため、`typeof price1`は”string”を返します。

実際の開発では、データベースから取得した値は多くの場合文字列として扱われるため、計算処理を行う前に適切な型変換を行う必要があります。特にECサイトのような金額計算が重要なシステムでは、予期しない文字列結合によるバグを防ぐために型の確認と変換が必須です。

// 実際の出力結果
価格1の型: string
価格2の型: number
価格1 == 送料無料基準: true
価格1 === 送料無料基準: false
価格1 > 2999: true
価格1 + 500: 3000500

// 正しい実装例
let price1 = "3000";
let correctedPrice = Number(price1);  // 数値に変換
console.log("修正後の加算:", correctedPrice + 500);  // 3500

このクイズを通じて、データ型の違いとJavaScriptの型変換の動作を理解できたでしょうか。次回は、より実践的な型変換のテクニックについて学習していきましょう！

💡 ポイント

typeof演算子：変数のデータ型を確認する際に使用。デバッグ時に重要
== vs ===：==は型変換あり、===は型変換なしで比較。実務では===を推奨
暗黙的型変換：JavaScriptは自動で型変換を行うが、予期しない結果を招く場合がある
Number()関数：文字列を数値に変換する際の基本的な方法。parseInt()やparseFloat()も覚えておこう

よかったらシェアしてね！

コーディングクイズ No.17：JavaScript基礎（データ型の理解）

✅ 正解：B

関連記事