MDN’s new design is in Beta! A sneak peek: https://blog.mozilla.org/opendesign/mdns-new-design-beta/

Console.table()

这篇翻译不完整。请帮忙从英语翻译这篇文章

Displays tabular data as a table.

这个方法接收一个强制的参数,它必须是一个数组或者是一个对象,还可以接受一个额外的参数描述表格的列数。

它把数据以table的形式打印出来, 在数组中的每一个元素(或对象中可枚举的属性)将会以行的形式显示在table中。

table的第一列是index。如果数据是一个数组,那么值就是索引。 如果数据是一个对象,那么它的值就是属性名称。 注意(在FireFox中)console.table 被限制了不能显示超过1000行(第一行用来标记索引)。

Note: 此特性在 Web Worker 中可用。

Collections of primitive types

The data argument may be an array or an object.

// an array of strings

console.table(["apples", "oranges", "bananas"]);

// an object whose properties are strings

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

var me = new Person("John", "Smith");

console.table(me);

Collections of compound types

If the elements in the array, or properties in the object, are themselves arrays or objects, then their elements or properties are enumerated in the row, one per column:

// an array of arrays

var people = [["John", "Smith"], ["Jane", "Doe"], ["Emily", "Jones"]]
console.table(people);

Table displaying array of arrays

// an array of objects

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

var john = new Person("John", "Smith");
var jane = new Person("Jane", "Doe");
var emily = new Person("Emily", "Jones");

console.table([john, jane, emily]);

Note that if the array contains objects, then the columns are labeled with the property name.

Table displaying array of objects

// an object whose properties are objects

var family = {};

family.mother = new Person("Jane", "Smith");
family.father = new Person("John", "Smith");
family.daughter = new Person("Emily", "Smith");

console.table(family);

Table displaying object of objects

Restricting the columns displayed

By default, console.table() lists all elements in each row. You can use the optional columns parameter to select a subset of columns to display:

// an array of objects, logging only firstName

function Person(firstName, lastName) {
  this.firstName = firstName;
  this.lastName = lastName;
}

var john = new Person("John", "Smith");
var jane = new Person("Jane", "Doe");
var emily = new Person("Emily", "Jones");

console.table([john, jane, emily], ["firstName"]);

Table displaying array of objects with filtered output

Sorting columns

You can sort the table by a particular column by clicking on that column's label.

Syntax

console.table(data [, columns]);

Parameters

data
The data to display. This must be either an array or an object.
columns
An array containing the names of columns to include in the output.

Specifications

Specification Status Comment
Console API
console.table()
Living Standard Initial definition

Browser compatibility

Feature Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari
Basic support (Yes) (Yes) 34.0 (34.0) 未实现 (Yes) (Yes)
Available in workers (Yes) (Yes) 38.0 (38.0) ? (Yes) ?
Feature Android Edge Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support ? (Yes) 34.0 (34.0) ? ? ?
Available in workers ? (Yes) 38.0 (38.0) ? ? ?

文档标签和贡献者

 此页面的贡献者: zzw918
 最后编辑者: zzw918,