javascript - 为什么 console.log() 不拍摄传递变量的快照？

Question

今天我在 javascript 中遇到了一些非常奇怪的行为。我想我现在已经弄清楚了，但我想知道我认为正在发生的事情是否真的发生了，或者是否还涉及其他一些魔法。这是我的代码:

    var SomeObject = {};

    SomeObject.foo = function(a, b) {
       var baz = this.bar(a, b);
       console.log(baz);
       console.log(baz.left);
       SomeObject.magicalStuff(baz);
    };

    SomeObject.bar = function(a, b) {
        return {left: a-b, top: b-a};
    };

    SomeObject.magicalStuff = function(position) {
        position.left = 0;
    };

    SomeObject.foo(100, 50);

The code at jsFiddle

其输出类似于(取决于浏览器):

> Object
50

如果展开“对象”(在 Chrome、Safari 或 Firefox (Firebug) 中)，您将得到:

> Object
    left: 0
    top: -50

而我期望的是:

> Object
    left: 50
    top: -50

我认为正在发生的事情是 console.log() 实际上只是“发布”对控制台的引用，一旦您单击“展开”符号，该引用就会被读取。但这是否违背了 console.log() 作为调试工具的目的？我一直期望 console.log() 能够“快照”我传递给它的内容。看到实际 console.log() 之后的语句更改了 console.log() 调用的输出，真是令人惊讶。

或者还有其他事情发生吗？

编辑:我还想知道浏览器开发人员是否有充分的理由来实现这样的console.log(我猜是有一个，否则它在主要浏览器中不会保持一致) )。

Answer 1

有console.dir()在 Firebug 中满足您的需求。

一般来说，不可能打印每层嵌套属性，因为对象可以包含循环引用，如 var a = {}; var b = {a: a}; a.b = b;

实现完美clone方法非常困难 - 我想它基本上必须转储整个内存，并且记录会花费很长时间。想想console.log(window) ...