為什麼控制台日誌在 Chrome、Firefox 和 Safari 中顯示不同的值？

Chrome、Firefox 和Safari 中的控制台物件值差異

在JavaScript 中，物件透過引用儲存，這表示物件透過引用來儲存，這表示物件. log 呼叫使用物件參數記錄物件參考。在控制台中查看物件時，這可能會導致令人驚訝的行為。

在Firefox 的Firebug 中，記錄物件總是顯示正確的值：

Object { bar=1111 }
1111

Object { bar=2222 }
2222

但是，在Chrome 和Safari 的控制台中，觀察到不同的行為：

Object { bar=2222 }                      // Object shows updated value
1111                                      // Attribute value remains unchanged

Object { bar=2222 }                      // Object shows updated value
2222                                      // Attribute value is correct

這種不一致源自於Chrome（和Safari，因為它使用WebKit）在第一次console.log 呼叫後快取物件的設計決策。快取的值將用於所有後續的 console.log 調用，即使物件同時更新。

為了避免這種混亂，建議使用非物件方法來記錄物件值，例如：

console.log(JSON.stringify(foo));      // Serializes the object into a JSON string

或者，您可以使用Chrome 的toJSON 和valueOf 方法，它們提供類似的功能：

console.log(foo.toJSON());                // Invokes the object's `toJSON` method (if defined)
console.log(foo.valueOf());               // Invokes the object's `valueOf` method (if defined)

透過使用這些技術，您可以確保控制台中顯示的值是與物體的實際狀態一致。

以上是為什麼控制台日誌在 Chrome、Firefox 和 Safari 中顯示不同的值？的詳細內容。更多資訊請關注PHP中文網其他相關文章！