JavaScript入門 #4 - データ型とtypeof

このシリーズについて

「JavaScript入門」第4回です。今回は、JavaScriptで扱う値の種類、つまりデータ型を確認します。

データ型とは

データ型は、値の種類を表します。文字、数値、真偽値では使える操作が違います。

JavaScriptは動的型付けの言語です。変数ではなく、値そのものが型を持ちます。

let value = "こんにちは";
value = 100;
value = true;

同じ変数に別の型の値を入れることはできます。ただし、読みやすいコードでは、1つの変数に別の意味の値を入れ続けることは避けます。

Step 1: stringを確認する

文字列は string 型です。シングルクォート、ダブルクォート、バッククォートで囲めます。

const name = "Taro";
const message = 'Hello';
const template = `こんにちは`;

console.log(typeof name);
console.log(typeof message);
console.log(typeof template);

すべて string と表示されます。

Step 2: numberを確認する

JavaScriptでは、整数も小数も基本的に number 型です。

const age = 18;
const price = 1200.5;

console.log(typeof age);
console.log(typeof price);
console.log(10 / 3);

10 / 3 は小数として計算されます。

Step 3: booleanを確認する

true または false の値は boolean 型です。

const isStudent = true;
const isFinished = false;

console.log(typeof isStudent);
console.log(typeof isFinished);

条件分岐では、この真偽値をよく使います。

Step 4: nullとundefinedの違い

undefined は「まだ値が入っていない」状態、null は「意図的に空にした」状態として使われます。

let notAssigned;
const emptyValue = null;

console.log(notAssigned);
console.log(emptyValue);
console.log(typeof notAssigned);
console.log(typeof emptyValue);

typeof null は歴史的な理由で object と表示されます。

Step 5: 型を表で整理する

練習

types.js を作り、各値の型を確認します。

const userName = "Yuki";
const score = 95;
const passed = true;
let memo;
const selectedItem = null;

console.log(typeof userName);
console.log(typeof score);
console.log(typeof passed);
console.log(typeof memo);
console.log(typeof selectedItem);

よくあるエラー

次のステップ

JavaScript入門 #5 - 演算子と比較 で、計算と条件判定の基本を学びます。

まとめ

JavaScriptでは、値が型を持ちます。typeof を使うと、文字列、数値、真偽値、未定義を確認できます。null だけは typeof の結果が直感と違うため、特別な値として覚えてください。

参考リソース

• MDN: JavaScriptのデータ型とデータ構造
• MDN: typeof

×

PR

×

PR