今天分享3種JavaScript類型判斷的方法：typeof、instanceof、constructor。

首先先看下所有的數據類型：

• 空值（null)
• 未定義(undefined)
• 布爾值（boolean)
• 數字（number)
• 字符串（string)
• 對象 (object)
• 符號（symbol, ES6中新增)
• 大整數（BigInt, ES2020 引入）

除去object,其他的我們統稱基本類型，最后兩個類型為新引入的前端數據類型。

Symbol： 是ES6中引入的一種原始數據類型，表示獨一無二的值。

BigInt：是 ES2020 引入的一種新的數據類型，用來解決 JavaScript中數字只能到 53 個二進制位（JavaScript 所有數字都保存成 64 位浮點數，大于這個范圍的整數，無法精確表示的問題。具體可查看：新數據類型 — BigInt

1.typeof

example：

console.log(typeof "");            // string
console.log(typeof 1 );            // number
console.log(typeof NaN );          // number
console.log(typeof true);          // boolean
console.log(typeof undefined);     // undefined
console.log(typeof function(){});  // function
console.log(typeof isNaN);         // function
console.log(typeof Symbol());      // symbol
console.log(typeof 123n);          // bigint
console.log(typeof []);            // object
console.log(typeof {});            // object
console.log(typeof null);          // object
console.log(typeof new Date());    // object
console.log(typeof new RegExp());  // object

對于數組，對象，null以及時間等數據，typeof只能返回object，而不能直接返回對應的類型，還需要通過其他法判斷。

2.instanceof

example：

console.log(12 instanceof Number);                 // false
console.log('22' instanceof String);               // false
console.log(true instanceof Boolean);              // false
console.log(null instanceof Object);               // false
console.log(undefined instanceof Object);          // false
console.log(function a() {} instanceof Function);  // true
console.log([] instanceof Array);                  // true
console.log({a: 1} instanceof Object);             // true
console.log(new Date() instanceof Date);           // true

簡單來說就是，判斷某個數據是否是由某個構造函數的實例，如果是，返回true，不是就返回false。

深層次來講就是，instanceof 右邊的prototype是否能在instanceof左側的數據的_proto_原型鏈上找到，這是個遍歷的過程。找到就是true。

3.constructor

example：

console.log('22'.constructor === String)             // true
console.log(true.constructor === Boolean)            // true
console.log([].constructor === Array)                // true
console.log(document.constructor === HTMLDocument)   // true
console.log(window.constructor === Window)           // true
console.log(new Number(22).constructor === Number)   // true
console.log(new Function().constructor === Function) // true
console.log(new Date().constructor === Date)         // true
console.log(new RegExp().constructor === RegExp)     // true
console.log(new Error().constructor === Error)       // true

constructor是追溯對象的出生地，也就是說可以知道某個對象是由哪個構造函數產生的。

原理其實是當構造函數被創建時，會在它的prototype上創建constructor屬性，而該屬性又指向函數本身，當實例被創建時，它的constructor會被繼承，嗯….構造函數就是實例的類型。

注意：null 和 undefined 是沒有 constructor 存在的，這兩種類型的數據需要通過其他方式來判斷。

結尾：其實還有一種方法：
Object.prototype.toString.call()，感興趣的自己去查文檔研究研究。