今天在优化代码的时候发现了一段代码运行时候极其缓慢,从而引发了我对 try catch 的性能优化深度思考?
关键代码拆解成如下图所示(无关部分已省略):
起初我认为可能是这个 getRowDataItemNumberFormat
函数里面某些方法执行太慢,从 formatData.replace
到 unescape
(已废弃,官方建议使用 decodeURI
或者 decodeURIComponent
替代) 方法都怀疑了一遍,发现这些方法都不是该函数运行慢的原因。
为了深究原因,我给 style.formatData
传入了不同的值,发现这个函数的运行效率出现不同的表现。开始有点疑惑为什么 style.formatData
的值导致这个函数的运行效率差别如此之大。
进一步最终定位发现如果 style.formatData
为 undefined 的时候,效率骤降,如果 style.formatData
为合法的字符串的时候,效率是正常值。
我开始意识到这个问题的原因在那里了,把目光转向了 trycatch
代码块,这是一个很可疑的地方,在很早之前曾经听说过不合理的 trycatch
是会影响性能的,但是之前从没遇到过,结合了一些资料,我发现比较少案例去探究这类代码片段的性能,我决定写代码去验证下:
window.a = 'a';window.c = undefined;function getRowDataItemNumberFormatTryCatch() {
console.time('getRowDataItemNumberFormatTryCatch'); for (let i = 0; i < 3000; i++) {
try {
a.replace(/%022/g, '"'); } catch (error) {
} } console.timeEnd('getRowDataItemNumberFormatTryCatch');}
我尝试把 trycatch
放入一个 for
循环中,让它运行 3000 次,看看它的耗时为多少,我的电脑执行该代码的时间大概是 0.2 ms 左右,这是一个比较快的值,但是这里 a.replace