Comment afficher l'objet complet dans la console Chrome?

155

var functor=function(){
    //test
}

functor.prop=1;

console.log(functor);

cela ne montre que la partie fonction du foncteur, ne peut pas afficher les propriétés du foncteur dans la console.

javascript debugging google-chrome

— amour
source

245

Utilisez console.dir()pour afficher un objet consultable sur lequel vous pouvez cliquer au lieu de la .toString()version, comme ceci:

console.dir(functor);

Imprime une représentation JavaScript de l'objet spécifié. Si l'objet en cours de journalisation est un élément HTML, alors les propriétés de sa représentation DOM sont imprimées ^[1]

[1] https://developers.google.com/web/tools/chrome-devtools/debug/console/console-reference#dir

— Nick Craver
source

1

Il convient de noter que le simple fait d'imprimer varNamedans la console Chrome et d'appuyer sur Entrée donne le même effet que console.dir(varName).

— Vadzim

118

Vous pourriez obtenir de meilleurs résultats si vous essayez:

console.log(JSON.stringify(functor));

— BastiBen
source

cette réponse est excellente mais je pense que cela ne fonctionne pas avec l'exemple ci-dessus, essayé dans un nouvel onglet et renvoie undefined

— aitorllj93

1

Avec tout le respect que je dois à cette réponse, elle renvoie finalement une chaîne représentant l'objet, et non un objet "navigable" dans la console, comme la question est ici. Certes, si vous exécutez cette chaîne de sortie via JSON.parse, elle reviendra à son format d'objet, mais la console affichera toujours un ".toString ()" et nous revenons à la case départ. La réponse ici avec l'utilisation de "console.dir" est la meilleure solution pour la question en cours.

— TheCuBeMan

21

Vous pourriez obtenir des résultats encore meilleurs si vous essayez:

console.log(JSON.stringify(obj, null, 4));

— Trident D'Gao
source

Cette réponse améliore celle de @ BastiBen en formatant la sortie.

— Xeoncross

12

var gandalf = {
  "real name": "Gandalf",
  "age (est)": 11000,
  "race": "Maia",
  "haveRetirementPlan": true,
  "aliases": [
    "Greyhame",
    "Stormcrow",
    "Mithrandir",
    "Gandalf the Grey",
    "Gandalf the White"
  ]
};
//to console log object, we cannot use console.log("Object gandalf: " + gandalf);
console.log("Object gandalf: ");
//this will show object gandalf ONLY in Google Chrome NOT in IE
console.log(gandalf);
//this will show object gandalf IN ALL BROWSERS!
console.log(JSON.stringify(gandalf));
//this will show object gandalf IN ALL BROWSERS! with beautiful indent
console.log(JSON.stringify(gandalf, null, 4));

— Kean Amaral
source

8

cela a parfaitement fonctionné pour moi:

for(a in array)console.log(array[a])

vous pouvez extraire n'importe quel tableau créé dans la console pour rechercher / remplacer le nettoyage et l'utilisation postérieure de ces données extraites

— domSurgeon
source

3

un peu plus détaillé:for (i in arr) { console.log(i); console.log(arr[i]); }

— Geo

il ne produira pas de propriétés et de méthodes qui ne sont pas énumérables

— Barbu Barbu

0

J'ai écrit une fonction pour imprimer facilement des choses sur la console.

// function for debugging stuff
function print(...x) {
    console.log(JSON.stringify(x,null,4));
}

// how to call it
let obj = { a: 1, b: [2,3] };
print('hello',123,obj);

affichera dans la console:

[
    "hello",
    123,
    {
        "a": 1,
        "b": [
            2,
            3
        ]
    }
]

— John Henckel
source

0

Avec les navigateurs modernes, console.log(functor)fonctionne parfaitement (se comporte de la même manière a console.dir).

— Akim
source

0

J'ai fait fonction de la réponse du Trident D'Gao.

function print(obj) {
  console.log(JSON.stringify(obj, null, 4));
}

Comment l'utiliser

print(obj);

— Jens Törnell
source

-5

Pour afficher obj:

console.log(obj, null, 4)

— Kulakov Serg
source