Detaillierte Erläuterung der isPlainObject()-Instanzen in jQuery

Die Funktion isPlainObject() in jQuery wird verwendet, um zu bestimmen, ob der angegebene Parameter ein reines Objekt ist und der Rückgabewert vom Typ Boolean ist.

„Reine Objekte“ sind Objekte, die durch {}, new Object(), Object.create(null) erstellt wurden.

Der Zweck dieser Methode besteht darin, sie von anderen JavaScript-Objekten wie Null, Arrays, Hostobjekten (Dokumenten), DOM usw. zu unterscheiden, da die Verwendung von typeof auf diese ein Objekt zurückgibt.

Verwenden Sie

Syntax:
$.isPlainObject( object )
Parameterbeschreibung:
Objekt: jeder Typ, der sein muss Bewertet Jeder Wert.

$.isPlainObject({});    //true
$.isPlainObject(new Object);    //true
$.isPlainObject(Object.create(null));    //true
$.isPlainObject([]);    //false
$.isPlainObject(document);    //false

Quellcode-Analyse

Werfen wir einen Blick auf den Quellcode unter jQuery 3.3.1-Version

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;
}

Zusammenfassung

Von der Aus Sicht des Quellcodes ist die Implementierung der isPlainObject()-Methode hauptsächlich in drei Teile unterteilt.
1. Entfernen Sie die Typen, die nicht Object.toString.call() sind Die Methode erhält unterschiedliche Zeichenfolgen für alle Typen, da typeof nur grundlegende Typen wie Arrays unterscheiden kann. Typeof gibt weiterhin die Zeichenfolge „Objekt“ zurück.

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 Bestimmen Sie, ob das Objekt eine hat Prototyp. Objekte ohne Prototypen gelten als reine Objekte

3. Bestimmen Sie, ob das Objekt durch die Methode „{}“ oder „new Object“ erstellt wird

Dies erfordert die Beurteilung ihres Konstruktors, also verwenden Sie den Function.prototype. toString-Methode

Das Funktionsobjekt überschreibt die von Object geerbte Object.prototype.toString-Methode.

Die toString-Methode der Funktion gibt einen String zurück, der den Quellcode der Funktion darstellt. Insbesondere umfasst es das Funktionsschlüsselwort, die formale Parameterliste, geschweifte Klammern und den Inhalt im Funktionskörper.

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] }"

Verwandte Empfehlungen:

Detaillierte Erklärung der Funktion jQuery.isPlainObject()

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung der isPlainObject()-Instanzen in jQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!