Bagaimana saya bisa membuat console.log menunjukkan keadaan objek saat ini?

Di Safari tanpa add-on (dan sebenarnya sebagian besar peramban lainnya), console.logakan menampilkan objek pada status eksekusi terakhir, bukan pada status saat console.logdipanggil.

Saya harus mengkloning objek hanya untuk output melalui console.loguntuk mendapatkan keadaan objek pada baris itu.

Contoh:

var test = {a: true}
console.log(test); // {a: false}
test.a = false; 
console.log(test); // {a: false}

Saya pikir Anda sedang mencari console.dir().

console.log()tidak melakukan apa yang Anda inginkan karena ia mencetak referensi ke objek, dan saat Anda membukanya, itu berubah. console.dirmencetak direktori properti di objek pada saat Anda memanggilnya.

Gagasan JSON di bawah ini adalah ide yang bagus; Anda bahkan bisa melanjutkan untuk mengurai string JSON dan mendapatkan objek yang dapat dijelajahi seperti apa yang akan diberikan oleh .dir ():

console.log(JSON.parse(JSON.stringify(obj)));

Apa yang biasanya saya lakukan jika saya ingin melihat keadaannya pada saat itu adalah saya hanya mengonversinya menjadi string JSON.

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

Vanilla JS:

@ jawaban evan sepertinya yang terbaik di sini. Cukup (ab) gunakan JSON.parse / stringify untuk secara efektif membuat salinan objek.

console.log(JSON.parse(JSON.stringify(test)));

Solusi spesifik JQuery:

Anda dapat membuat snapshot objek pada titik waktu tertentu dengan jQuery.extend

console.log($.extend({}, test));

Apa yang sebenarnya terjadi di sini adalah jQuery adalah membuat objek baru dengan testkonten objek, dan mencatatnya (sehingga tidak akan berubah).

AngularJS (1) solusi spesifik:

Angular menyediakan copyfungsi yang dapat digunakan untuk efek yang sama:angular.copy

console.log(angular.copy(test));

Fungsi bungkus Vanilla JS:

Berikut adalah fungsi yang membungkus console.logtetapi akan membuat salinan dari setiap benda sebelum log mereka keluar.

Saya menulis ini sebagai jawaban atas beberapa fungsi yang serupa tetapi kurang kuat dalam jawabannya. Ini mendukung banyak argumen, dan tidak akan mencoba untuk menyalin sesuatu jika mereka bukan objek biasa .

function consoleLogWithObjectCopy () {
  var args = [].slice.call(arguments);
  var argsWithObjectCopies = args.map(copyIfRegularObject)
  return console.log.apply(console, argsWithObjectCopies)
}

function copyIfRegularObject (o) {
  const isRegularObject = typeof o === 'object' && !(o instanceof RegExp)
  return isRegularObject ? copyObject(o) : o
}

function copyObject (o) {
  return JSON.parse(JSON.stringify(o))
}

contoh penggunaan :consoleLogWithObjectCopy('obj', {foo: 'bar'}, 1, /abc/, {a: 1})

Itu > Objectdi konsol, tidak hanya menunjukkan kondisi saat ini. Sebenarnya menunda membaca objek dan properti itu sampai Anda memperluasnya.

Sebagai contoh,

var test = {a: true}
console.log(test);
setTimeout(function () {
    test.a = false; 
    console.log(test);
}, 4000);

Kemudian perluas panggilan yang pertama, jika Anda melakukannya sebelum yang kedua console.logkembali

menggunakan petunjuk Xeon06, Anda dapat mengurai JSON-nya di sebuah objek, dan di sini adalah fungsi log yang sekarang saya gunakan untuk membuang objek saya:

function odump(o){
   console.log($.parseJSON(JSON.stringify(o)));
}

Saya mendefinisikan sebuah utilitas:

function MyLog(text) {
    console.log(JSON.stringify(text));
}

dan ketika saya ingin masuk konsol saya cukup lakukan:

MyLog("hello console!");

Ini bekerja dengan sangat baik!

Anda mungkin ingin mencatat objek dengan cara yang dapat dibaca manusia:

console.log(JSON.stringify(myObject, null, 2));

Ini indentasi objek dengan 2 spasi di setiap level.

Bagaimana saya bisa mencetak JSON menggunakan JavaScript?

Ada opsi untuk menggunakan perpustakaan debugger.

https://debugjs.net/

Cukup sertakan skrip ke halaman web Anda dan masukkan pernyataan log.

<script src="debug.js"></script>

Penebangan

var test = {a: true}
log(test); // {a: true}
test.a = false; 
log(test); // {a: false}

Saya mungkin tertembak karena menyarankan ini, tetapi ini bisa diambil satu langkah lebih jauh. Kita dapat langsung memperluas objek konsol itu sendiri untuk membuatnya lebih jelas.

console.logObject = function(o) {
  (JSON.stringify(o));
}

Saya tidak tahu apakah ini akan menyebabkan beberapa jenis tabrakan perpustakaan / kehancuran nuklir / rip dalam ruangwaktu kontinum. Tapi itu bekerja dengan baik dalam tes qUnit saya. :)

Cukup segarkan halaman setelah Anda membuka konsol atau membuka konsol sebelum Anda mengirimkan permintaan ke halaman yang ditargetkan ....

Cukup cetak seluruh objek pada konsol.

console.dir(object);