JavaScript Object Dump

89

Apakah ada add-on / application pihak ketiga atau beberapa cara untuk melakukan dumping peta objek di skrip debugger untuk objek JavaScript?

Inilah situasinya ... Saya memiliki metode yang dipanggil dua kali, dan setiap kali ada sesuatu yang berbeda. Saya tidak yakin apa yang berbeda, tetapi ada sesuatu yang berbeda. Jadi, jika saya bisa membuang semua properti window (atau setidaknya window.document) ke editor teks, saya bisa membandingkan status antara dua panggilan dengan diff file sederhana. Pikiran?

javascript Jessy Houle
sumber
Kemungkinan duplikat dari Bagaimana cara menampilkan objek JavaScript?
Jan Hudec

Jawaban:

61

Firebug +console.log(myObjectInstance)

Darin Dimitrov
sumber
4
... dan kemudian lihat konsol Firebug dan bukan konsol Javascript standar . :-)
towi
3
IE memiliki konsol, tetapi pencatatan kembali objek [object Object]. Tidak terlalu berguna
Steve Robbins
5
@SteveRobbins, siapa yang menggunakan IE untuk mengembangkan aplikasi web saat ini? Secara pribadi, satu-satunya penggunaan yang saya temukan sejauh ini untuk Internet Explorer adalah mengunduh browser web asli setelah saya menginstal ulang sistem operasi Windows saya. Ngomong-ngomong, itulah satu-satunya saat saya meluncurkan perangkat lunak yang damai ini.
Darin Dimitrov
8
Setiap pengembang yang mendukung browser utama. Jika masalah hanya ada di IE, maka hanya bisa diuji di IE, jadi Anda harus menggunakan browser.
Steve Robbins
2
Dan jika Anda menggunakan node.js dan terminal .. Tidak ada firebug ??
Cheruvim
136 
console.log("my object: %o", myObj)

Jika tidak, Anda akan berakhir dengan representasi string yang terkadang menampilkan:

[object Object]

atau semacamnya.

Tim
sumber
3
hanya mencetak [Objek Objek] untuk Chrome dan Firefox. <shrug>
slashdottir
1
@slashdottir Ini benar-benar berfungsi di Chrome dan FF. Saya menggunakannya di Chrome setidaknya setiap minggu dan kadang-kadang di FF.
Tim
1
@Tim: Anda benar, itu berhasil. permisi. pengguna err
slashdottir
Bagaimana mungkin ini bukan jawaban yang dipilih? Beruntung saya bahwa ini dijawab pada hari ulang tahun saya 4 tahun yang lalu, ketika saya tidak menggunakan js.
Joey Carson
2
Di Meteor (sisi server) mencetak my object: %o. Tidak terlalu membantu :)
Erdal G.
45 
function mydump(arr,level) {
    var dumped_text = "";
    if(!level) level = 0;

    var level_padding = "";
    for(var j=0;j<level+1;j++) level_padding += "    ";

    if(typeof(arr) == 'object') {  
        for(var item in arr) {
            var value = arr[item];

            if(typeof(value) == 'object') { 
                dumped_text += level_padding + "'" + item + "' ...\n";
                dumped_text += mydump(value,level+1);
            } else {
                dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n";
            }
        }
    } else { 
        dumped_text = "===>"+arr+"<===("+typeof(arr)+")";
    }
    return dumped_text;
}
zhongshu
sumber
4
Perbarui kode Anda dengan mengubah nama fungsi, seperti dalam panggilan rekursi, ini disebut "dump" sementara waktu menentukan "mydump"
Vikas
7
Salin dan tempel: binnyva.blogspot.com/2005/10/…
utopianheaven
1
ini membunuh Chrome dan Firefox dengan "rekursi terlalu banyak" saat digunakan untuk memeriksa objek jquery
slashdottir
@slashdottir mudah diperbaiki, dengan memeriksaif (level > 10) return level_padding + '<< too deep >>';
John Henckel
"Terlalu banyak rekursi" terjadi karena referensi melingkar (ketika parameter anak dari satu objek mereferensikan objek induknya). Dapat diselesaikan dengan mengingat semua orang tua dari nilai saat ini dan jika nilai saat ini cocok dengan salah satu nilai induknya, berhentilah menggali lebih jauh.
Alex Velickiy
42

Jika Anda menggunakan Chrome, Firefox atau IE10 + mengapa tidak memperluas konsol dan menggunakan

(function() {
    console.dump = function(object) {
        if (window.JSON && window.JSON.stringify)
            console.log(JSON.stringify(object));
        else
            console.log(object);
    };
})();

untuk solusi lintas-browser yang ringkas.

Chris HG
sumber
Saya suka yang ini. Khusus untuk browser yang tidak mendukung object dumping.
Aley
Dan mungkin mengganti "else console.log (object);" dengan panggilan ke fungsi traversal kustom seperti di stackoverflow.com/a/3011557/2236012 di atas? ...;)
CB
@CB "rekursi terlalu banyak" dan browser yang dibekukan adalah hal yang saya dapatkan di Firefox dan Chrome.
slashdottir
3
JSON.stringify tidak dapat membuat serial struktur siklik. Ini tidak akan bekerja untuk semua objek.
Grzegorz Luczywo
24

Gunakan saja:

console.dir(object);

Anda akan mendapatkan representasi objek yang dapat diklik. Berfungsi di Chrome dan Firefox

mons droid
sumber
1
Chrome dan Firefox memberikan [Object Object]
slashdottir
Anda dapat mengujinya di Konsol (Tekan F12) dengan console.dir({bar:"foo"}); Apakah objek Anda menimpa metode toString?
mons droid
setidaknya bekerja di konsol. mungkin userr oleh saya. terima kasih
slashdottir
fitur yang begitu manis
tomalone
12

Untuk Chrome / Chromium

console.log(myObj)

atau itu setara

console.debug(myObj)
kaznovac.dll
sumber
4

Menggunakan console.log(object)akan membuang objek Anda ke konsol Javascript, tetapi itu tidak selalu yang Anda inginkan. Menggunakan JSON.stringify(object)akan mengembalikan sebagian besar barang untuk disimpan dalam variabel, misalnya untuk mengirimnya ke input textarea dan mengirimkan konten kembali ke server.

Sebastian
sumber