Jak wyświetlić pełny obiekt w konsoli Chrome?

155 
var functor=function(){
    //test
}

functor.prop=1;

console.log(functor);

Pokazuje tylko część funkcyjną funktora, nie może pokazać właściwości funktora w konsoli.

javascript debugging google-chrome kocha wiosnę
źródło

Odpowiedzi:

245

Użyj, console.dir()aby wyświetlić obiekt z możliwością przeglądania, który możesz kliknąć zamiast .toString()wersji, na przykład:

console.dir(functor);

Drukuje reprezentację JavaScript określonego obiektu. Jeśli rejestrowany obiekt jest elementem HTML, to drukowane są właściwości jego reprezentacji DOM [1]

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

Nick Craver
źródło
1
Należy zauważyć, że samo drukowanie varNamew konsoli Chrome i naciśnięcie Enter daje taki sam efekt jak console.dir(varName).
Vadzim
118

Możesz uzyskać lepsze wyniki, jeśli spróbujesz:

console.log(JSON.stringify(functor));
BastiBen
źródło
ta odpowiedź jest świetna, ale myślę, że nie działa z powyższą próbką, próbowałem w nowej karcie i zwraca undefined
aitorllj93
1
Z całym szacunkiem dla tej odpowiedzi, w końcu zwraca łańcuch reprezentujący obiekt, a nie obiekt „przeglądalny” w konsoli, tak jak w tym przypadku chodzi o pytanie. To prawda, jeśli uruchomisz ten ciąg wyjściowy przez JSON.parse, powróci on do swojego formatu obiektowego, ale wtedy konsola nadal pokaże mu „.toString ()” i wrócimy do punktu wyjścia. Odpowiedź tutaj, przy użyciu „console.dir”, najlepiej pasuje do aktualnego pytania.
TheCuBeMan
21

Możesz uzyskać jeszcze lepsze wyniki, jeśli spróbujesz:

console.log(JSON.stringify(obj, null, 4));
Trident D'Gao
źródło
Ta odpowiedź poprawia @ BastiBen poprzez formatowanie danych wyjściowych.
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
źródło
8

to działało idealnie dla mnie:

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

możesz wyodrębnić dowolną tablicę utworzoną w konsoli w celu wyczyszczenia funkcji znajdowania / zamiany i późniejszego wykorzystania wyodrębnionych danych

domSurgeon
źródło
3
nieco bardziej szczegółowe:for (i in arr) { console.log(i); console.log(arr[i]); }
Geo
nie wyświetli właściwości i metod, których nie można wyliczyć
Barbu Barbu
0

Napisałem funkcję wygodnego drukowania rzeczy na konsoli.

// 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);

wyświetli w konsoli:

[
    "hello",
    123,
    {
        "a": 1,
        "b": [
            2,
            3
        ]
    }
]
John Henckel
źródło
0

Z nowoczesnymi przeglądarkami console.log(functor)działa doskonale (zachowuje się tak samo jak a console.dir).

akim
źródło
0

Zrobiłem funkcję odpowiedzi Trident D'Gao.

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

Jak tego użyć

print(obj);
Jens Törnell
źródło
-5

Aby wyprowadzić obj:

console.log(obj, null, 4)
Kulakov Serg
źródło