人類竟與臭蟲如此相似：無堅不摧。

Robert Frost

第七天的假日，最適合談談一些輕鬆的話題：臭蟲與除蟲debug。

一些新手，甚至我老練的同事，還是最習慣用console.log()來debug。這常常引的團隊中的另一位同事（我們都叫他除蟲專家）的強烈不滿。今天就來分享那些他偏愛的除蟲方法：包含console方法裡的四個姐妹console.trace()、console.time()、console.group()、以及console.assert()。最後還有一個小彩蛋。

使用console.trace()

一般來說，我們會用console.log()來追蹤或偵錯程式的進程。但當應用龐大寫牽扯多個模組或檔案時，console.log()的資訊很難滿足追蹤的需求。

// 除蟲專家不太喜歡的寫法
console.log("Ryvn's log");
// 

我們可以改成使用console.trace()，因為它會顯示完整的所經過的呼叫stack！

// 除蟲專家偏愛的寫法
const foo = () => {
    console.trace("Ryvn's log with stack");
}

foo();

// Ryvn's log with stack
// foo            @ index.html:8
// (anonymous)    @ index.html:13

使用console.time()

為了確保程序的執行效能，我們常常觀察某段複雜運算表達式們的執行時間。此時我們可以運用console.time()來設定計時器。

// 除蟲專家偏愛的寫法
console.time('t-0');

// time consuming operation
const lst = [];
for (let i = 0; i < 10000; i++) {
    lst.push(i);    
}

console.timeEnd('t-0');
// t-0: 0.760009765625 ms

今日未完待續...