HTML | DOM console.table() 方法

介绍

console.table() 是在控制台中以表格形式打印对象或数组的方法。它是 HTML | DOM 中的一部分，可以用于向开发者提供可读性更强的数据显示。

通过 console.table()，开发者可以更清晰地查看对象和数组的属性和值，并以表格的形式呈现出来。这使得分析和调试复杂的数据结构变得更加方便。

语法

console.table(data, columns);

参数

• data (必需)：要显示的对象或数组。
• columns (可选)：指定要显示的列，可以是一个字符串数组或对象数组。

示例

示例 1: 打印对象

const person = { name: 'John', age: 30, city: 'New York' };

console.table(person);

输出:

| (index) | Values | |---------|----------| | name | John | | age | 30 | | city | New York |

示例 2: 打印数组

const items = ['Apple', 'Banana', 'Orange'];

console.table(items);

输出:

| (index) | Values | |---------|--------| | 0 | Apple | | 1 | Banana | | 2 | Orange |

示例 3: 指定要显示的列

const people = [
  { name: 'John', age: 30, city: 'New York' },
  { name: 'Jane', age: 25, city: 'Los Angeles' },
  { name: 'Bob', age: 35, city: 'Chicago' }
];

console.table(people, ['name', 'city']);

输出:

| (index) | name | city | |---------|------|--------------| | 0 | John | New York | | 1 | Jane | Los Angeles | | 2 | Bob | Chicago |

注意事项

• console.table() 方法在不同的浏览器和控制台中的表现可能会有所不同。某些浏览器可能不支持此方法或以不同的方式呈现结果。
• 如果没有指定列名，则表格的列名将自动设置为对象或数组的属性名。

参考文献：MDN web docs - console.table()