console.log打印对象 - Javascript

在Javascript中，我们经常需要输出对象的一些属性或值来进行调试或者验证我们的代码是否正确。而console.log()是一个很常用的调试工具，可以输出一些有用的信息来帮助我们分析问题和进行调试。在本文中，我们将介绍如何使用console.log()来打印对象。

打印一个简单对象

假设我们有一个名为person的简单对象，包含了名字和年龄这两个属性。我们可以使用console.log()来打印出这个对象：

const person = {
  name: '张三',
  age: 23
};

console.log(person);

上述代码会输出如下结果：

{ name: '张三', age: 23 }

可以看到，console.log()方法把对象的所有属性和值打印出来了。

打印一个复杂对象

如果我们的对象比较复杂，比如包含嵌套的对象或者数组，我们可以使用console.dir()方法来打印它。console.dir()方法会打印对象的所有属性，还会展示出对象的层级关系。例如：

const library = {
  name: '图书馆',
  books: [
    {
      title: 'JavaScript高级程序设计',
      author: 'Nicholas C. Zakas'
    },
    {
      title: 'JavaScript语言精粹',
      author: 'Douglas Crockford'
    }
  ]
};

console.dir(library);

上述代码会输出如下结果：

{ name: '图书馆',
  books:
   [ { title: 'JavaScript高级程序设计', author: 'Nicholas C. Zakas' },
     { title: 'JavaScript语言精粹', author: 'Douglas Crockford' } ] }

可以看到，console.dir()方法能够很好地展示出复杂对象的层级关系。

打印一个带有样式的对象

console.log()方法还支持输出带有样式的对象。在打印函数中，我们可以加入一个CSS样式规则，会使输出的对象看起来更加漂亮。例如：

const styleObj = {
  color: 'blue',
  fontFamily: 'Arial'
};

console.log('%c This is a styled object!', 'color: red; font-size:large;', styleObj);

上述代码会输出如下结果：

This is a styled object!

结果中的" This is a styled object!"的颜色为红色，并且字号变大了。而styleObj则被输出为一个简单的对象。

结论

console.log()是一个很有用的调试工具，可以帮助我们输出对象的属性和值，甚至是嵌套的对象或者数组，并且还支持输出带有样式的对象。掌握console.log()的使用方法，将有助于我们更加高效地进行调试和开发。