Vue源碼中要const_toStr=Object.prototype.toString的原因是什么

小編給大家分享一下Vue源碼中要const _toStr = Object.prototype.toString的原因是什么，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

創(chuàng)新互聯(lián)是一家專業(yè)提供灌云企業(yè)網(wǎng)站建設(shè),專注與網(wǎng)站設(shè)計、成都網(wǎng)站設(shè)計、H5場景定制、小程序制作等業(yè)務(wù)。10年已為灌云眾多企業(yè)、政府機構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)網(wǎng)站建設(shè)公司優(yōu)惠進行中。

在vue的源碼中，vue/src/shared/util.js文件中存放的是一些方法。其中作者用了Object.prototype.toString這個方法來判斷類型，但是并沒有直接用，而是單獨保存在一個變量：

const _toStr = Object.prototype.toString

那么為什么要這么做呢？

先說下判斷類型。眾所周知，typeof在判斷對象時不能正確判斷Null，并且不能識別出Array，但在判斷基礎(chǔ)類型時是沒問題的。所以尤大也寫了：

export function isPrimitive (value: any): boolean %checks {
 return (
 typeof value === 'string' ||
 typeof value === 'number' ||
 // $flow-disable-line
 typeof value === 'symbol' ||
 typeof value === 'boolean'
 )
}

判斷Object也做了區(qū)分，isObject和isPlainObject ：

export function isObject (obj: mixed): boolean %checks {
 return obj !== null && typeof obj === 'object'
}
export function isPlainObject (obj: any): boolean {
 return _toString.call(obj) === '[object Object]'
}

到了判斷復(fù)雜類型的時候，一般我們用Object.prototype.toString或者是instanceof。如果是前者的話會返回類似'[object Object]'的字符串。后者則會判斷一個對象的原型鏈上是否存在一個構(gòu)造函數(shù)。

兩者還有一些不同。Object.prototype.toString.call(1) 和 Object.prototype.toString.call(Number(1))時，返回的都是"[object Number]"，也就是說，它并不能區(qū)分原始類型和復(fù)雜類型?？梢?，Object.prototype.toString.call并不像很多教程說的那樣好用。

Object.prototype.toString.call(1)
"[object Number]"
Object.prototype.toString.call(Number(1))
"[object Number]"

如果要使用，就需要像尤大一樣，把原始類型單獨拎出來判斷，再去判斷復(fù)雜類型，而走到這一步的時候尤大就寫了上面說那行const _toStr。這是因為，toString實在是太容易被重寫了。如果toString被其他人重寫，將會對代碼中涉及到的部分造成影響，所以就保存下來防止這種情況發(fā)生。

補充:Object.prototype.toString方法的原理

前言

我們在判斷一個對象的內(nèi)置類型時，我們一般可以使用以下方法：

var arr = [];
console.log(Object.prototype.toString.call(arr)) //"[object Array]"

那么，這個方法的原理是什么呢？

ECMAScript 3

在toString方法被調(diào)用時,會執(zhí)行下面的操作步驟:

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

2. 計算出三個字符串"[object ", 第一步的操作結(jié)果Result(1), 以及 "]"連接后的新字符串.

3. 返回第二步的操作結(jié)果Result(2).

[[Class]]是一個內(nèi)部屬性,所有的對象(原生對象和宿主對象)都擁有該屬性.在規(guī)范中,[[Class]]是這么定義的

[[Class]] 一個字符串值,表明了該對象的類型.

然后給了一段解釋:

所有內(nèi)置對象的[[Class]]屬性的值是由本規(guī)范定義的.所有宿主對象的[[Class]]屬性的值可以是任意值,甚至可以是內(nèi)置對象使用過的[[Class]]屬性的值.[[Class]]屬性的值可以用來判斷一個原生對象屬于哪種內(nèi)置類型.需要注意的是,除了通過Object.prototype.toString方法之外,本規(guī)范沒有提供任何其他方式來讓程序訪問該屬性的值。

ECMAScript 5

在toString方法被調(diào)用時,會執(zhí)行下面的操作步驟

如果this的值為undefined,則返回"[object Undefined]".
如果this的值為null,則返回"[object Null]".
讓O成為調(diào)用ToObject(this)的結(jié)果.
讓class成為O的內(nèi)部屬性[[Class]]的值.
返回三個字符串"[object ", class, 以及 "]"連接后的新字符串.
ES5中,[[Class]]屬性的解釋更加詳細(xì):

所有內(nèi)置對象的[[Class]]屬性的值是由本規(guī)范定義的.所有宿主對象的[[Class]]屬性的值可以是除了"Arguments", "Array", "Boolean", "Date", "Error", "Function", "JSON", "Math", "Number", "Object", "RegExp", "String"之外的的任何字符串.[[Class]]內(nèi)部屬性是引擎內(nèi)部用來判斷一個對象屬于哪種類型的值的.需要注意的是,除了通過Object.prototype.toString方法之外,本規(guī)范沒有提供任何其他方式來讓程序訪問該屬性的值。

總而言之，要獲取一個對象的真實的內(nèi)置類型，我們需要通過獲取[[Class]]的屬性值，在es5之前，該屬性值只能通由Object.prototype.toString來訪問，因此，通過Object.prototype.toString.call(arr)改變tostring方法的this指向，從而獲得對象的內(nèi)置類型。

以上是“Vue源碼中要const _toStr = Object.prototype.toString的原因是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

分享名稱：Vue源碼中要const_toStr=Object.prototype.toString的原因是什么
標(biāo)題鏈接：http://muchs.cn/article22/gpgjcc.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供網(wǎng)站建設(shè)、品牌網(wǎng)站制作、定制開發(fā)、動態(tài)網(wǎng)站、、小程序開發(fā)

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容