本記事では、JavaScriptの型の種類や調べ方について解説しています。
- 誰でも分かるように嚙み砕いて説明してくれる
- アニメーションの知識が深く学べる
- 1つのWebサイトを作りながら学べる
ポチップ
先輩くんAmazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！
後輩ちゃん初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！
変数名/関数名にもう悩まない！
- 美しいコードが書けるが自然と書けるようになる
- 他の開発者が理解しやすいコードになる
ポチップ
型の種類
JavaScriptには全部で9種類の方が存在します。それぞれの型についての詳細は以下の通りです。
| 型名 | 意味 | 値 |
|---|---|---|
| Number | 数値 | 123 |
| String | 文字列 | “SAMPLE” |
| Boolean | 真偽値 | true / false |
| Function | 関数 | function(){} / () => {} |
| Object | オブジェクト | {test:”テスト”} |
| Symbol | シンボル | Symbol() |
| BigInt | BigInt | 2n |
| Undefined | 未定義 | undefined |
| Null | 空 / null | null |
動的型付け言語と静的型付け言語
プログラミングには動的型付け言語と静的型付け言語があります。
JavaScriptは動的型付け言語で、変数を宣言する時に型を指定する必要はありません。JavaScript側で変数に代入される値によって型が変更されます。
例えば、最初に数値を入れていた変数に対して文字列を代入した場合、型はnumber->stringに変更されます。
静的型付け言語とはJavaやC言語などが該当します。JavaScriptに型宣言することができるTypeScriptも静的型付け言語になります。
暗黙の型変換
JavaScriptには暗黙の型変換というものがあります。これは先程触れた動的型付け言語は代入される値によって型を変更するためです。
実際にどのような時に暗黙の型変換がされるのか確認しましょう。
let num = 5;
console.log(num); // -> 5
console.log(typeof num); // -> number
num = num + "5";
console.log(num); // -> "55"
console.log(typeof num); // -> string * 数値と文字列を足した場合、文字列になる
num = num - 10;
console.log(num); // -> "45"
console.log(typeof num); // -> number * -(マイナス)記号は計算式でしか使用されないため、数値になるtypeof演算子
JavaScriptで変数の型を調べたい場合はtypeof演算子を使うことで確認できます。
使い方はtypeof演算子の後に型を調べたい変数を入力します。
/* Number */
let num = 123;
console.log(typeof num); // -> number
/* String */
let str = "SAMPLE";
console.log(typeof str); // -> string
/* Boolean */
let bl = true;
console.log(typeof bl); // -> boolean
/* Function */
let fn = function () {};
console.log(typeof fn); // -> function
/* Object */
let obj = {
name: "Tanaka",
};
console.log(typeof obj); // -> object
/* Symbol */
let sy = Symbol();
console.log(typeof sy); // -> symbol
/* BigInt */
let bi = 2n;
console.log(typeof bi); // -> bigint
/* Undefined */
let ud = undefined;
console.log(typeof ud); // -> undefined
/* Null */
let nl = null;
console.log(typeof nl); // -> objectnullが代入されている変数がtypeof演算子を使うとobjectと判定されていますが、これは公式が認めている言語エラーです。nullの詳細は判定方法は次の見出しで解説します。
Object.prototype.toString.call()
typeof演算子ではプリミティブ型(numberやstringなど)は判別することができますが、オブジェクト・配列・nullなどを判別することができません。
これらの情報を判別するには、Object.prototype.toString.call()を使います。
let nl = null;
console.log(Object.prototype.toString.call(nl)); // -> [object Null]
if(Object.prototype.toString.call(nl) === "[object Null]"){
/* 値がnullの時だけここの処理をするよ！ */
}
型を使った条件分岐の書き方
変数の型によって異なる処理を実装したい場合は、以下のように条件分岐を使うことで実装することができます。
/* typeof演算子の場合 */
let val1 = "値";
if(typeof val1 === "一致させたい型"){
/* ここに条件が一致した型のみに実行する処理を記述 */
}
/* Object.prototype.toString.call()の場合 */
let val2 = "値";
if(Object.prototype.toString.call(val2) === "一致させたい型"){
/* ここに条件が一致した型のみに実行する処理を記述 */
}
