JavaScript數據類型檢測總結

在js中，有四種用於檢測數據類型的方式，分別是：

• typeof　　用來檢測數據類型的運算符
• instanceof 　　 檢測一個實例是否屬於某個類
• constructor　　 構造函數
• Object.prototype.toString.call()　　原型鏈上的Object對象的toString方法

下面咱們就來分別介紹一下上面四種方法的適用場景和侷限性。

typeof　用來檢測數據類型的運算符

使用typeof檢測數據類型，返回值是字符串格式。可以返回的數據類型

是："number","string","bolean","undefined","function","object"。

<script>
  let arr = [1,2,3];
  let reg = /\w/;
  console.log(arr instanceof Array);  //true
  console.log(arr instanceof Object);  //true
  console.log(reg instanceof RegExp);  //true
  console.log(reg instanceof Object);  //true
</script>

前端全棧學習交流圈：866109386,面向1-3經驗年前端開發人員,幫助突破技術瓶頸，提高思惟能力 羣內有大量PDF可供自取，更有乾貨實戰項目視頻進羣免費領取。

侷限性：

• 不能用於檢測和處理字面量方式建立出來的基本數據類型值，即原始數據類型
• instanceof的特性：只要在當前實例的原型鏈上的對象，咱們用其檢測出來都爲true
• 在類的原型繼承中，咱們最後檢測出來的結果未必正確

constructor　構造函數

是函數原型上的屬性,該屬性指向的是構造函數自己。

做用和instsnceof很是類似，與instanceof不一樣的是，不只能夠處理引用數據類型，還能夠處理原始數據類型。

<script>
  let num = 12;
  let obj = {};
  console.log(num.constructor == Number);//true
  console.log(obj.constructor == Object);//true
</script>

可是要注意一點的是，當直接用(對象字面量或原始數據).constructor時，最好加上（）。爲了便於理解，咱們來看一個例子。

<script>
  1.constructor === Number;    //報錯，Invalid or unexceped token
  (1).constructor === Number;    //true
  {}.constructor === Number;    //報錯，Invalid or unexceped token
  ({}).constructor === Number;  //true
</script>

前端全棧學習交流圈：866109386,面向1-3經驗年前端開發人員,幫助突破技術瓶頸，提高思惟能力 羣內有大量PDF可供自取，更有乾貨實戰項目視頻進羣免費領取。

這主要是因爲js內部解析方式形成的，js會把1.constructor解析成小數，這顯然是不合理的，小數點後應該是數字，所以就會引起報錯。js會把{}解析成語句塊來執行，這時後面出現一個小數點顯然也是不合理的，所以也會報錯。爲了解決這個問題，咱們能夠爲表達式加上（）使js可以正確解析。

侷限性：咱們能夠把類的原型進行重寫，在重寫的過程當中極可能把以前constructor給覆蓋了，這樣檢測出來的結果就是不許確的

<script>
   function Fn() {};
  Fn.prototype = new Array;
  var f = new Fn;
  //f是一個函數，按道理說他的構造函數應該是Function,可是修改其原型鏈後，它的constructor變成了Array.
  console.log(f.constructor == Array);  //true
</script>

Object.prototype.toString.call()　原型鏈上的Object對象的toString方法

Object.prototype.toString的做用是返回當前方法的執行主體(方法中的this)所屬類的詳細信息,是最全面也是最經常使用的檢測數據類型的方式。

返回值的類型爲string類型。

<script> 
  console.log(Object.prototype.toString.call(1));          //[object Number]
  console.log(Object.prototype.toString.call(/^sf/));        //[object RegExp]
  console.log(Object.prototype.toString.call("hello"));      //[object String]
  console.log(Object.prototype.toString.call(true));        //[object Boolean]
  console.log(Object.prototype.toString.call(null));        //[object Null]
  console.log(Object.prototype.toString.call(undefined));      //[object Undefined]
  console.log(Object.prototype.toString.call(function() {}));    //[object Function]
  console.log(typeof(Object.prototype.toString.call(function() {})));    //string
</script>