摘要:說(shuō)明中的函數(shù)用于判斷指定參數(shù)是否是一個(gè)純粹的對(duì)象,返回值為類型。使用語(yǔ)法參數(shù)說(shuō)明任意類型需要進(jìn)行判斷的任意值。函數(shù)的方法會(huì)返回一個(gè)表示函數(shù)源代碼的字符串。具體來(lái)說(shuō),包括關(guān)鍵字,形參列表,大括號(hào),以及函數(shù)體中的內(nèi)容。
說(shuō)明
jQuery中的isPlainObject() 函數(shù)用于判斷指定參數(shù)是否是一個(gè)純粹的對(duì)象,返回值為Boolean類型。
"純粹的對(duì)象",就是通過(guò) { }、new Object()、Object.create(null) 創(chuàng)建的對(duì)象。
這個(gè)方法的作用是為了跟其他的 JavaScript對(duì)象如 null,數(shù)組,宿主對(duì)象(documents),DOM 等作區(qū)分,因?yàn)檫@些用 typeof 都會(huì)返回object。
使用語(yǔ)法:
$.isPlainObject( object )
參數(shù)說(shuō)明:
object:任意類型 需要進(jìn)行判斷的任意值。
$.isPlainObject({}); //true $.isPlainObject(new Object); //true $.isPlainObject(Object.create(null)); //true $.isPlainObject([]); //false $.isPlainObject(document); //false源碼分析
我們來(lái)看看jQuery 3.3.1 版本下的源碼
var class2type = {}; //Object.getPrototypeOf() 方法返回指定對(duì)象的原型(內(nèi)部[[Prototype]]屬性的值)。 var getProto = Object.getPrototypeOf; //相當(dāng)于 Object.prototype.toString var toString = class2type.toString; //hasOwnProperty() 方法會(huì)返回一個(gè)布爾值,指示對(duì)象自身屬性中是否具有指定的屬性 //相當(dāng)于 Object.prototype.hasOwnProperty var hasOwn = class2type.hasOwnProperty; //因?yàn)?hasOwn 是一個(gè)函數(shù),所以這里調(diào)用的是內(nèi)置對(duì)象 Function 的toString() 方法 //相當(dāng)于 Function.prototype.toString var fnToString = hasOwn.toString; //相當(dāng)于 Function.prototype.toString.call(Object) //就是Object 構(gòu)造函數(shù) 轉(zhuǎn)字符串的結(jié)果 // ObjectFunctionString 其實(shí)就是 "function Object() { [native code] }" 這樣的一個(gè)字符串 var ObjectFunctionString = fnToString.call(Object); function isPlainObject (obj) { var proto, Ctor; //先去掉類型不是 Object 的 //也就是用 Object.prototype.toString.call(obj) 這種方式,返回值不是 "[object Object]" 的,比如 數(shù)組 window history if (!obj || toString.call(obj) !== "[object Object]") { return false; } //獲取對(duì)象原型,賦值給 proto proto = getProto(obj); //如果對(duì)象沒(méi)有原型,那也算純粹的對(duì)象,比如用 Object.create(null) 這種方式創(chuàng)建的對(duì)象 if (!proto) { return true; } //最后判斷是不是通過(guò) "{}" 或 "new Object" 方式創(chuàng)建的對(duì)象 //如果 proto 有 constructor屬性,Ctor 的值就為 proto.constructor, //原型的 constructor 屬性指向關(guān)聯(lián)的構(gòu)造函數(shù) Ctor = hasOwn.call(proto, "constructor") && proto.constructor; //如果 Ctor 類型是 "function" ,并且調(diào)用Function.prototype.toString 方法后得到的字符串 與 "function Object() { [native code] }" 這樣的字符串相等就返回true //用來(lái)區(qū)分 自定義構(gòu)造函數(shù)和 Object 構(gòu)造函數(shù) return typeof Ctor === "function" && fnToString.call(Ctor) === ObjectFunctionString; }總結(jié)
從源碼來(lái)看,isPlainObject()方法 的實(shí)現(xiàn),主要分三部分
1、去掉類型不是Object 的,
用的是 Object.prototype.toString.call() 方法,這個(gè)方法所有類型都會(huì)得到不同的字符串,而不是用 typeof,因?yàn)?typeof 只能區(qū)分基本類型,比如數(shù)組,typeof 返回的還是 “object” 字符串
var arr = []; var obj = {}; typeof arr; //"object" typeof obj; //"object" typeof document; //"object" Object.prototype.toString.call(arr); //"[object Array]" Object.prototype.toString.call(obj); //"[object Object]" Object.prototype.toString.call(document); //"[object HTMLDocument]"
2、判斷對(duì)象有沒(méi)有原型,沒(méi)有原型的對(duì)象算純粹對(duì)象
3、判斷是不是通過(guò) "{}" 或 "new Object" 方式創(chuàng)建的對(duì)象
這就要判斷他們的構(gòu)造函數(shù)了,所以用 Function.prototype.toString 方法
Function 對(duì)象覆蓋了從 Object 繼承來(lái)的 Object.prototype.toString 方法。
函數(shù)的 toString 方法會(huì)返回一個(gè)表示函數(shù)源代碼的字符串。具體來(lái)說(shuō),包括 function關(guān)鍵字,形參列表,大括號(hào),以及函數(shù)體中的內(nèi)容。
function fn(said){ this.say = said; } Function.prototype.toString.call(fn); //"function fn(said){ // this.say = said; //}" Function.prototype.toString.call(Object); //"function Object() { [native code] }"
參考文章:
JavaScript專題之類型判斷(下)
文章版權(quán)歸作者所有,未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址:http://specialneedsforspecialkids.com/yun/92968.html
摘要:到目前為止,的貢獻(xiàn)者團(tuán)隊(duì)共名成員,多條,可想而知,是一個(gè)多么龐大的項(xiàng)目。參考源碼分析整體架構(gòu)源碼解析讀書筆記第二章構(gòu)造對(duì)象函數(shù)詳解本文在上的源碼地址,歡迎來(lái)。 歡迎來(lái)我的專欄查看系列文章。 決定你走多遠(yuǎn)的是基礎(chǔ),jQuery 源碼分析,向長(zhǎng)者膜拜! 我雖然接觸 jQuery 很久了,但也只是局限于表面使用的層次,碰到一些問(wèn)題,找到 jQuery 的解決辦法,然后使用。顯然,這種做法的...
摘要:專題系列預(yù)計(jì)寫二十篇左右,主要研究日常開發(fā)中一些功能點(diǎn)的實(shí)現(xiàn),比如防抖節(jié)流去重類型判斷拷貝最值扁平柯里遞歸亂序排序等,特點(diǎn)是研究和的實(shí)現(xiàn)方式。 JavaScript專題系列第五篇,講解更加復(fù)雜的類型判斷,比如 plainObject、空對(duì)象、類數(shù)組對(duì)象、Window對(duì)象、DOM 元素等 前言 在上篇《JavaScript專題之類型判斷(上)》中,我們抄襲 jQuery 寫了一個(gè) typ...
摘要:總結(jié)綜上所述,數(shù)組的深拷貝比較簡(jiǎn)單,方法沒(méi)有什么爭(zhēng)議,對(duì)象的深拷貝,比較好的方法是用的方法實(shí)現(xiàn),或者遞歸實(shí)現(xiàn),比較簡(jiǎn)單的深復(fù)制可以使用實(shí)現(xiàn)參考資料知乎中的深拷貝和淺拷貝深入剖析的深復(fù)制 深淺復(fù)制對(duì)比 因?yàn)镴avaScript存儲(chǔ)對(duì)象都是存地址的,所以淺復(fù)制會(huì)導(dǎo)致 obj 和obj1 指向同一塊內(nèi)存地址。我的理解是,這有點(diǎn)類似數(shù)據(jù)雙向綁定,改變了其中一方的內(nèi)容,都是在原來(lái)的內(nèi)存基礎(chǔ)上做...
摘要:變量表示深度復(fù)制時(shí)原始值的修正值。中的復(fù)制方法復(fù)制的方法分別是和。此處不能正確處理的深復(fù)制綜合三種方法來(lái)看不能復(fù)制對(duì)象以外的對(duì)象。 學(xué)習(xí)前端半年多了,還停留在新手村級(jí),寫的文章可能有很多問(wèn)題,思維方式和邏輯上還不夠嚴(yán)密,希望能指出問(wèn)題,謝謝! ===================================================================== 數(shù)...
摘要:先來(lái)看一個(gè)這樣的對(duì)象在函數(shù)的原型上擴(kuò)展了一個(gè)方法可以看到實(shí)例化的對(duì)象下有一個(gè)屬性,而這個(gè)屬性就指向構(gòu)造函數(shù)的原型對(duì)象。重點(diǎn)是,連接的是實(shí)例對(duì)象與構(gòu)造函數(shù)原型對(duì)象,而不是,實(shí)例對(duì)象和構(gòu)造函數(shù)。 前言 介紹原型的概念,和相關(guān)屬性,以及jquery判斷純凈對(duì)象的實(shí)現(xiàn),不小心點(diǎn)進(jìn)來(lái)的直接 ctrl+f 搜你想找的屬性。 什么是原型 isPrototypeOf() || Object.getP...
閱讀 1951·2021-09-07 09:59
閱讀 2520·2019-08-29 16:33
閱讀 3688·2019-08-29 16:18
閱讀 2849·2019-08-29 15:30
閱讀 1678·2019-08-29 13:52
閱讀 2035·2019-08-26 18:36
閱讀 530·2019-08-26 12:19
閱讀 694·2019-08-23 15:23