先欣赏一段大神解释
函数缓存的目的在于：将处理过的数据缓存，减少函数执行次数，提升前端程序性能。
最关键代码：return cache[str]; || (cache[str] = fn(str))
传统的数据处理，每次都需要经过函数。
function tradition(str){
return str.charAt(0).toUpperCase() + str.slice(1)
}
var foo = tradition("Frank")
var bar = tradition("Kai")
var baz = tradition("Kai")
缓存的数据处理，只有当缓存中没有时才经过函数处理。
/**
* Create a cached version of a pure function.
*/
function cached (fn) {
var cache = Object.create(null);
return (function cachedFn (str) {
var hit = cache[str];
return hit || (cache[str] = fn(str))
})
}
var capitalize = cached(function (str) {
return str.charAt(0).toUpperCase() + str.slice(1)
});
//未缓存
var lastName = capitalize("Frank")
var firstName = capitalize("Kai")
//已缓存
var secondName = capitalize("Kai")
建议采用Chrome控制台的开发面板进行测试，6个变量命名处打断点，采用setp into(F11)的形式，去查看每个变量命名时的完整调用过程，对比未缓存和已缓存处的call stack，就会立刻理解函数缓存的原理。
期待和大家交流，共同进步，欢迎大家加入我创建的与前端开发密切相关的技术讨论小组：
- SegmentFault技术圈:ES新规范语法糖
- SegmentFault专栏：趁你还年轻，做个优秀的前端工程师
- 知乎专栏：趁你还年轻，做个优秀的前端工程师
- Github博客: 趁你还年轻233的个人博客
- 前端开发QQ群：660634678
微信公众号： 人兽鬼 / excellent_developers
努力成为优秀前端工程师！
