console.dir 和 console.log 的区别

Console 对象：Console 对象提供对浏览器调试控制台的访问，可以使用 F12 或 ctrl+shift+j 看到。Console 对象包含许多方法，其中 log() 和 dir() 使用最多。
console.log()方法将控制台中对象的 toString 表示形式打印给用户。
语法：

console.log(object) or console.log(string, object)

console.dir() 方法将控制台中指定对象的对象属性列表输出给用户。
语法：

console.dir(object)

简单来说，console.log() 以字符串表示形式返回对象，console.dir() 将对象识别为对象并输出其属性。log() 和 dir() 都将字符串作为字符串返回。

例子：

<!DOCTYPE html>
<html>

<head>

    <script>
        var str = Hello, Yiibai.com\n        var varObj = {
            book: harrypotter,
            price: 2000\n        };
        var varObj2 = [10, 20, 30];
        console.log(str);
        console.dir(str);
        console.dir(varObj);
        console.log(geek (log) = , varObj);
        console.dir(varObj2);
        console.log(varObj2 (log) = , varObj2);

        // Prints only string as dir() takes
        // only one parameter.
        console.dir(varObj2 (dir) = , varObj2);
    </script>
</head>

</html>

在上面的代码中，log() 打印对象的 toString 表示，而 dir() 识别对象并仅打印其属性。
上面的程序是在 chrome 中运行的，所以 log() 会打印树以及字符串信息，但是如果在 firefox 中运行 log() 只会打印出 toString 表示信息，而 dir() 在任何地方的行为都是一样的。
正如您在代码中看到的那样 console.log(varObj2 (log) = , varObj2); 只打印字符串部分，但不打印对象属性，因为 dir() 只接受一个参数，并将字符串视为传递给方法的唯一参数，而 log() 接受任意数量的参数。

console.dir 和 console.log 的区别

相关文章