console.dir和console.log之间有什么区别？

Question

在Chrome中，console对象定义了两个似乎执行相同操作的方法：

console.log(...)
console.dir(...)

我在网上读到，dir在记录对象之前获取对象的副本，而log只是将引用传递给控制台，这意味着当您去检查您记录的对象时，它可能已经更改了。然而，一些初步的测试表明，它们并没有什么区别，而且它们都有可能显示对象的状态与记录对象时的状态不同。

在Chrome控制台(Ctrl+Shift+J)中尝试此操作，以了解我的意思：

> o = { foo: 1 }
> console.log(o)
> o.foo = 2

Answer 1

在Firefox中，这些函数的行为完全不同:log只打印出ToString表示形式，而Dir则打印出可导航树。

在Chrome中，log已经打印出一个树--大多数时候都是这样。但是，Chrome的log仍然可以区分某些对象类，即使它们具有属性。也许最明显的差异例子是正则表达式：

> console.log(/foo/);
/foo/

> console.dir(/foo/);
* /foo/
    global: false
    ignoreCase: false
    lastIndex: 0
    ...

您还可以看到与数组（例如，console.dir([1,2,3]))的明显区别，它们是与普通对象不同的log:

> console.log([1,2,3])
[1, 2, 3]

> console.dir([1,2,3])
* Array[3]
    0: 1
    1: 2
    2: 3
    length: 3
    * __proto__: Array[0]
        concat: function concat() { [native code] }
        constructor: function Array() { [native code] }
        entries: function entries() { [native code] }
        ...