灵活使用 console 让 js 调试更简单

正文

请到「今天看啥」查看全文

不过，还有一个更大的优势，因为输出是警告而不是信息，所以你可以过滤掉所有 console.log 并仅保留 console.warn 。这对于偶尔会在浏览器中输出大量无用废话的应用程序尤其有用。清除一些无用的信息可以让你更轻松地看到你想要的输出。

console.table()

令人惊讶的是，这并不是更为人所知，但是 console.table() 函数旨在以一种比仅仅转出原始对象数组更整洁的方式显示表格数据。

例如，这里有一个数据列表。

const data = [{id: "7cb1-e041b126-f3b8",seller: "WAL0412",buyer: "WAL3023",price: 203450,time: 1539688433},{id: "1d4c-31f8f14b-1571",seller: "WAL0452",buyer: "WAL3023",price: 348299,time: 1539688433},{id: "b12c-b3adf58f-809f",seller: "WAL0012",buyer: "WAL2025",price: 59240,time: 1539688433}];

如果我们使用 console.log 来输出上面的内容，我们会得到一些非常无用的输出：

▶ (3) [{…}, {…}, {…}]

点击这个小箭头可以展开看到对象的内容，但是，它并不是我们想要的“一目了然”。

但是 console.table(data) 的输出要有用得多。

第二个可选参数是所需列的列表。显然，所有列都是默认值，但我们也可以这样做：

> console.table(data, ["id", "price"]);

这里要注意的是这是乱序的 - 最右边的列标题上的箭头显示了原因。我点击该列进行排序。找到列的最大或最小，或者只是对数据进行不同的查看非常方便。顺便说一句，该功能与仅显示一些列无关，它总是可用的。

console.table() 只能处理最多1000行，因此它可能不适合所有数据集。

console.assert()

assert() 与 log() 是相同的函数， assert() 是对输入的表达式进行断言，只有表达式为false时，才输出相应的信息到控制台，示例如下：

var arr = [1, 2, 3];console.assert(arr.length === 4);

有时我们需要更复杂的条件句。例如，我们已经看到了用户 WAL0412 的数据问题，并希望仅显示来自这些数据的事务，这是直观的解决方案。

console.assert(tx.buyer === 'WAL0412', tx);

这看起来不错，但行不通。记住，条件必须为 false ，断言才会执行，更改如下：

console.assert(tx.buyer !== 'WAL0412', tx);

与其中一些类似， console.assert() 并不总是特别有用。但在特定的情况下，它可能是一个优雅的解决方案。

console.count()

另一个具有特殊用途的计数器，count只是作为一个计数器，或者作为一个命名计数器，可以统计代码被执行的次数。

for(let i = 0; i < 10000; i++) {

请到「今天看啥」查看全文