JavaScript的装逼优化技巧之惰性加载函数

• 2020 年 3 月 12 日
• 笔记

天下武功唯快不破！编程也是同理！程序的优化，其实最终优化的是代码执行速度。而执行速度的提升往往是从很多代码细节当中不断堆砌出来的。相反，垃圾代码也是同理。

程序优化的过程往往也是提升编程效率的一个有效捷径。

今天为大家分享的是JavaScript当中的惰性函数。所谓惰性函数的重点就在这个惰字上，它是函数式编程应用的一种。由于它很惰，所以其只会在函数第一次调用时执行。

如果在字面上不好理解，那么请细品下方的代码。不知是否有种似曾相识的感觉？

var zhang = (function () {    if (a === 1) {        return function () {            console.log("对着JS一调一下午");        }    } else {        return function () {            console.log("调了一下午，bug还得补");        }    }})();

在上面这段代码中存有一个判断语句，如果在当前环境下a的值不变，那么该函数不管你如何执行，其结果都不会发生任何变化。但每次执行还要进行if判断，这势必造成了没有必要的浪费。

当聊到这儿的时候，肯定有同学在想：这只是多执行一次判断而已，对整体应该无伤大雅吧！没错！影响的效率从某种程序上不会被察觉，但请记住：苍蝇腿也是肉！程序的优化其实优化的是细节，优化的细节多了，那么势必会提升你项目的用户体验！

惰性加载表示函数内的执行分支只会发生一次。那如何才能达到发生一次?一般有两种破解方案。

1、函数被调用时处理函数：

function zhang(){    if(a === 1){        zhang = function(){            console.log("对着JS一调一下午");        }    }else{        zhang = function(){            console.log("调了一下午，bug还得补");        }    }    return zhang();}

这样在进入满足条件的分支后会对zhang重新赋值，之后每次调用zhang就不会再执行if判断。

2、声明函数时就指定适当的函数

var zhang = (function () {    if (a === 1) {        return function () {            console.log("对着JS一调一下午");        }    } else {        return function () {            console.log("调了一下午，bug还得补");        }    }})();

这里创建一个匿名函数并自执行，用来确定具体使用哪一个函数来实现。

惰性函数的特点就是：只在第一次执行时牺牲一点点性能。