Comment vérifier si un objet possède des propriétés en JavaScript ?

Question

En supposant que je déclare

var ad = {}; 

Comment puis-je vérifier si cet objet contiendra des propriétés définies par l'utilisateur ?

Answer 1

Pourquoi ne pas créer une fonction simple ?

function isEmptyObject(obj) {
  for(var prop in obj) {
    if (Object.prototype.hasOwnProperty.call(obj, prop)) {
      return false;
    }
  }
  return true;
}

isEmptyObject({}); // true
isEmptyObject({foo:'bar'});  // false

En hasOwnProperty directement sur la méthode Object.prototype n'est que d'ajouter un peu plus la sécurité Imaginez la situation suivante en utilisant un obj.hasOwnProperty(...) appel :

isEmptyObject({hasOwnProperty:'boom'});  // false

---

Remarque : _{(pour l'avenir)} La méthode ci-dessus s'appuie sur le for...in et cette déclaration ne fait qu'itérer sur l'élément énumérable dans la norme ECMAScript (3e édition) la plus largement appliquée actuellement, le programmeur n'a aucun moyen de créer des propriétés non énumérables.

Toutefois, la situation a changé avec l'arrivée de ECMAScript 5ème édition et nous sommes en mesure de créer des propriétés non dénombrables, non inscriptibles ou non supprimables, de sorte que la méthode ci-dessus peut échouer , par exemple :

var obj = {};
Object.defineProperty(obj, 'test', { value: 'testVal', 
  enumerable: false,
  writable: true,
  configurable: true
});
isEmptyObject(obj); // true, wrong!!
obj.hasOwnProperty('test'); // true, the property exist!!

Une solution ECMAScript 5 à ce problème serait la suivante :

function isEmptyObject(obj) {
  return Object.getOwnPropertyNames(obj).length === 0;
}

En Object.getOwnPropertyNames renvoie un Array contenant les noms des tous les propriétés propres d'un objet, énumérable ou non Cette méthode est actuellement mise en œuvre par les éditeurs de navigateurs, elle est déjà présente dans la version bêta de Chrome 5 et dans les dernières Nightly Builds de WebKit.

Object.defineProperty est également disponible sur ces navigateurs et sur les dernières versions Alpha de Firefox 3.7.

Answer 2

Vous pouvez parcourir en boucle les propriétés de votre objet de la manière suivante :

for(var prop in ad) {
    if (ad.hasOwnProperty(prop)) {
        // handle prop as required
    }
}

Il est important d'utiliser le hasOwnProperty() pour déterminer si l'objet possède la propriété spécifiée en tant que propriété directe, et non héritée de la chaîne de prototypes de l'objet.

Editer

Extrait des commentaires : Vous pouvez placer ce code dans une fonction et faire en sorte qu'il renvoie false dès qu'il atteint la partie où se trouve le commentaire

Answer 3

Avec jQuery que vous pouvez utiliser :

$.isEmptyObject(obj); // Returns: Boolean

Depuis jQuery 1.4, cette méthode vérifie à la fois les propriétés de l'objet lui-même et les propriétés héritées des prototypes (en ce sens qu'elle n'utilise pas hasOwnProperty).

Avec ECMAScript 5ème édition dans les navigateurs modernes (IE9+, FF4+, Chrome5+, Opera12+, Safari5+), vous pouvez utiliser l'option intégrée Object.keys méthode :

var obj = { blah: 1 };
var isEmpty = !Object.keys(obj).length;

Ou tout simplement JavaScript :

var isEmpty = function(obj) {
               for(var p in obj){
                  return false;
               }
               return true;
            };

Answer 4

La plupart des navigateurs récents (et node.js) supportent Object.keys() qui renvoie un tableau avec toutes les clés de votre objet littéral :

var ad = {}; 
Object.keys(ad).length;//this will be 0 in this case

Support des navigateurs : Firefox 4, Chrome 5, Internet Explorer 9, Opera 12, Safari 5

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

Answer 5

Si vous utilisez underscore.js, vous pouvez utiliser l'option _.isEmpty fonction :

var obj = {};
var emptyObject = _.isEmpty(obj);