La création d'un objet JS avec Object.create(null) est-elle identique à {} ?

Question

Je connais beaucoup de façons de créer des objets JS mais je ne connaissais pas le Object.create(null) de l'un d'entre eux.

Question :

c'est exactement la même chose que :

var p = {}

vs

var p2 = Object.create(null);

?

Answer 1

Ils ne sont pas équivalents. {}.constructor.prototype == Object.prototype tandis que Object.create(null) n'hérite de rien et n'a donc aucune propriété.

En d'autres termes : Un objet javascript hérite d'Object par défaut, sauf si vous le créez explicitement avec null comme prototype, comme : Object.create(null) .

{} serait plutôt équivalent à Object.create(Object.prototype) .

---

Dans Chrome Devtool, vous pouvez voir que Object.create(null) n'a pas __proto__ tandis que {} fait.

Answer 2

Ils ne sont absolument pas équivalents. J'écris cette réponse pour expliquer plus en détail pourquoi cela fait une différence.

1. var p = {};

   Crée un objet qui hérite des propriétés et des méthodes de Object .

2. var p2 = Object.create(null);

   Crée un objet qui n'hérite de rien.

Si vous utilisez un objet comme carte et que vous créez un objet en utilisant la méthode 1 ci-dessus, vous devez faire très attention lorsque vous effectuez des recherches dans la carte. Parce que les propriétés et les méthodes de Object sont héritées, votre code peut se heurter à un cas où il y a des clés dans la carte que vous n'avez jamais insérées. Par exemple, si vous avez effectué une recherche sur toString vous trouverez une fonction, même si vous n'avez jamais placé cette valeur à cet endroit. Vous pouvez contourner ce problème de la manière suivante :

if (Object.prototype.hasOwnProperty.call(p, 'toString')) {
    // we actually inserted a 'toString' key into p
}

_{Notez qu'il est possible d'assigner quelque chose à <code>p.toString</code> il remplacera simplement l'héritage <code>toString</code> fonction sur <code>p</code> .}

Notez que vous ne pouvez pas simplement faire p.hasOwnProperty('toString') parce que vous avez peut-être inséré une clé "hasOwnProperty" dans p Nous l'obligeons donc à utiliser l'implémentation de l'option Object .

D'un autre côté, si vous utilisez la méthode 2 ci-dessus, vous n'aurez pas à vous soucier de choses comme Object apparaissant sur la carte.

On ne peut pas vérifier l'existence d'une propriété avec un simple if comme ça :

// Unreliable:
if (p[someKey]) {
    // ...
}

La valeur peut être une chaîne vide, peut être false o null o undefined o 0 o NaN etc. Pour vérifier l'existence d'une propriété, vous devez toujours utiliser la méthode suivante Object.prototype.hasOwnProperty.call(p, someKey) .

Answer 3

Créer des objets en utilisant {} va créer un objet dont le prototype est Object.prototype qui hérite des fonctions de base de Object prototype lors de la création d'objets en utilisant Object.create(null) créera un objet vide dont le prototype est nul.

Answer 4

Si quelqu'un cherche à mettre en œuvre Object.create(null) juste pour savoir comment ça marche. Il est écrit en utilisant __proto__ qui n'est pas standard et donc, Je ne le recommande pas .

function objectCreateMimic()
{
  /*optional parameters: prototype_object, own_properties*/
  var P = arguments.length>0?arguments[0]:-1;
  var Q = arguments.length>1?arguments[1]:null;
  var o = {};
  if(P!==null && typeof P === "object")
  {
    o.__proto__ = P;
  }
  else if(P===null)
  {
    o.__proto__ = null;
  }
  if(Q!==null && typeof Q === "object")
  {
   for(var key in Q)
   {
     o[key] = Q[key];
   }
  }
  return o;
}

Note : J'ai écrit ceci, par curiosité, et ce n'est écrit qu'en termes simples, par exemple, je ne transfère pas les descripteurs de propriétés du deuxième objet vers l'objet de retour.

Answer 5

Lorsque vous créez un objet avec Object.create(null), cela signifie que vous créez un objet sans prototype. null signifie ici la fin de la chaîne des prototypes. Néanmoins, lorsque vous créez un objet comme {}, le prototype de l'objet est ajouté. Il s'agit donc de deux objets différents, l'un avec prototype, l'autre sans prototype. J'espère que cela vous aidera.