lodash源码解析

2019-11-20  本文已影响0人  Chaos_YM
前言:

虽然现在前端生态越来越丰富,三大框架鼎足而立,但是,原生的JS编码能力还是很重要的,所以决定学一下lodash的源码。

方式:

简单粗暴一点,按照字母顺序a-z,先对照API,挑选,自己手写,然后看源码,取长补短。
如果有特别好的点,会在下面记录我的实现和源码的对比。
差异不大或者没有难度的API,会简单描述带过。
欢迎留言沟通,持续更新中~

一,Array

差异:源码多了对两个参数的校验
收获:编写函数一定要校验参数,减少错误。(TS是不是就好在这里了?)

// 我的实现
function chunk (arr, number) {
    var b = [];
     for (var i=0;i < Math.ceil(arr.length/number);i++) {
        b.push(arr.slice(i*number, (i+1)*number));
    }
    return b;
}
// 源码
function chunk(array, size = 1) {
  size = Math.max(toInteger(size), 0)
  const length = array == null ? 0 : array.length
  if (!length || size < 1) {
    return []
  }
  let index = 0
  let resIndex = 0
  const result = new Array(Math.ceil(length / size))

  while (index < length) {
    result[resIndex++] = slice(array, index, (index += size))
  }
  return result
}
// 我的实现
var arr1 = [1,2,3], arr2 = [4,2];
function diff (arr1, arr2) {
    if (Object.prototype.toString.call(arr1) !== '[object Array]') {
        return [];
    }
    return arr1.filter(item => !arr2.includes(item));
}
var brr = diff(arr1, arr2);

位运算:转自掘金

function toInteger(value) {
  const result = toFinite(value)
  const remainder = result % 1

  return remainder ? result - remainder : result
}

export default toInteger

function toNumber(value) {
  if (typeof value === 'number') {
    return value
  }
  if (isSymbol(value)) {
    return NAN
  }
  if (isObject(value)) {
    const other = typeof value.valueOf === 'function' ? value.valueOf() : value
    value = isObject(other) ? `${other}` : other
  }
  if (typeof value !== 'string') {
    return value === 0 ? value : +value
  }
  value = value.replace(reTrim, '')
  const isBinary = reIsBinary.test(value)
  return (isBinary || reIsOctal.test(value))
    ? freeParseInt(value.slice(2), isBinary ? 2 : 8)
    : (reIsBadHex.test(value) ? NAN : +value)
}

export default toNumber
上一篇 下一篇

猜你喜欢

热点阅读