vue源碼中一些基礎(chǔ)函數(shù)

1 判斷是否是基礎(chǔ)類型,其中有字符串,數(shù)字,布爾類型,還有es6的sybmol類型
function isPrimitive (value) {
      return (
        typeof value === 'string' ||
        typeof value === 'number' ||
        // $flow-disable-line
        typeof value === 'symbol' ||
        typeof value === 'boolean'
      )
  }
2 判斷是否是promise,只要不為null或者undefined,然后then和catch的屬性都是函數(shù)類型
function isPromise (val) {
  return (
    isDef(val) &&
    typeof val.then === 'function' &&
    typeof val.catch === 'function'
  )
}
3 將參數(shù)轉(zhuǎn)換為字符串類型。首先判斷是否為null,如果是返回空字符串,然后在判斷是否是數(shù)組或者是基礎(chǔ)的對象類型并且對象的toString方法和原型上的對象要相等,然后用JSON.stringify(),最后其他的用String()方法
function toString (val) {
  return val == null
    ? ''
    : Array.isArray(val) || (isPlainObject(val) && val.toString === _toString)
      ? JSON.stringify(val, null, 2)
      : String(val)
}
4 先做一個容器,判斷是否含有特定參數(shù)。利用閉包,把各個標(biāo)簽或者組件組用逗號鏈接以字符串的方法傳入?yún)?shù),第二個參數(shù)是定義是否判斷大小寫,然后新建一個空對象,將其逐個最為對象屬性設(shè)為true,最后返回一個函數(shù),判斷傳入的單個參數(shù)是否為對象的屬性,也就是是否是第一次傳入的標(biāo)簽名和組件名中的一個
function makeMap (
  str,
  expectsLowerCase
) {
  var map = Object.create(null);
  var list = str.split(',');
  for (var i = 0; i < list.length; i++) {
    map[list[i]] = true;
  }
  return expectsLowerCase
    ? function (val) { return map[val.toLowerCase()]; }
    : function (val) { return map[val]; }
}
5 做一個純函數(shù)的緩存
function cached (fn) {
  var cache = Object.create(null);
  return (function cachedFn (str) {
    var hit = cache[str];
    return hit || (cache[str] = fn(str))
  })
}
6判斷兩個值都是相等
function looseEqual (a, b) {
  //基礎(chǔ)類型
  if (a === b) { return true }
  var isObjectA = isObject(a);
  var isObjectB = isObject(b);
  // 都是對象類型
  if (isObjectA && isObjectB) {
    try {
      var isArrayA = Array.isArray(a);
      var isArrayB = Array.isArray(b);
      // 都是數(shù)組,判斷長度相等并且用every遍歷判斷兩個數(shù)組對應(yīng)位置的值相等呢過
      if (isArrayA && isArrayB) {
        return a.length === b.length && a.every(function (e, i) {
          return looseEqual(e, b[i])
        })
      // 如果是Date類型,時間相等
      } else if (a instanceof Date && b instanceof Date) {
        return a.getTime() === b.getTime()
     // 其他情況,調(diào)用遞歸逐個判斷是否相等
      } else if (!isArrayA && !isArrayB) {
        var keysA = Object.keys(a);
        var keysB = Object.keys(b);
        return keysA.length === keysB.length && keysA.every(function (key) {
          return looseEqual(a[key], b[key])
        })
      } else {
        /* istanbul ignore next */
        return false
      }
    } catch (e) {
      /* istanbul ignore next */
      return false
    }
  } else if (!isObjectA && !isObjectB) {
    // 都不是對象,轉(zhuǎn)換成字符串類型后判斷您是否相等
    return String(a) === String(b)
  } else {
    return false
  }
}
7 將字符串拼接n次,這個函數(shù)厲害了,涉及到算法了。將n轉(zhuǎn)換為二進制,每次向右移動一位,然后字符串str加上自身一次,也就是x2,只要n>0,并且最后一位是1,res就加上緩存的str,最后等于0返回結(jié)果。寫這個的人好騷啊,直接將傳入的str變量作為字符串x2的緩存使用,減少了一個變量,牛逼啊,要是我寫肯定會再要聲明一個變量的。
   var repeat = function (str, n) {
    var res = '';
    while (n) {
      if (n % 2 === 1) { res += str; }
      if (n > 1) { str += str; }
      n >>= 1;
    }
    return res
  };
8 es6中Set的Polyfill,如果不支持Set,就用對象去設(shè)置屬性是否為true,
if (typeof Set !== 'undefined' && isNative(Set)) {
  // use native Set when available.
  _Set = Set;
} else {
  // a non-standard Set polyfill that only works with primitive keys.
  _Set = /*@__PURE__*/(function () {
    function Set () {
      this.set = Object.create(null);
    }
    Set.prototype.has = function has (key) {
      return this.set[key] === true
    };
    Set.prototype.add = function add (key) {
      this.set[key] = true;
    };
    Set.prototype.clear = function clear () {
      this.set = Object.create(null);
    };

    return Set;
  }());
}
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容