在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue源碼閱讀 cached方法疑惑!

vue源碼閱讀 cached方法疑惑!

在讀vue源碼時(shí),遇到cached方法,如下:

// 在src/shared/until.js中
export function cached (fn: Function): Function {
  const cache = Object.create(null)
  return function cachedFn (str: string): any {
    const hit = cache[str]
    return hit || (cache[str] = fn(str))
  }
}

上面這個(gè)方法在很多其他方法中有運(yùn)用,如

//駝峰化以連字符分隔的字符
const camelizeRE = /-(\w)/g
export const camelize = cached((str: string): string => {
  return str.replace(camelizeRE, (_, c) => c ? c.toUpperCase() : '')
})

//大寫字符串
var capitalize = cached(function (str) {
  return str.charAt(0).toUpperCase() + str.slice(1)
});

網(wǎng)上查詢了說是cached方式加快數(shù)據(jù)的讀取速度,加做緩存策略;

但是并不能理解,有大神可以講解下,該方法的原理嗎?

回答
編輯回答
青檸

已想明白!
它的實(shí)現(xiàn)原理:創(chuàng)建一個(gè)對(duì)象,將我們所寫的東西保存到這個(gè)對(duì)象中,如果說我們后面再次用到了這個(gè)東西,那么 JavaScript 就不需要再計(jì)算一遍了,直接將這個(gè)對(duì)象中我們需要的東西提取出來

2017年1月16日 11:59
編輯回答
陌璃
function cached (fn){
  const cache = Object.create(null)
  return function cachedFn (str: string): any {
    const hit = cache[str]
    return hit || (cache[str] = fn(str))
  }
}
var fk = function (str) {
  return str.charAt(0).toUpperCase() + str.slice(1)
}
var cacheFk = cached(fk)
// 1 step
cacheFk('ui') 
//2 step
cacheFk('ui')

// 原理函數(shù)閉包
1 step 把 執(zhí)行 函數(shù) 得到結(jié)果 result, 并且 此時(shí) 把 ‘ui’作為key, reault 作為value, 放到 cache 對(duì)象里, 2 step 再調(diào) 這個(gè)函數(shù), 結(jié)果直接 取 chche['ui'] ,及相當(dāng)于少走一步 fk 函數(shù)。

2017年2月11日 05:19