Chrome的JavaScript控制台是否懒于评估对象？

javascript javascript-objects google-chrome console.log

2022-08-30 02:22:51

我将从代码开始：

var s = ["hi"];
console.log(s);
s[0] = "bye";
console.log(s);

很简单，对吧？对此，Firefox控制台说：

[ "hi" ]
[ "bye" ]

很棒，但是Chrome的JavaScript控制台（7.0.517.41测试版）说：

[ "bye" ]
[ "bye" ]

我是否做错了什么，或者Chrome的JavaScript控制台在评估我的数组时非常懒惰？

答案 1

感谢您的评论，tec。我能够找到一个现有的未经证实的Webkit错误，它解释了这个问题：https://bugs.webkit.org/show_bug.cgi?id=35801（编辑：现已修复！

关于它有多大的错误以及它是否可修复，似乎存在一些争论。对我来说，这确实是一种糟糕的行为。这对我来说尤其令人不安，因为至少在Chrome中，当代码驻留在立即执行的脚本中（在页面加载之前）时，即使控制台打开，每当页面刷新时，也会发生这种情况。调用控制台.log当控制台尚未处于活动状态时，只会导致对正在排队的对象的引用，而不是控制台将包含的输出。因此，在控制台准备就绪之前，不会计算数组（或任何对象）。这确实是一个懒惰评估的情况。

但是，有一种简单的方法可以在代码中避免这种情况：

var s = ["hi"];
console.log(s.toString());
s[0] = "bye";
console.log(s.toString());

通过调用 toString，您可以在内存中创建一个表示形式，该表示形式不会被以下语句更改，控制台将在准备就绪时读取该语句。控制台输出与直接传递对象略有不同，但似乎可以接受：

hi
bye

答案 2

从Eric的解释来看，这是由于排队，它打印了数组（或对象）的较晚值。console.log()

可能有 5 种解决方案：

1. arr.toString()   // not well for [1,[2,3]] as it shows 1,2,3
2. arr.join()       // same as above
3. arr.slice(0)     // a new array is created, but if arr is [1, 2, arr2, 3] 
                    //   and arr2 changes, then later value might be shown
4. arr.concat()     // a new array is created, but same issue as slice(0)
5. JSON.stringify(arr)  // works well as it takes a snapshot of the whole array 
                        //   or object, and the format shows the exact structure