Inspect getter

Quand on utilise des getter et des setter dans NodeJS avec l'aide de Object.defineProperty, on se retrouve face à une difficulté lors de l'affichage des objets dans la console. Là où un simple :

var a = {  
  prout: 'lol'
};

Affichera :

> console.log(a);
{ prout: 'lol' }

Si on utilise un getter :

function A() {  
  Object.defineProperty(this, 'prout', {
    enumerable: true,
    get: function() {
      return 'lol';
    }
  });
};

on aura :

> console.log(new A())
{ prout: [Getter] }

Ce qui est un peu génant pour débugger. Ce n'est pas un bug, contrairement à ce que pourraient proclamer les éternels trolls, mais simplement une protection. Un getter étant une fonction comme les autres, son éxécution peut avoir des répercutions ailleurs que sur cette propriété qui pourrait compromettre l'éxécution normale du script. C'est aussi pourquoi dans la console du navigateur, la propriété n'est pas affichée et qu'il faut cliquer sur les "…" pour la calculer à la demande :

Une fois qu'on sait ça et qu'on assume nos getter, on peut alors faire appel à JSON.stringify pour retrouver l'affichage classique :

> console.log(JSON.stringify(new A(), null, 4))
{
    "prout": "lol"
}

Mais on avouera que ça va vite devenir lourdingue si doit taper tout ça à chaque fois qu'on veut inspecter un truc.

Heureusement, la méthode console.log fait appel à la méthode inspect de l'objet qu'elle va afficher, si elle existe, pour permettre un affichage personnalisé. On peut donc ajouter cette méthode au prototype de notre objet pour continuer à n'utiliser que console.log :

function A() {  
  Object.defineProperty(this, 'prout', {
    enumerable: true,
    get: function() {
      return 'lol';
    }
  });
};
A.prototype.inspect = function() {  
  return JSON.stringify(this, null, 4);
}

Et donc :

> console.log(new A())
{
    "prout": "lol"
}

Hadrien

Hi, I'm a french Javascript Lead Developer, Web Architect from Toulouse, France. I've worked for 12 years for many projects with YUI, AngularJS, Aurelia.io and now React and React native.

Toulouse, France https://hadrien.eu