如何檢查JavaScript中每次運行的執行時間？

Question

我有這個簡單的功能來計算字母頻率。

我的代碼是：

function getFreq(str){ 
 
    var freq={}; 
 
str.replace(/[a-z A-Z]/g, function(match){ 
 
    freq[match] = (freq[match] || 0) + 1; 
 
    return match; 
 
    }); 
 
    console.log(JSON.stringify(freq)); 
 
    return freq; 
 
} 
 

 

 

 
var t0 = performance.now(); 
 
function doSomething(s){ 
 
    getFreq(s); 
 
}; 
 
var t1 = performance.now(); 
 
console.log("Call to doSomething took " + (t1 - t0) + " ms.")

Enter Here : <input type="text" onchange="doSomething(this.value);" />

我已經想打字的輸入框中一些文本後計算getFreq函數的執行速度。但是即使在輸入框中沒有任何數據，這裏dosomething函數也會運行，並且即使在輸入一些數據後也顯示相同的執行時間。

Answer 1

有API console.time（）和console.timeEnd（）之前，u可以使用這API

更多信息 - https://developer.mozilla.org/en-US/docs/Web/API/Console/time

見下面的代碼段用於examp樂。

function getFreq(str){ 
 
    var freq={}; 
 
str.replace(/[a-z A-Z]/g, function(match){ 
 
    freq[match] = (freq[match] || 0) + 1; 
 
    return match; 
 
    }); 
 
    console.log(JSON.stringify(freq)); 
 
    return freq; 
 
} 
 

 

 

 
function doSomething(s){ 
 
    console.time("getFreq"); 
 
    getFreq(s); 
 
    console.timeEnd("getFreq"); 
 
};

Enter Here : <input type="text" onchange="doSomething(this.value);" />

Answer 2

• 它做任何事情之前執行，因爲性能測試（t0，t1）是方法之外，這是從來沒有改變。將測量值放入方法中。
• 我還要檢查s是空的運行方法

function getFreq(str){ 
 
    var freq={}; 
 
    str.replace(/[a-z A-Z]/g, function(match){ 
 
    freq[match] = (freq[match] || 0) + 1; 
 
    return match; 
 
    }); 
 
    console.log(JSON.stringify(freq)); 
 
    return freq; 
 
} 
 

 

 
function doSomething(s){ 
 
    if (s === "") 
 
    return; 
 
    var t0 = performance.now(); 
 
    getFreq(s); 
 
    var t1 = performance.now(); 
 
    console.log("Call to doSomething took " + (t1 - t0) + " ms.") 
 
};

Enter Here : <input type="text" onchange="doSomething(this.value);" />

Answer 3

console.time（）啓動一個計時器以名稱級聯，這將在後面由console.timeEnd停止（）。傳遞給兩個函數調用的計時器名稱必須匹配才能使測量正常工作。

console.time（）和console.timeEnd（）只被現代瀏覽器的支持，開始使用Chrome 2，火狐10，Safari 4中，和Internet Explorer 11

console.time("getFreq"); 
function getFreq(str){ 
    var freq={}; 
    str.replace(/[a-z A-Z]/g, function(match){ 
    freq[match] = (freq[match] || 0) + 1; 
    return match; 
    }); 

console.log(JSON.stringify(freq)); 
    return freq; 
} 
console.timeEnd("getFreq"); 

Answer 4

這就是我想要的

：爲每一個電話的onChange

function getFreq(str){ 
 
    var t0 = performance.now(); 
 
    var freq={}; 
 
str.replace(/[a-z A-Z]/g, function(match){ 
 
    freq[match] = (freq[match] || 0) + 1; 
 
    return match; 
 
    }); 
 
    console.log(JSON.stringify(freq)); 
 
    var t1 = performance.now(); 
 
    console.log("Call to doSomething took " + (t1 - t0) + " ms.") 
 
    return freq; 
 
    
 
}

<input type="text" onchange="getFreq(this.value);" />

輸出做

{"a":1,"b":1,"c":3," ":2,"A":1,"D":1} 
Call to doSomething took 1.4000000000014552 ms. 
{"a":1,"b":1,"c":4," ":3,"A":2,"D":1} 
Call to doSomething took 1.9250000000029104 ms.