為什麼 `console.log` 顯示非同步物件行為？-js教程-PHP中文網

為什麼 `console.log` 顯示非同步物件行為？

Barbara Streisand

發布： 2024-12-20 03:28:14

原創

131 人瀏覽過

Why Does `console.log` Show Asynchronous Object Behavior?

Console.log 中物件的非同步為

使用 console.log 檢查物件性質時，了解其非同步性非常重要。控制台同步接收物件引用，但僅在展開時顯示其屬性。如果在檢查對象之前修改對象，這可能會導致差異。

考慮以下程式碼：

foo = [{id: 1},{id: 2},{id: 3},{id: 4}, {id: 5}, ];
console.log('foo1', foo, foo.length);
foo.splice(2, 1);
console.log('foo2', foo, foo.length);

登入後複製

在 Chrome 中，這會產生以下輸出：

foo1 
[Object, Object, Object, Object, Object]  5
    0: Object
    1: Object
    2: Object
    3: Object
    length: 4
    __proto__: Array[0]
     5 (index):23
foo2 
[Object, Object, Object, Object]  4
    0: Object
    1: Object
    2: Object
    3: Object
    length: 4
    __proto__: Array[0]

登入後複製

最初，console.log 接收到物件 foo 的參考。但是，屬性會在物件被 foo.splice(2, 1) 修改後顯示。因此，輸出顯示更新後的值。

為了緩解此問題，有多種替代日誌記錄方法：

記錄單一物件值：

console.log(foo.id, foo.name, foo.age);

登入後複製

JSON將物件編碼為string:

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

登入後複製

JSON 重新編碼物件以保持可檢查性：

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

登入後複製

這些方法確保記錄的輸出反映記錄時物件的狀態。

以上是為什麼 `console.log` 顯示非同步物件行為？的詳細內容。更多資訊請關注PHP中文網其他相關文章！