快捷導(dǎo)航

JavaScript中的console.time()函數(shù)詳細(xì)介紹

更新時(shí)間：2014年12月29日 10:18:45 投稿：junjie

這篇文章主要介紹了JavaScript中的console.time()函數(shù)詳細(xì)介紹,console.time()函數(shù)主要用來(lái)統(tǒng)計(jì)程序執(zhí)行時(shí)間,需要的朋友可以參考下

如果需要在Web調(diào)試過(guò)程中知道代碼執(zhí)行的時(shí)間，那么可以通過(guò)在JavaScript代碼中添加console.time()語(yǔ)句和console.timeEnd()語(yǔ)句來(lái)對(duì)程序的執(zhí)行進(jìn)行計(jì)時(shí)。以下面這個(gè)耗時(shí)較長(zhǎng)的foo()函數(shù)為例：

復(fù)制代碼代碼如下:

function foo(){

    var x = 4.237;

    var y = 0;

    for (var i=0; i<100000000; i++) {

        y = y + x*x;

    }

    return y;

}

如果需要知道函數(shù)執(zhí)行過(guò)程中消耗了多長(zhǎng)時(shí)間，可以在foo()函數(shù)調(diào)用之前插入console.time()語(yǔ)句，在其調(diào)用結(jié)束后插入console.timeEnd()語(yǔ)句：

復(fù)制代碼代碼如下:

console.time("test");

foo();

console.timeEnd("test");

程序執(zhí)行完畢后，控制臺(tái)會(huì)顯示此次計(jì)時(shí)的結(jié)果：”test: 1797ms”，顯示的日志級(jí)別為info。

console.time()和console.timeEnd()接受一個(gè)字符串作為參數(shù)，該字符串相當(dāng)于計(jì)時(shí)的id。瀏覽器會(huì)將擁有相同參數(shù)(id)的console.time()與console.timeEnd()進(jìn)行配對(duì)，記錄兩者之間的時(shí)間差。因此，可以通過(guò)使用不同的id來(lái)對(duì)JavaScript程序中不同的地方進(jìn)行計(jì)時(shí)。

瀏覽器支持

對(duì)于各個(gè)瀏覽器，console.time()計(jì)時(shí)的支持情況如下：

Firefox。10.0后原生支持。對(duì)于之前版本的Firefox，可以通過(guò)安裝Firebug插件來(lái)實(shí)現(xiàn)。詳見(jiàn)：https://developer.mozilla.org/en-US/docs/Web/API/console.time?redirectlocale=en-US&redirectslug=DOM%2Fconsole.time
Google Chrome。2.0后原生支持。詳見(jiàn)：https://developers.google.com/chrome-developer-tools/docs/console-api#consoletimelabel
IE。IE11中原生支持。對(duì)于之前版本的IE，可以通過(guò)安裝Firebug Lite來(lái)實(shí)現(xiàn)。詳見(jiàn)：http://msdn.microsoft.com/en-us/library/ie/dn265071%28v=vs.85%29.aspx
Safari。4.0后原生支持。詳見(jiàn)：https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Console/Console.html
Opera。支持。詳見(jiàn)：http://www.opera.com/dragonfly/documentation/console/

您可能感興趣的文章:

相關(guān)文章

JavaScript中const、var和let區(qū)別淺析
在JavaScript中有三種聲明變量的方式：var、let、const。但是有朋友不清楚這三種聲明變量的區(qū)別，下面腳本之家小編給大家詳細(xì)介紹下js中const、var和let的區(qū)別，感興趣的朋友一起看看吧
2016-10-10
微信小程序?qū)崿F(xiàn)自動(dòng)播放視頻模仿gif動(dòng)圖效果實(shí)例
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)崿F(xiàn)自動(dòng)播放視頻模仿gif動(dòng)圖效果的相關(guān)資料,通過(guò)本文介紹的方法可以實(shí)現(xiàn)自動(dòng)播放視頻，視頻無(wú)控制條無(wú)聲音且自動(dòng)循環(huán)播放,需要的朋友可以參考下
2021-07-07
Javascript基礎(chǔ)教程之比較null和undefined值
這篇文章主要介紹了Javascript基礎(chǔ)教程之比較null和undefined值的相關(guān)知識(shí)，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友一起學(xué)習(xí)吧
2016-05-05
js判斷樣式className同時(shí)增加class或刪除class
用正則表達(dá)式判斷多個(gè)class之間是否存在真正的class（前后空格的處理)然后增加class刪除class，本文給予實(shí)現(xiàn)方法，感興趣的朋友可以了解下，或許對(duì)你有所幫助
2013-01-01
JavaScript實(shí)現(xiàn)點(diǎn)擊按鈕后變灰避免多次重復(fù)提交
注冊(cè)的時(shí)候需要發(fā)送驗(yàn)證激活帳號(hào)的郵件，為了避免郵件的多次重復(fù)發(fā)送，所以可以在點(diǎn)擊了發(fā)送后，設(shè)置按鈕變灰，倒計(jì)時(shí)一段時(shí)間后又可重復(fù)點(diǎn)擊，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下哈
2013-07-07
JS模擬鍵盤(pán)打字效果的方法
這篇文章主要介紹了JS模擬鍵盤(pán)打字效果的方法,涉及javascript鼠標(biāo)事件及字符串操作的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-08-08
微信小程序?qū)崿F(xiàn)用table顯示數(shù)據(jù)庫(kù)反饋的多條數(shù)據(jù)功能示例
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)用table顯示數(shù)據(jù)庫(kù)反饋的多條數(shù)據(jù)功能,涉及微信小程序wx.request訪問(wèn)php后臺(tái)及返回結(jié)果的顯示布局相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
JS實(shí)現(xiàn)一鍵復(fù)制
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)點(diǎn)擊按鈕復(fù)制文本，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-07-07
Bootstrap模態(tài)框調(diào)用功能實(shí)現(xiàn)方法
這篇文章主要介紹了Bootstrap模態(tài)框調(diào)用功能實(shí)現(xiàn)方法的相關(guān)資料，非常不錯(cuò)，具有參考借鑒價(jià)值，感興趣的朋友一起看看吧
2016-09-09
淺談JavaScript中數(shù)組的增刪改查
下面小編就為大家?guī)?lái)一篇淺談JavaScript中數(shù)組的增刪改查。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-06-06