后端开发教程 - Java、Spring Boot 实战 - msg200.com
除了 console.log() 之外，还有其他方法可以在 JavaScript 中使用控制台
更新：应部分用户的请求，我新增了一些设置控制台输出样式的方法。请查看Facebook控制台，了解样式设置的实际效果。
使用 JavaScript 时，最先接触到的调试工具之一就是控制台。然而，我们大多数人只学习了如何使用 console.log() 来记录变量和字符串，但控制台对象上还有许多其他方法可以用来更有效地调试代码。
控制台.assert()
仅当第一个参数为假时才会向控制台写入消息。
console.assert()当你想有条件地打印错误消息时很有用
let a = 3
let b = 4
let c = 5
function isOdd(num){
console.assert((num % 2 === 0), "Number is odd")
}
isOdd(a) // output: Number is odd
isOdd(b) // output:
isOdd(c) // output: Number is odd
控制台.error()
将向控制台写入一条错误消息
console.error()当你想指出代码中存在破译错误时，这对于测试目的非常有用
console.error('There was an error with your code')
控制台.warn()
将会向控制台输出警告信息
console.warn()当你想指出代码中存在非破坏性错误时，这对于测试目的很有用
console.warn("Make sure to parse your numbers to integers")
console.group() 和 console.groupEnd()
将在控制台中创建一组消息。必须使用console.groupEnd()来指示组的结束。
console.group()当您需要将一组邮件集中保存时，此功能非常有用。如有需要，您还可以为群组添加标签。
// without label
console.log('Hello World!')
console.group()
console.log("I'm the first message")
console.log("I'm the second message")
console.log("I'm the third message")
console.groupEnd()
// with label
console.log('Hello World Pt.2!')
console.group('Group Label')
console.log("I'm a message")
console.log("I'm another message")
console.log("I'm also a message")
console.groupEnd()
控制台.table()
将在控制台视图中打印一个表格。
console.table()是我最喜欢的应用程序之一，因为它可以让您轻松地以有组织的方式查看一组数据。
此方法还将接受两个参数，tableData并且tableColumns.tableData是必需的，应该是数组或对象，而tabkeColumns是可选的，是一个包含要显示的列名称的数组。
// passing in an object
console.table({ firstname : "John", lastname : "Doe" })
// passing in an array
console.table(["Kobe", "Lebron", "Shaq"])
// passing in an array of objects
let city1 = { name: "Salt Lake City", state: "UT" }
let city2 = { name: "San Diego", state: "CA" }
let city3 = { name: "Houston", state: "TX" }
console.table([city1, city2, city3])
// specify we only want "name" column shown
let city1 = { name: "Salt Lake City", state: "UT" }
let city2 = { name: "San Diego", state: "CA" }
let city3 = { name: "Houston", state: "TX" }
console.table([city1, city2, city3], ["name"])
console.time() 和 console.timeEnd()
console.time()将在控制台视图中启动计时器，同时console.timeEnd()停止计时器并在控制台视图中显示结果
当你想查看代码运行时间时，这两个函数非常有用。你还可以传入一个可选的标签参数。
// without label
console.time()
for(let i=0; i<100000; i++){
// some code here
}
console.timeEnd()
// with label
console.time("Timer1: ")
for(let i=0; i<100000; i++){
// some code here
}
console.timeEnd("Timer1: ")
控制台.trace()
将记录堆栈跟踪以显示代码在某个点如何结束
console.trace()当你想查看函数调用时的跟踪信息时，它非常有用。你还可以传递一个可选的标签参数
function myHOF(){
myCallback()
}
function myCallback(){
console.trace()
}
myHOF()
格式说明符（设置输出样式）
控制台允许您指定要应用于输出的格式类型。所有格式说明符均以 % 开头，后跟一个字母。
我提供了一个表格，其中包含您可以使用的所有不同格式说明符，但对于本文，我将向您展示如何添加 CSS 样式。
| 说明符 | 输出 |
|---|---|
| %s | 将值格式化为字符串 |
| %i 或 %d | 将值格式化为整数 |
| ％f | 将值格式化为浮点数 |
| %o | 将值格式化为可扩展的 DOM 元素 |
| %氧 | 将值格式化为可扩展的 JS 对象 |
| %c | 将 CSS 样式规则应用于输出字符串 |
console.log("%c Here is some really large, red text", "font-size: 58px; color: red;")
console.log("%c I'm Serif and Blue", "color: blue; font-family: serif; font-size: 32px")
