Mengapakah Chrome dan Safari memaparkan nilai objek yang berbeza dalam konsol berbanding Firefox?

Nilai Paparan Objek Berbeza dalam Chrome, Firefox dan Safari

Setelah menyahpepijat objek JavaScript dalam penyemak imbas berbeza, pembangun mungkin menghadapi percanggahan dalam nilai yang dipaparkan dalam konsol. Artikel ini meneroka isu ini, memberikan penjelasan untuk tingkah laku yang diperhatikan.

Isunya

Pertimbangkan kod JavaScript berikut:

var foo = {bar: 1111};
console.log(foo);
console.log(foo.bar);

foo.bar = 2222;
console.log(foo);
console.log(foo.bar);

Dalam Firefox, output yang dijangkakan ialah diperhatikan:

Object { bar=1111}
1111

Object { bar=2222}
2222

Walau bagaimanapun, dalam Chrome dan Safari, outputnya berbeza:

Object { bar=2222}
1111

Object { bar=2222}
2222

Penjelasan

Perbezaan ini timbul daripada keputusan reka bentuk dalam Chrome (dan, dengan sambungan, konsol penyemak imbas Safari). Apabila mengelog objek, Chrome membuat rujukan kepada objek itu sendiri. Apabila mengklik dan membuka tab objek dalam konsol, nilai log kekal malar, tanpa mengira sebarang perubahan seterusnya pada objek. Ini mewujudkan percanggahan antara nilai yang dipaparkan dan nilai sebenar objek dalam ingatan.

Penyelesaian

Untuk menyelesaikan isu ini dan mendapatkan output yang dijangkakan dalam Chrome dan Safari, pembangun boleh menggunakan sebarang kaedah untuk menyerikan objek, seperti JSON.stringify():

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

Ini akan memaparkan perwakilan JSON objek, memastikan output yang konsisten merentas semua penyemak imbas.

Atas ialah kandungan terperinci Mengapakah Chrome dan Safari memaparkan nilai objek yang berbeza dalam konsol berbanding Firefox?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!