如果需要在Web調試過程中知道代碼執行的時間,那麼可以通過在JavaScript代碼中添加console.time()語句和console.timeEnd()語句來對程式的執行進行計時。以下面這個耗時較長的foo()函數為例:
| 代碼如下 |
複製代碼 |
function foo(){ var x = 4.237; var y = 0; for (var i=0; i<100000000; i++) { y = y + x*x; } return y; } |
如果需要知道函數執行過程中消耗了多長時間,可以在foo()函數調用之前插入console.time()語句,在其調用結束後插入console.timeEnd()語句:
| 代碼如下 |
複製代碼 |
console.time("test"); foo(); console.timeEnd("test"); |
程式執行完畢後,控制台會顯示此次計時的結果:”test: 1797ms”,顯示的記錄層級為info。
console.time()和console.timeEnd()接受一個字串作為參數,該字串相當於計時的id。瀏覽器會將擁有相同參數(id)的console.time()與console.timeEnd()進行配對,記錄兩者之間的時間差。因此,可以通過使用不同的id來對JavaScript程式中不同的地方進行計時。
瀏覽器支援
對於各個瀏覽器,console.time()計時的支援情況如下:
Firefox。10.0後原生支援。對於之前版本的Firefox,可以通過安裝Firebug外掛程式來實現。詳見:https://developer.mozilla.org/en-US/docs/Web/API/console.time?redirectlocale=en-US&redirectslug=DOM%2Fconsole.time
Google Chrome。2.0後原生支援。詳見:https://developers.google.com/chrome-developer-tools/docs/console-api#consoletimelabel
IE。IE11中原生支援。對於之前版本的IE,可以通過安裝Firebug Lite來實現。詳見:http://msdn.microsoft.com/en-us/library/ie/dn265071%28v=vs.85%29.aspx
Safari。4.0後原生支援。詳見:https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html
Opera。支援。詳見:http://www.opera.com/dragonfly/documentation/console/