jQuery中的isPlainObject() 函數用于判斷指定參數是否是一個純粹的對象,返回值為Boolean類型。
"純粹的對象",就是通過 { }、new Object()、Object.create(null) 創建的對象。
這個方法的作用是為了跟其他的 Javascript對象如 null,數組,宿主對象(documents),DOM 等作區分,因為這些用 typeof 都會返回object。
使用
語法:$.isPlainObject( object )
參數說明:
object:任意類型 需要進行判斷的任意值。
$.isPlainObject({}); //true $.isPlainObject(new Object); //true $.isPlainObject(Object.create(null)); //true $.isPlainObject([]); //false $.isPlainObject(document); //false
源碼分析
我們來看看jQuery 3.3.1 版本下的源碼
var class2type = {}; //Object.getPrototypeOf() 方法返回指定對象的原型(內部[[Prototype]]屬性的值)。 var getProto = Object.getPrototypeOf; //相當于 Object.prototype.toString var toString = class2type.toString; //hasOwnProperty() 方法會返回一個布爾值,指示對象自身屬性中是否具有指定的屬性 //相當于 Object.prototype.hasOwnProperty var hasOwn = class2type.hasOwnProperty; //因為 hasOwn 是一個函數,所以這里調用的是內置對象 Function 的toString() 方法 //相當于 Function.prototype.toString var fnToString = hasOwn.toString; //相當于 Function.prototype.toString.call(Object) //就是Object 構造函數 轉字符串的結果 // ObjectFunctionString 其實就是 "function Object() { [native code] }" 這樣的一個字符串 var ObjectFunctionString = fnToString.call(Object); function isPlainObject (obj) { var proto, Ctor; //先去掉類型不是 Object 的 //也就是用 Object.prototype.toString.call(obj) 這種方式,返回值不是 "[object Object]" 的,比如 數組 window history if (!obj || toString.call(obj) !== "[object Object]") { return false; } //獲取對象原型,賦值給 proto proto = getProto(obj); //如果對象沒有原型,那也算純粹的對象,比如用 Object.create(null) 這種方式創建的對象 if (!proto) { return true; } //最后判斷是不是通過 "{}" 或 "new Object" 方式創建的對象 //如果 proto 有 constructor屬性,Ctor 的值就為 proto.constructor, //原型的 constructor 屬性指向關聯的構造函數 Ctor = hasOwn.call(proto, "constructor") && proto.constructor; //如果 Ctor 類型是 "function" ,并且調用Function.prototype.toString 方法后得到的字符串 與 "function Object() { [native code] }" 這樣的字符串相等就返回true //用來區分 自定義構造函數和 Object 構造函數 return typeof Ctor === "function" && fnToString.call(Ctor) === ObjectFunctionString; }
總結
從源碼來看,isPlainObject()方法 的實現,主要分三部分
1、去掉類型不是Object 的,
用的是 Object.prototype.toString.call() 方法,這個方法所有類型都會得到不同的字符串,而不是用 typeof,因為 typeof 只能區分基本類型,比如數組,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、判斷對象有沒有原型,沒有原型的對象算純粹對象
3、判斷是不是通過 "{}" 或 "new Object" 方式創建的對象
這就要判斷他們的構造函數了,所以用 Function.prototype.toString 方法
Function 對象覆蓋了從 Object 繼承來的 Object.prototype.toString 方法。
函數的 toString 方法會返回一個表示函數源代碼的字符串。具體來說,包括 function關鍵字,形參列表,大括號,以及函數體中的內容。
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] }"
相關推薦:
jQuery.isPlainObject() 函數使用詳解
以上就是jQuery中的isPlainObject()實例詳解的詳細內容,更多請關注php中文網其它相關文章!