JavaScriptで属するクラス名を取得する・データ型を調べる方法

Class_Type

こんにちはフロントエンドエンジニアのまさにょんです!

今回は、JavaScriptで属するクラス名を取得する・データ型を調べる方法について解説していきます。

JavaScriptで属するクラス名を取得する・データ型を調べる方法

JavaScriptでDataのクラス名(Prototype)を取得する:constructor.name

targetData.constructor.name でDataのクラス名(Prototype)を取得することができます。

const hakuotu = '白桃さん';
console.log('hakuotu-Class', hakuotu.constructor.name);
// hakuotu-Class String

const myCar = { make: 'Nissan', model: 'DAYZ', year: 2018 };
console.log('myCar-Class', myCar.constructor.name);
// myCar-Class Object

class Roborovski {
  constructor(name) {
    this.name = name;
  };
  sayHi() {
      console.log(`My name is ${this.name}`);
  };
};
const robotama = new Roborovski("ロボ玉");
console.log('robotama-Class', robotama.constructor.name);
// robotama-Class Roborovski

Objectが特定のClassに属しているかどうかを確認する:instanceof演算子

instanceof演算子を使用することで、Objectが特定のClassに属しているかどうかを確認することができます。

また、継承元の親Classも判定することができます。

注意点とすると、Objectに対して属するClass判定をする演算子なので、PrimitiveTypeには使えないことです。

// 1. instanceof-演算子: instanceof 演算子でObjectが特定のClassに属しているかどうかを確認することができます。
// また継承も考慮されます。

// 構文: 「 Object instanceof Class 」
// 実行結果(返り値): true/false

const object = {
    apple: 'りんご',
    apple_panchi: 'りんごパンチ'    
};
console.log(object instanceof Object); // true

// Array-Classは、Object-Class(親Class)でもある。
const array = [1, 2, 3];
console.log(array instanceof Array); // true
console.log(array instanceof Object); // true

// Primitive-Typeは、判定できない。
const boolean = true;
console.log(boolean instanceof Boolean); // false
console.log(boolean instanceof Object); // false

function Car(make, model, year){
    this.make = make;
    this.model = model;
    this.year = year;
};

const auto = new Car('Honda', 'Accord', 1998);

console.log(auto instanceof Car); // true

// Car-Classは、Object-Class(親Class)でもある。
console.log(auto instanceof Object); // true

データ型の判定・識別に使用する:typeof演算子

JavaScriptのtypeof演算子ではtypeof 値 の形で、型の判定ができます。

typeof演算子の実行結果は、型のString表記になります。

なので、typeof演算子で型の判定をするときは、実行結果が型のString表記であることから文字列で判定することに注意してください。

またnullだけはtypeof演算子での型判定が特殊でobjectとして判定されるので要注意です。

// < typeof-演算子: 型のCheck >

// 1. typeof-演算子(JavaScript): 「 typeof 値 」で型の判定ができる。
// null だけ特殊な判定なので要注意!

console.log(typeof ''); // string
console.log(typeof true); // boolean
console.log(typeof 12); // number

console.log(typeof ['apple', 'grape', 'orange']); // object
console.log(typeof {apple: 'りんご', grape: 'ぶどう', orange: 'オレンジ'}); // object

console.log(typeof function momoChan (){ console.log('Myao') }); // function

const Arrow = ()=> { console.log('アロー関数') };
console.log(typeof Arrow); // function

console.log(typeof Symbol('ももちゃん')); // symbol
console.log(typeof BigInt(123456789012345)); // bigint

console.log(typeof undefined); // undefined
console.log(typeof null); // object
// nullは、typeof-演算子の判定が、objectなので要注意です!

// 2. typeof-演算子で型の判定をするときは、文字列であることに注意!
const robotama = 'ロボ玉';
if (typeof robotama === 'string') console.log('文字列です');

if (typeof Arrow === 'function') console.log('関数です');

if (typeof null === 'object') console.log('nullは歴史的な経緯でObject扱いです');

JavaScript書籍 Ver. 中級-上級者向け

JavaScript書籍 Ver. 初級者向け

Twitterやってます!Follow Me!

神聖グンマー帝国の逆襲🔥

神聖グンマー帝国の科学は、世界一ぃぃぃぃぃぃ!!!!!

最近の投稿