今天是第 13 天了，今天的主題是認識 Console 用法，因為到目前為止我只有用過 console.log，一樣也是偶然看到一篇文章在介紹除了 console.log，還有其他好用的語法，所以今天就來筆記常用的語法並分享給大家囉！
Console Object
Console 物件是屬於 Window 物件的屬性之一，是在瀏覽器上 debug 用。因為是全域物件，所以可以在前面寫上 window，或是省略。window.console 或是 console。
- console.log()
- console.warn()
- console.error()
- console.time()
- console.timeEnd()
- console.table()
- console.assert()
- console.clear()
- console.count()
- console.group()
- console.groupCollapsed()
- console.groupEnd()
- console.info()
- console.trace()
console.log()
一般用法
如果我想要一次印出很多變數。
好像有點太長了，這時我們可以變成物件。
加上 CSS 樣式
我們也可以加上 CSS，只要在想變動的文字前面加上 %c，後面寫上樣式，兩者個加上單引號，並以逗號區隔，`’%c文字’, ‘樣式’`。
可以看到 name 呈現紅色字。
console.warn()
如果一次印出多個訊息，會不容易找到你想要的那個訊息。
這時候就可以使用 console.warn()，因為它有特殊黃色標記，它常用在輸出警告訊息。
console.error()
console.error() 有著特殊紅色標記，常用在輸出錯誤訊息。
還會印出函數調用的堆疊關係
在對伺服器發送 HTTP 請求，當請求發生錯誤想印出時，使用它也是一個好選擇喔！
console.time()
啟動計時器，可以測試程式碼的操作時間。
語法：console.time(label)，label 為計時器的名稱。
console.timeEnd()
停止之前使用 console.time() 所啟動的計時器。
語法：console.timeEnd(label)。
也可以同時使用多個記時器，但是計時器要記得命名喔。
console.table()
讓 data 以表格的型態顯示。
語法：console.table(tabledata, tablecolumns)，第二個屬性為選擇性。
一個 Array，
一個 Object，
Object 的屬性值是 Array 的話，
也可以使用在包含多個 Object 的 Array，
第二個屬性，可以指定要印出的欄位，
console.assert()
如果 expression 表達式計算為 false，就會印出訊息。
語法：console.assert(expression, message)
上圖可以看出 x + y = 6，第一行 console.assert() 因為計算正確，沒有印出訊息，第二行計算錯誤，所以有印出錯誤訊息。
剩下 7 個，明天會再繼續 ~~
Demo，可以把程式碼複製到 Devtools 的 Console 裡試看看喔！
參考資料：
JavaScript in Plain English — It’s 2022, Please Don’t Just Use “console.log” Anymore
W3schools — Window Console Object
文章同步更新於 2022 IT鐵人賽
