Object.prototype.toString.call(obj)使用方法以及原理

這幾天看vue-router的源碼 發現了Object.prototype.toString.call()這樣的用法,當時覺得這就是轉成字符串的用的,可是越看越以爲不太對勁,趕忙查查資料,一查才知道沒那麼簡單.

首先在Object.prototype.toString方法被調用時,會執行下面的操做步驟:

1. 獲取this對象的[[Class]]屬性的值.

2. 計算出三個字符串"[object ", 第一步的操做結果Result(1), 以及 "]"鏈接後的新字符串.

3. 返回第二步的操做結果Result(2).

[[Class]]是一個內部屬性,全部的對象(原生對象和宿主對象)都擁有該屬性.在規範中,[[Class]]是這麼定義的

 

內部屬性	描述
[[Class]]	一個字符串值,代表了該對象的類型.

 

看這裏重點: [[Class]] 代表了該對象的類型

並且除了經過Object.prototype.toString方法以外,沒有提供任何其餘方式來讓程序訪問該屬性的值. 看到這裏我就想到了 Object.prototype.toString 是否是能夠用來檢測對象的類型,並且vue-router源碼裏面正好就是用來檢測對象類型的.

等等 隱約記得 typeof 和 instanceof 也是用來檢測類型的  後來查閱資料 

 

---

 

typeof 只能區分基本類型，即 「number」，」string」，」undefined」，」boolean」，」object」 五種。

對於數組、對象來講，其關係錯綜複雜，使用 typeof 都會統一返回 「object」 字符串。

---

 

instanceof

能夠檢測自定義類型 可是檢測的必須是對象( Object ).  好比若是想檢測 a是什麼類型  要先檢測他是不是Object 類型 而後才能用instanceof , 這就麻煩了.

---

 

而Object.prototype.toString就沒有這麼多限制.

[[Class]]屬性的值能夠是除了 "Array", "Boolean", "Date", "Error", "Function", "JSON", "Math", "Number", "Object", "RegExp", "String"以外的的任何字符串

看下面的例子

下面是實戰:

console.log(Object.prototype.toString.call(123)) //[object Number]
console.log(Object.prototype.toString.call('123')) //[object String]
console.log(Object.prototype.toString.call(undefined)) //[object Undefined]
console.log(Object.prototype.toString.call(true)) //[object Boolean]
console.log(Object.prototype.toString.call({})) //[object Object]
console.log(Object.prototype.toString.call([])) //[object Array]
console.log(Object.prototype.toString.call(function(){})) //[object Function]
console.log(Object.prototype.toString.call(null))  //[object Null

什麼類型均可以,完美.

最後加個 toString()的知識點 直接看演示:

若是不帶括號 直接對 1 使用 toStirng()的時候   會把.當作小數點 而後報錯   因此應該使用 1..toString();