Vue.js v2.1.10 源码探索 v1.1.0

Remerber to keep it Simple,Stupid.Do one thing and do it best.

精髓 cached( )

  /**
     * Create a cached version of a pure function.
     * 创建一个纯函数的缓存版本。
     */
function cached(fn) {
     //首先创建一个没有原型的缓存对象
     var cache = Object.create(null);
     return (function cachedFn(str) {
             //  缓存传入的键值 str
               var value = cache[ str ];
         return (value ? value || cache[ str ]  =  fn(str)     
    })
}

分析1

function cached(fn) {
     // 稍微改造下 为了更好的理解
     var fn    =  fn;  
       //首先创建一个没有原型的缓存对象
     var cache = Object.create(null);

     return (function cachedFn(str) {

             //  缓存传入的键值 str
               var value = cache[ str ];
               console.log(cache， value); // 为了更好的理解
         return (value ? value || cache[ str ]  =  fn(str)     
    })
}

  /**
     * Camelize a hyphen-delimited string.
     * 骆驼化以连字符分隔的字符串
     */
     //命名的细节 RegExp
var  camelizeRE = /-(\w)/g;
var  camelize  = cached(function (str)
 {
     return  str.replace( camelizeRE, function ( _, c){ c ? c.toUpperCase(): '';)
 });  

cached( )里发生了什么

首先返回了 cachedFn( )目的是建一个闭包，
保存了匿名函数 function ( str ) 即 fn 和 缓存对象 cache = { };

接着是让索引
var camelize 指向了闭包function cachedFn( ) 这样垃圾清理机制 就不会清除保存的数据了

好了测试下这个 camelize

camelize('-w') // 缓存的键值对 {-w: "W"}  函数的返回值 "W"

当第一次执行camelize( ) 时
实际是执行了将 (cache[ ‘-w’ ] = ‘W’ );
最后返回了‘W’；