蓋索林 Gasolin

人們總是高估一年可以完成的事,卻低估十年能完成的事

0%

3 分鐘學會用 firebug 除錯

firebug 是 firefox 的一個插件. 可以說是當前用來 debug javascript 程式的最佳選擇. firebug 還提供了一些好用的函式可以讓您的測試更順暢.

這段影片 展示了 firebug 提供的一些好用的函式.

廢話不多說, 馬上來看看吧:

印出一般訊息 : console.log

就像許多程式語言中的 ‘print’ 語句, firebug 提供的 console.log 語句可以直接印出變數值. 例如

console.log(變數);

或者印出包含變數的敘述

console.log(“敘述: %d”%變數);

印出具有提示圖示的訊息 console.info/console.warn/console.error

與印出一般訊息(console.log)使用的方式完全相同, console.info/console.warn/console.error 只是會在訊息前加上相應圖示

console.info(a) 提示圖示 console.warn(b) 警示圖示 console.error© 錯誤圖示

使用除錯介面 debugger

只要在想要除錯的地方前加上一行加上 debugger 語句

debugger; …

執行時就會彈出一個互動式的除錯介面. 除錯介面提供了單步執行等功能, 並即時取得當前各相關變數的狀態. 也可以看到迴圈每次執行後改變的值

計算花費時間 console.time/console.timeEnd

對於 AJAX 程式來說有些動作會花費較多的時間, 使用

console.time(“跑”) … console.timeEnd(“跑”)

將要測試的程式段包起來, 執行時就會印出該段程式所花費的執行時間