JS计算代码执行时间三大方法

前言

如果你想看到自己写的某段Js代码到底执行了多久，想要判断或者获取它们的执行时间，那么可以通过以下三种方法进行获取zhixing和调用，那么好，本文正式开始。

一.console.time + console.timeEnd实现

console.time('执行一万次需要用的时间')
for(let i=0;i<10000;i++){
	
}
console.timeEnd('执行一万次需要用的时间')//执行一万次需要用的时间: 0.523193359375 ms
1
2
3
4
5

在上述代码中，我们在time和timeEnd中做了一个for循环一万次，打印出的毫秒数是0.5ms。计算成功。

简述time和timeEnd

console.time就是开始计算时长，timeEnd就是计算结束时长并打印结果。而time语句中的 执行一万次需要用的时间，就是这段时间的别名，timeEnd通过这个别名能判断要计算的是哪段代码，如果有多个time也不用担心，只会寻找符合别名的那个time，如果time没设置别名，则别名就为空，空值打印出来为default，也就是default：0.523193359375 ms。

有了别名，我们就可以嵌套使用time比如：

console.time('t1')
for(let i=0;i<10000;i++){
}
console.time('t2');
for(let i=0;i<10000;i++){
	
}
console.timeEnd('t1');//t1: 0.172119140625 ms
console.timeEnd('t2')//t2: 0.1181640625 ms
1
2
3
4
5
6
7
8
9

Date对象计算（精度最低）

也就是调用Date对象的now方法

now方法

这个方法是调用1970-1-1 00：00：00到现在为止的毫秒数，如果我们想要获取某段代码执行时间，可以在函数前定义一个变量，值为now当前时间，在执行后也定义一个变量now那时时间，相减就可以获得执行时间。但是它相对于其他两种方法精度较低，不建议使用。

let start=Date.now();
for(let i=0;i<10000000;i++){
}
let end=Date.now();
console.log(end-start);//6
1
2
3
4
5

为什么说它精度较低，这是因为它其实无法打印出较小的执行时间，比如我把i变成和time方法一样的10000，一万，它就变成0了，但其实执行时间不是0，而是0.几，所以相对而言它精度是较低的。

window.performance.now()

这是js自带的获取时间方法，最多可获取到微秒级，但是这也取决于所用的浏览器，比如火狐60版本就会对这个方法进行降低精度，并启用privacy.resistFingerprinting，但这些也不妨碍它在大多数浏览器中是微秒级高精度的获取时间方法.

const t1=window.performance.now()
for(let i=0;i<10000000;i++){
}
const t2=window.performance.now()
console.log(t2-t1);//6.199999999254942
1
2
3
4
5

在上述代码中，我们同样定义了两个常量来获取执行前和执行后时间，并且通过相减的方式来进行获取执行时间的操作。

总结

除了Date方法外精度不高外，其余两种的精度都是相对来说较高的，我们可以根据执行时间来判断两段代码之间的性能哪个更好，那么好，本期就到这里。