JS數據類型檢測typeof、instanceof、constructor、Object.prototype.toString.call(val)的區別

數據類型檢測的四種方式

typeof

不能細分對象類型的值，都是返回“object”，函數檢測返回“function”。
typeof 10：number
typeof new Number(10)：object
typeof true：boolean
typeof new Boolean(true)：object
typeof “aaa”：string
typeof new String(“aaa”)：object
typeof null：object
…

• 底層原理：
  typeof是按照“值”在計算機中存儲的二進制值來檢測的，凡是以000開始的都認爲是對象（null:00000）。
  優點：檢測原始值類型和函數類型方便。
  
  

instanceof

原本是檢測某個對象是否是某個類的實例，臨時拉來做數據類型檢測，彌補typeof的一些不足，可以細分部分對象。
let arr = [];
arr instanceof Array

• 底層原理
  arr instanceof Array，首先查找arr[Symbol.hasInstance]是否存在，如果存在基於這個檢測Array[Symbol.hasInstance]（arr）。如果沒有則基於原型鏈__proto__查找，只要Array.protoType出現在arr的原型鏈上，返回結果就是true。
  arr[Symbol.hasInstance]
  Array[Symbol.hasInstance]（arr）
  arr.proto == Array.prototype
  缺點：
  1.不能檢測原始值類型；
  2.原型鏈可以重構，導致結果不準確；
  
  
  
  
  
  
  

constructor

和instanceof類似，都是臨時用做數據類型檢測使用的，constructor原型可以重構，導致結構不準確。
相對於instanceof，constructor可以檢測原始值類型，但是隻會基於原型鏈上的直屬類檢測。
let arr = [];
arr.constructor == Array ------------- true
arr.constructor == Object -------------- false
ps：因爲arr.constructor直接指向的是Array

Object.prototype.toString.call();

除了null/undefined，大部分數據類型所屬類的原型上，都有toString方法；但是所有的toString方法都是轉換爲字符串的只有Object原型上的toString方法是檢測數據類型的。
優點：結果準確
返回值：“[object ?]”
let obj = {};
obj.toString.call(1)------------------- “[object Number]”
obj.toString.call(“1”)------------------- “[object String]”
obj.toString.call(true)------------------- “[object Boolean]”
obj.toString.call(new Date(2020-12-12))-- “[object Date]”
obj.toString.call(function(){})------------------- “[object Function]”
obj.toString.call(null)------------------- “[object Null]”
obj.toString.call(undefined)-----------------"[object Undefined]"
obj.toString.call([])-----------------"[object Array]"

• 底層原理：
  先找要檢測值[Symbol.toStringTag]，先找私有的，如果找不到再找所屬類原型上的，返回的屬性值就是“?”;
  如果找不到Symbol.toStringTag，則返回當前示例所屬構造函數的名字;
  let f =1;
  f[Symbol.toStringTag]-------undefined
  f.constructor[Symbol.toStringTag]-------undefined
  f.constructor.name -------“Number”