翼度科技»论坛 编程开发 JavaScript 查看内容

lodash已死?radash库方法介绍及源码解析 —— 对象方法篇

8

主题

8

帖子

24

积分

新手上路

Rank: 1

积分
24

写在前面


  • 主页有更多其他篇章的方法,欢迎访问查看。
  • 本篇我们介绍radash中对象相关方法的使用和源码解析。
assign:递归合并两个对象


  • 使用说明

    • 功能说明:类似于 JavaScript 的 Object.assign 方法,用于将 override 对象的属性和值复制到 initial 对象中。如果属性值是对象,则递归地进行赋值。
    • 参数:初始对象、覆盖对象。
    • 返回值:返回合并后的新对象

  • 使用代码示例
    1. import { assign } from 'radash'
    2. const ra = {
    3.  name: 'Ra',
    4.  power: 100
    5. }
    6. assign(ra, { name: 'Loki' })
    7. // => { name: Loki, power: 100 }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `assign`。
    2. export const assign = <X extends Record<string | symbol | number, any>>(
    3.  // `initial` 是初始对象,它的属性可能被 `override` 对象中的属性覆盖。
    4.  initial: X,
    5.  // `override` 是覆盖对象,其属性将覆盖或添加到 `initial` 对象中。
    6.  override: X
    7. ): X => {
    8.  // 如果 `initial` 或 `override` 为空,则返回非空的那个,或者如果都为空则返回一个空对象。
    9.  if (!initial || !override) return initial ?? override ?? {}
    10.  // 使用 `Object.entries` 和 `reduce` 方法合并 `initial` 和 `override` 对象。
    11.  return Object.entries({ ...initial, ...override }).reduce(
    12.    (acc, [key, value]) => {
    13.      // 在每次迭代中,构建累加器 `acc`,它是最终返回的新对象。
    14.      return {
    15.        ...acc,
    16.        [key]: (() => {
    17.          // 如果 `initial` 中的对应属性是一个对象,则递归地调用 `assign` 进行合并。
    18.          if (isObject(initial[key])) return assign(initial[key], value)
    19.          // 如果属性值是数组,这里有一个注释掉的代码行,似乎是未完成的逻辑。
    20.          // if (isArray(value)) return value.map(x => assign)
    21.          // 对于非对象属性,直接使用 `override` 中的值。
    22.          return value
    23.        })()
    24.      }
    25.    },
    26.    {} as X // 初始累加器是一个类型为 `X` 的空对象。
    27.   )
    28. }
    复制代码

    • 方法流程说明:

      • assign 函数接受两个参数,initial 和 override,它们都是对象。
      • 如果其中一个对象为空,函数将返回另一个非空对象。如果两个对象都为空,函数返回一个空对象。
      • 如果两个对象都非空,函数使用 Object.entries 和 reduce 方法遍历 override 对象的所有属性。
      • 对于每个属性,如果 initial 对象中对应的属性也是一个对象,则递归地调用 assign 函数来合并这两个对象。
      • 如果 initial 对象中对应的属性不是对象,或 override 对象中的属性在 initial 对象中不存在,则直接使用 override 对象中的值。
      • 返回合并后的新对象。


clone:浅拷贝对象


  • 使用说明

    • 功能说明:这个函数接受一个对象 obj 作为参数,并返回这个对象的一个新的浅拷贝。
    • 参数:需要克隆的对象。
    • 返回值:过滤完后的映射值组成的数组。

  • 使用代码示例
    1. import { clone } from 'radash'
    2. const ra = {
    3.  name: 'Ra',
    4.  power: 100
    5. }
    6. const gods = [ra]
    7. clone(ra) // => copy of ra
    8. clone(gods) // => copy of gods
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `clone`。
    2. export const clone = <T>(obj: T): T => {
    3.  // 如果 `obj` 是原始值(如数字、字符串或布尔值),则不需要克隆,直接返回 `obj`。
    4.  if (isPrimitive(obj)) {
    5.    return obj
    6.   }
    7.  // 如果 `obj` 是一个函数,则通过 `bind` 方法创建一个新的绑定函数,
    8.  // 并将其绑定到一个空对象上,以创建一个函数的副本。
    9.  if (typeof obj === 'function') {
    10.    return obj.bind({})
    11.   }
    12.  // 获取 `obj` 的构造函数,并使用 `new` 操作符创建一个新的对象实例。
    13.  // 这个方法同样适用于创建数组的副本。
    14.  const newObj = new ((obj as object).constructor as { new (): T })()
    15.  // 遍历 `obj` 的所有自有属性,并将它们复制到新对象 `newObj` 中。
    16.  Object.getOwnPropertyNames(obj).forEach(prop => {
    17.    // 这里使用了类型断言 `(newObj as any)` 和 `(obj as any)` 来绕过类型检查,
    18.    // 因为函数开头已经检查了原始值的情况。
    19.    ;(newObj as any)[prop] = (obj as any)[prop]
    20.   })
    21.  // 返回新创建的对象 `newObj`。
    22.  return newObj
    23. }
    复制代码

    • 方法流程说明:

      • 如果 obj 是一个原始值,直接返回它,因为原始值在JavaScript中是不可变的。
      • 如果 obj 是一个函数,使用 bind 方法创建并返回一个新的函数副本。
      • 如果 obj 是一个对象或数组,使用 obj 的构造函数创建一个新的空对象或空数组 newObj。
      • 遍历 obj 的自有属性,并将每个属性值复制到 newObj 中。
      • 返回新对象 newObj。


construct:把扁平对象构建为深层对象(多维)


  • 使用说明

    • 功能说明:这个函数接受一个对象 obj 作为参数,并返回这个对象的一个新的浅拷贝。
    • 参数:键值对对象。
    • 返回值:构建后的新对象。

  • 使用代码示例
    1. import { construct } from 'radash'
    2. const flat = {
    3.  name: 'ra',
    4.  power: 100,
    5.  'friend.name': 'loki',
    6.  'friend.power': 80,
    7.  'enemies.0.name': 'hathor',
    8.  'enemies.0.power': 12
    9. }
    10. construct(flat)
    11. // {
    12. //   name: 'ra',
    13. //   power: 100,
    14. //   friend: {
    15. //     name: 'loki',
    16. //     power: 80
    17. //   },
    18. //   enemies: [
    19. //     {
    20. //       name: 'hathor',
    21. //       power: 12
    22. //     }
    23. //   ]
    24. // }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `construct`。
    2. export const construct = <TObject extends object>(obj: TObject): object => {
    3.  // 如果 `obj` 为空,则直接返回一个新的空对象。
    4.  if (!obj) return {}
    5.  // 使用 `Object.keys` 获取 `obj` 的所有自有属性的键名,
    6.  // 然后使用 `reduce` 方法来构建新对象。
    7.  return Object.keys(obj).reduce((acc, path) => {
    8.    // 对每个属性键名 `path`,调用 `set` 函数来设置新对象 `acc` 的属性。
    9.    // `(obj as any)[path]` 获取 `obj` 中对应属性的值。
    10.    // `set` 函数的具体实现未提供,我们可以假设它正确地设置了 `acc` 的属性。
    11.    return set(acc, path, (obj as any)[path])
    12.   }, {}) // 初始累加器 `acc` 是一个空对象。
    13. }
    复制代码

    • 方法流程说明:

      • construct 函数接受一个对象 obj 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 obj 非空,函数遍历 obj 的所有自有属性。
      • 对于每个属性,函数使用 set 函数将 obj 中的属性值复制到新对象中。
      • 返回构建完成的新对象。


crush:把深层(多维)对象构建成扁平对象(construct的相反操作)


  • 使用说明

    • 功能说明:这个函数接受一个对象 obj 作为参数,并返回这个对象的一个新的浅拷贝。
    • 参数:对象。
    • 返回值:构建后的扁平数组。

  • 使用代码示例
    1. import { crush } from 'radash'
    2. const ra = {
    3.  name: 'ra',
    4.  power: 100,
    5.  friend: {
    6.    name: 'loki',
    7.    power: 80
    8.   },
    9.  enemies: [
    10.    {
    11.      name: 'hathor',
    12.      power: 12
    13.    }
    14.   ]
    15. }
    16. crush(ra)
    17. // {
    18. //   name: 'ra',
    19. //   power: 100,
    20. //   'friend.name': 'loki',
    21. //   'friend.power': 80,
    22. //   'enemies.0.name': 'hathor',
    23. //   'enemies.0.power': 12
    24. // }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `crush`。
    2. export const crush = <TValue extends object>(value: TValue): object => {
    3.  // 如果 `value` 为空,则直接返回一个空对象。
    4.  if (!value) return {}
    5.  // 使用 `objectify` 函数来构建新对象。
    6.  // `objectify` 函数的具体实现未提供,我们可以假设它以某种方式构建对象。
    7.  return objectify(
    8.    // 使用 `keys` 函数获取 `value` 的所有键名。
    9.    // `keys` 函数的具体实现未提供,我们可以假设它返回对象的所有键名。
    10.    keys(value),
    11.    // 使用标识函数 `k => k` 作为键生成函数,意味着新对象的键将与原始对象的键相同。
    12.    k => k,
    13.    // 使用 `get` 函数获取 `value` 对象中每个键对应的值。
    14.    // `get` 函数的具体实现未提供,我们可以假设它正确地获取了对象中的属性值。
    15.    k => get(value, k)
    16.   )
    17. }
    复制代码

    • 方法流程说明:

      • crush 函数接受一个对象 value 作为参数。
      • 如果 value 为空,函数返回一个空对象。
      • 如果 value 非空,函数使用 keys 函数获取 value 的所有键名。
      • 函数调用 objectify,传入键名数组、键生成函数(这里是标识函数 k => k)和值生成函数(通过调用 get(value, k) 获取每个键的值)。
      • objectify 函数返回一个新对象,这个对象的属性和值与 value 相同。


get:获取对象中的任意属性,可以通过 . 的方式获取深层的属性


  • 使用说明

    • 功能说明:用于安全地访问嵌套对象的属性,即使某些中间属性不存在也不会抛出错误。如果找不到指定的路径,则返回一个默认值。
    • 参数:目标对象、属性字符(可以.表示深层次属性)、默认值。
    • 返回值:找到则返回指定值,否则返回默认值。

  • 使用代码示例
    1. import { get } from 'radash'
    2. const fish = {
    3.  name: 'Bass',
    4.  weight: 8,
    5.  sizes: [
    6.    {
    7.      maturity: 'adult',
    8.      range: [7, 18],
    9.      unit: 'inches'
    10.    }
    11.   ]
    12. }
    13. get( fish, 'sizes[0].range[1]' ) // 18
    14. get( fish, 'sizes.0.range.1' ) // 18
    15. get( fish, 'foo', 'default' ) // 'default'
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `get`。
    2. export const get = <TDefault = unknown>(
    3.  // 第一个参数 `value` 是一个任意类型的值,它是要访问属性的对象。
    4.  value: any,
    5.  // 第二个参数 `path` 是一个字符串,表示对象属性的路径,使用点或方括号表示法。
    6.  path: string,
    7.  // 第三个可选参数 `defaultValue` 是一个默认值,如果无法访问路径,则返回此值。
    8.  defaultValue?: TDefault
    9. ): TDefault => {
    10.  // 使用正则表达式分割路径字符串,得到一个属性名的数组 `segments`。
    11.  const segments = path.split(/[.[]]/g)
    12.  // 初始化一个变量 `current`,用于遍历属性路径。
    13.  let current: any = value
    14.  // 遍历 `segments` 中的每个属性名 `key`。
    15.  for (const key of segments) {
    16.    // 如果 `current` 是 `null` 或 `undefined`,则返回 `defaultValue`。
    17.    if (current === null || current === undefined) return defaultValue as TDefault
    18.    // 移除属性名中的引号。
    19.    const dequoted = key.replace(/['"]/g, '')
    20.    // 如果属性名为空(可能是由于路径字符串中的多余点或方括号),则跳过此迭代。
    21.    if (dequoted.trim() === '') continue
    22.    // 将 `current` 更新为当前属性名 `dequoted` 对应的值。
    23.    current = current[dequoted]
    24.   }
    25.  // 如果最终的 `current` 是 `undefined`,则返回 `defaultValue`。
    26.  if (current === undefined) return defaultValue as TDefault
    27.  // 否则,返回找到的值。
    28.  return current
    29. }
    复制代码

    • 方法流程说明:

      • get 函数接受一个对象 value,一个表示属性路径的字符串 path,以及一个可选的默认值 defaultValue。
      • 使用正则表达式分割 path 字符串,得到一个表示属性链的数组 segments。
      • 遍历 segments 数组,依次访问每个属性。
      • 如果在访问过程中遇到 null 或 undefined,或者到达路径的末尾但找不到值,则返回 defaultValue。
      • 如果成功访问到路径上的所有属性,并找到了值,则返回这个值。


invert:把对象中的key和value对调


  • 使用说明

    • 功能说明:用于反转对象的键和值。这意味着原始对象的键成为新对象的值,原始对象的值成为新对象的键。
    • 参数:需要反转的对象。
    • 返回值:反转后的新数组。

  • 使用代码示例
    1. import { invert } from 'radash'
    2. const powersByGod = {
    3.  ra: 'sun',
    4.  loki: 'tricks',
    5.  zeus: 'lighning'
    6. }
    7. invert(gods) // => { sun: ra, tricks: loki, lightning: zeus }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `invert`。
    2. export const invert = <
    3.  // 泛型 `TKey` 表示对象的键的类型。
    4.  TKey extends string | number | symbol,
    5.  // 泛型 `TValue` 表示对象的值的类型。
    6.  TValue extends string | number | symbol
    7. >(
    8.  // 参数 `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    9.  obj: Record<TKey, TValue>
    10. ): Record<TValue, TKey> => {
    11.  // 如果 `obj` 为空,则返回一个空对象。
    12.  if (!obj) return {} as Record<TValue, TKey>
    13.  // 使用 `Object.keys` 获取 `obj` 的所有键,并断言键的类型为 `TKey`。
    14.  const keys = Object.keys(obj) as TKey[]
    15.  // 使用 `reduce` 方法遍历所有键,创建一个新对象,其键为 `obj` 的值,值为 `obj` 的键。
    16.  return keys.reduce((acc, key) => {
    17.    // 将 `obj` 的值 `obj[key]` 作为新对象 `acc` 的键,原始键 `key` 作为新对象的值。
    18.    acc[obj[key]] = key
    19.    // 返回累加器 `acc`,它是正在构建的反转对象。
    20.    return acc
    21.   }, {} as Record<TValue, TKey>) // 初始累加器是一个空对象,类型为 `Record<TValue, TKey>`。
    22. }
    复制代码

    • 方法流程说明:

      • invert 函数接受一个对象 obj 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 obj 非空,函数遍历 obj 的所有键。
      • 对于每个键,函数将 obj 中的值作为新对象的键,将原始键作为新对象的值。
      • 返回构建完成的新对象,它是 obj 的反转版本。


keys:获取对象中所有的key,包括深层的(表示成a.b的形式)


  • 使用说明

    • 功能说明:于获取一个对象的所有嵌套属性键的完整路径。这些路径用点号连接,表示从根到叶子的完整路径。
    • 参数:目标对象。
    • 返回值:过滤完后的映射值组成的数组。

  • 使用代码示例
    1. import { keys } from 'radash'
    2. const ra = {
    3.  name: 'ra',
    4.  power: 100,
    5.  friend: {
    6.    name: 'loki',
    7.    power: 80
    8.   },
    9.  enemies: [
    10.    {
    11.      name: 'hathor',
    12.      power: 12
    13.    }
    14.   ]
    15. }
    16. keys(ra)
    17. // => [
    18. //   'name',
    19. //   'power',
    20. //   'friend.name',
    21. //   'friend.power',
    22. //   'enemies.0.name',
    23. //   'enemies.0.power'
    24. // ]
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `keys`。
    2. export const keys = <TValue extends object>(value: TValue): string[] => {
    3.  // 如果 `value` 为空,则返回一个空数组。
    4.  if (!value) return []
    5.  // 定义一个递归函数 `getKeys`,用于遍历嵌套对象或数组并获取所有键的路径。
    6.  const getKeys = (nested: any, paths: string[]): string[] => {
    7.    // 如果当前值 `nested` 是一个对象,递归地遍历它的每一个键值对。
    8.    if (isObject(nested)) {
    9.      return Object.entries(nested).flatMap(([k, v]) =>
    10.        // 对于每一个键值对,将键 `k` 添加到路径数组 `paths` 中,
    11.        // 并继续递归地遍历值 `v`。
    12.        getKeys(v, [...paths, k])
    13.      )
    14.    }
    15.    // 如果当前值 `nested` 是一个数组,递归地遍历它的每一个元素。
    16.    if (isArray(nested)) {
    17.      return nested.flatMap((item, i) =>
    18.        // 对于每一个元素,将索引 `i` 转换为字符串并添加到路径数组 `paths` 中,
    19.        // 然后继续递归地遍历元素 `item`。
    20.        getKeys(item, [...paths, `${i}`])
    21.      )
    22.    }
    23.    // 如果当前值 `nested` 既不是对象也不是数组,说明已经到达叶子节点,
    24.    // 将路径数组 `paths` 连接成字符串并返回。
    25.    return [paths.join('.')]
    26.   }
    27.  // 使用 `getKeys` 函数从根开始遍历 `value`,并获取所有键的路径。
    28.  return getKeys(value, [])
    29. }
    复制代码

    • 方法流程说明:

      • keys 函数接受一个对象 value 作为参数。
      • 如果 value 为空,函数返回一个空数组。
      • 如果 value 非空,函数定义了一个递归辅助函数 getKeys。
      • getKeys 函数递归地遍历嵌套对象或数组,收集所有键的路径。
      • 对于嵌套对象,getKeys 遍历每个键值对,并对值递归调用自身。
      • 对于嵌套数组,getKeys 遍历每个元素,并对元素递归调用自身,使用元素索引作为路径的一部分。
      • 当到达叶子节点(即不再是对象或数组)时,getKeys 将收集到的路径数组 paths 连接成字符串并返回。
      • keys 函数返回一个包含所有属性键路径的数组。


listify:把对象的键值对转换成一个由特定结构元素组成的数组


  • 使用说明

    • 功能说明:用于将一个对象的键值对转换成一个由特定结构元素组成的数组。这个函数接受两个参数:一个对象 obj 和一个转换函数 toItem。toItem 函数接受对象的每个键和对应的值,并返回一个新的元素。
    • 参数:目标对象、条件函数。
    • 返回值:构建后的结果数组。

  • 使用代码示例
    1. import { listify } from 'radash'
    2. const fish = {
    3.  marlin: {
    4.    weight: 105,
    5.   },
    6.  bass: {
    7.    weight: 8,
    8.   }
    9. }
    10. listify(fish, (key, value) => ({ ...value, name: key })) // => [{ name: 'marlin', weight: 105 }, { name: 'bass', weight: 8 }]
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `listify`。
    2. export const listify = <TValue, TKey extends string | number | symbol, KResult>(
    3.  // 参数 `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    4.  obj: Record<TKey, TValue>,
    5.  // 参数 `toItem` 是一个函数,它接受一个键和一个值,并返回一个新的结果类型 `KResult` 的元素。
    6.  toItem: (key: TKey, value: TValue) => KResult
    7. ) => {
    8.  // 如果 `obj` 为空,则返回一个空数组。
    9.  if (!obj) return []
    10.  // 使用 `Object.entries` 获取 `obj` 的所有键值对。
    11.  const entries = Object.entries(obj)
    12.  // 如果 `obj` 没有键值对,返回一个空数组。
    13.  if (entries.length === 0) return []
    14.  // 使用 `reduce` 方法遍历所有键值对,构建结果数组。
    15.  return entries.reduce((acc, entry) => {
    16.    // 对每个键值对,调用 `toItem` 函数,并将返回的元素添加到累加器数组 `acc` 中。
    17.    acc.push(toItem(entry[0] as TKey, entry[1] as TValue))
    18.    // 返回累加器 `acc`。
    19.    return acc
    20.   }, [] as KResult[]) // 初始累加器是一个空数组,其元素类型为 `KResult`。
    21. }
    复制代码

    • 方法流程说明:

      • listify 函数接受一个对象 obj 和一个转换函数 toItem 作为参数。
      • 如果 obj 为空,函数返回一个空数组。
      • 如果 obj 非空,函数使用 Object.entries 获取 obj 的所有键值对。
      • 如果 obj 没有键值对,函数返回一个空数组。
      • 如果 obj 有键值对,函数使用 reduce 方法遍历键值对数组。
      • 对于每个键值对,函数调用 toItem 函数,传入键和值,并将返回的新元素添加到累加器数组中。
      • 返回构建完成的结果数组。


lowerize:将对象的所有key转换为小写形式


  • 使用说明

    • 功能说明:用于将一个对象的所有键转换为小写形式,内部用到mapKeys,而 mapKeys 函数则用于一般性地将一个对象的键通过一个映射函数转换为新的键。
    • 参数:对象、映射函数。
    • 返回值:返回一个键是小写形式的对象。

  • 使用代码示例
    1. import { lowerize } from 'radash'
    2. const ra = {
    3.  Mode: 'god',
    4.  Power: 'sun'
    5. }
    6. lowerize(ra) // => { mode, power }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `lowerize`。
    2. export const lowerize = <T extends Record<string, any>>(obj: T) =>
    3.  // 调用 `mapKeys` 函数将 `obj` 的所有键转换为小写。
    4.  mapKeys(obj, k => k.toLowerCase()) as LowercasedKeys<T>
    5.  // `LowercasedKeys<T>` 是一个类型,表示将 `T` 的键转换为小写后的新类型。
    6. // 定义一个泛型函数 `mapKeys`。
    7. export const mapKeys = <
    8.  // `TValue` 表示对象的值的类型。
    9.  TValue,
    10.  // `TKey` 表示对象原始键的类型。
    11.  TKey extends string | number | symbol,
    12.  // `TNewKey` 表示映射后的新键的类型。
    13.  TNewKey extends string | number | symbol
    14. >(
    15.  // `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    16.  obj: Record<TKey, TValue>,
    17.  // `mapFunc` 是一个映射函数,它接受一个键和一个值,并返回一个新的键。
    18.  mapFunc: (key: TKey, value: TValue) => TNewKey
    19. ): Record<TNewKey, TValue> => {
    20.  // 使用 `Object.keys` 获取 `obj` 的所有键,并断言键的类型为 `TKey`。
    21.  const keys = Object.keys(obj) as TKey[]
    22.  // 使用 `reduce` 方法遍历所有键,创建一个新对象,其键为 `mapFunc` 函数的返回值,值为 `obj` 的值。
    23.  return keys.reduce((acc, key) => {
    24.    // 调用 `mapFunc` 函数获取新键,并将 `obj` 中的值赋给新键。
    25.    acc[mapFunc(key as TKey, obj[key])] = obj[key]
    26.    // 返回累加器 `acc`,它是正在构建的新对象。
    27.    return acc
    28.   }, {} as Record<TNewKey, TValue>) // 初始累加器是一个空对象,类型为 `Record<TNewKey, TValue>`。
    29. }
    复制代码

    • 方法流程说明:

      • lowerize 函数接受一个对象 obj 作为参数。
      • 它调用 mapKeys 函数,传入 obj 和一个将键转换为小写的函数。
      • mapKeys 函数遍历 obj 的所有键,并将每个键转换为小写。
      • mapKeys 返回一个新对象,这个对象的键是小写形式,值与原始对象 obj 相同。
      • lowerize 函数返回这个新对象,并使用 LowercasedKeys 类型断言来指明返回值的类型。


upperize:将对象的所有key转换为大写形式


  • 使用说明

    • 功能说明:用于将一个对象的所有键转换为大写形式,而 mapKeys 函数则用于一般性地将一个对象的键通过一个映射函数 mapFunc 转换为新的键。
    • 参数:目标对象、映射函数。
    • 返回值:转换后的新对象。

  • 使用代码示例
    1. import { upperize } from 'radash'
    2. const ra = {
    3.  Mode: 'god',
    4.  Power: 'sun'
    5. }
    6. upperize(ra) // => { MODE, POWER }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `upperize`。
    2. export const upperize = <T extends Record<string, any>>(obj: T) =>
    3.  // 调用 `mapKeys` 函数将 `obj` 的所有键转换为大写。
    4.  mapKeys(obj, k => k.toUpperCase()) as UppercasedKeys<T>
    5.  // `UppercasedKeys<T>` 是一个类型,表示将 `T` 的键转换为大写后的新类型。
    6. // 定义一个泛型函数 `mapKeys`。
    7. export const mapKeys = <
    8.  // `TValue` 表示对象的值的类型。
    9.  TValue,
    10.  // `TKey` 表示原始对象的键的类型。
    11.  TKey extends string | number | symbol,
    12.  // `TNewKey` 表示映射后的新键的类型。
    13.  TNewKey extends string | number | symbol
    14. >(
    15.  // `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    16.  obj: Record<TKey, TValue>,
    17.  // `mapFunc` 是一个映射函数,它接受一个键和一个值,并返回一个新的键。
    18.  mapFunc: (key: TKey, value: TValue) => TNewKey
    19. ): Record<TNewKey, TValue> => {
    20.  // 使用 `Object.keys` 获取 `obj` 的所有键,并断言它们的类型为 `TKey`。
    21.  const keys = Object.keys(obj) as TKey[]
    22.  // 使用 `reduce` 方法遍历所有键,创建一个新对象,其键为 `mapFunc` 函数的返回值,值为 `obj` 的值。
    23.  return keys.reduce((acc, key) => {
    24.    // 调用 `mapFunc` 函数获取新键,并将 `obj` 中的值赋给新键。
    25.    acc[mapFunc(key as TKey, obj[key])] = obj[key]
    26.    // 返回累加器 `acc`,它是正在构建的新对象。
    27.    return acc
    28.   }, {} as Record<TNewKey, TValue>) // 初始累加器是一个空对象,类型为 `Record<TNewKey, TValue>`。
    29. }
    复制代码

    • 方法流程说明:

      • upperize 函数接受一个对象 obj 作为参数。
      • 它调用 mapKeys 函数,传入 obj 和一个将键转换为大写的函数。
      • mapKeys 函数遍历 obj 的所有键,并将每个键转换为大写。
      • mapKeys 返回一个新对象,这个对象的键是大写形式,值与原始对象 obj 相同。
      • upperize 函数返回这个新对象,并使用 UppercasedKeys 类型断言来指明返回值的类型。


mapEntries:将对象的键值对通过一个转换函数映射为新的对象


  • 使用说明

    • 功能说明:用于将一个对象的键值对通过一个转换函数 toEntry 映射为新的键值对,并创建一个新的对象。这个函数接受两个参数:一个对象 obj 和一个转换函数 toEntry。toEntry 函数接受对象的每个键和对应的值,并返回一个包含新键和新值的元组。
    • 参数:目标对象、转换函数。
    • 返回值:构建完成的结果对象。

  • 使用代码示例
    1. import { mapEntries } from 'radash'
    2. const ra = {
    3.  name: 'Ra',
    4.  power: 'sun',
    5.  rank: 100,
    6.  culture: 'egypt'
    7. }
    8. mapEntries(ra, (key, value) => [key.toUpperCase(), `${value}`]) // => { NAME: 'Ra', POWER: 'sun', RANK: '100', CULTURE: 'egypt' }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `mapEntries`。
    2. export const mapEntries = <
    3.  // `TKey` 表示原始对象的键的类型。
    4.  TKey extends string | number | symbol,
    5.  // `TValue` 表示原始对象的值的类型。
    6.  TValue,
    7.  // `TNewKey` 表示新对象的键的类型。
    8.  TNewKey extends string | number | symbol,
    9.  // `TNewValue` 表示新对象的值的类型。
    10.  TNewValue
    11. >(
    12.  // `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    13.  obj: Record<TKey, TValue>,
    14.  // `toEntry` 是一个转换函数,它接受一个键和一个值,并返回一个新的键值对的元组。
    15.  toEntry: (key: TKey, value: TValue) => [TNewKey, TNewValue]
    16. ): Record<TNewKey, TNewValue> => {
    17.  // 如果 `obj` 为空,则返回一个空对象。
    18.  if (!obj) return {} as Record<TNewKey, TNewValue>
    19.  // 使用 `Object.entries` 获取 `obj` 的所有键值对,并使用 `reduce` 方法来构建新对象。
    20.  return Object.entries(obj).reduce((acc, [key, value]) => {
    21.    // 对每个键值对,调用 `toEntry` 函数,并获取新键 `newKey` 和新值 `newValue`。
    22.    const [newKey, newValue] = toEntry(key as TKey, value as TValue)
    23.    // 将新键值对添加到累加器对象 `acc` 中。
    24.    acc[newKey] = newValue
    25.    // 返回累加器 `acc`。
    26.    return acc
    27.   }, {} as Record<TNewKey, TNewValue>) // 初始累加器是一个空对象,类型为 `Record<TNewKey, TNewValue>`。
    28. }
    复制代码

    • 方法流程说明:

      • mapEntries 函数接受一个对象 obj 和一个转换函数 toEntry 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 obj 非空,函数使用 Object.entries 获取 obj 的所有键值对。
      • 函数使用 reduce 方法遍历键值对数组。
      • 对于每个键值对,函数调用 toEntry 函数,传入键和值,并将返回的新键值对添加到累加器数组中。
      • 返回构建完成的结果对象。


mapKeys:把对象的kye通过一个映射函数转换为新的key


  • 使用说明

    • 功能说明:将一个对象的键通过一个映射函数 mapFunc 转换为新的键,并创建一个新对象。这个函数接受两个参数:一个对象 obj 和一个映射函数 mapFunc。mapFunc 函数接受对象的每个键和对应的值,并返回一个新的键。
    • 参数:目标对象、映射函数。
    • 返回值:构建完成的新对象。

  • 使用代码示例
    1. import { mapKeys } from 'radash'
    2. const ra = {
    3.  mode: 'god',
    4.  power: 'sun'
    5. }
    6. mapKeys(ra, key => key.toUpperCase()) // => { MODE, POWER }
    7. mapKeys(ra, (key, value) => value) // => { god: 'god', power: 'power' }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `mapKeys`。
    2. export const mapKeys = <
    3.  // `TValue` 表示对象的值的类型。
    4.  TValue,
    5.  // `TKey` 表示原始对象的键的类型。
    6.  TKey extends string | number | symbol,
    7.  // `TNewKey` 表示映射后的新键的类型。
    8.  TNewKey extends string | number | symbol
    9. >(
    10.  // `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    11.  obj: Record<TKey, TValue>,
    12.  // `mapFunc` 是一个映射函数,它接受一个键和一个值,并返回一个新的键。
    13.  mapFunc: (key: TKey, value: TValue) => TNewKey
    14. ): Record<TNewKey, TValue> => {
    15.  // 使用 `Object.keys` 获取 `obj` 的所有键,并断言它们的类型为 `TKey`。
    16.  const keys = Object.keys(obj) as TKey[]
    17.  // 使用 `reduce` 方法遍历所有键,创建一个新对象,其键为 `mapFunc` 函数的返回值,值为 `obj` 的值。
    18.  return keys.reduce((acc, key) => {
    19.    // 调用 `mapFunc` 函数获取新键,并将 `obj` 中的值赋给新键。
    20.    acc[mapFunc(key as TKey, obj[key])] = obj[key]
    21.    // 返回累加器 `acc`,它是正在构建的新对象。
    22.    return acc
    23.   }, {} as Record<TNewKey, TValue>) // 初始累加器是一个空对象,类型为 `Record<TNewKey, TValue>`。
    24. }
    复制代码

    • 方法流程说明:

      • mapKeys 函数接受一个对象 obj 和一个映射函数 mapFunc 作为参数。
      • 函数使用 Object.keys 获取 obj 的所有键。
      • 函数使用 reduce 方法遍历键数组。
      • 对于每个键,函数调用 mapFunc 函数,传入键和值,并将返回的新键作为新对象的键。
      • 新对象的值与原始对象 obj 中的值相同。
      • 返回构建完成的新对象。


mapValues:对象的value通过一个映射函数转换为新的value


  • 使用说明

    • 功能说明:将一个对象的值通过一个映射函数 mapFunc 转换为新的值,并创建一个新对象。这个函数接受两个参数:一个对象 obj 和一个映射函数 mapFunc。mapFunc 函数接受对象的每个值和对应的键,并返回一个新的值。
    • 参数:目标对象、映射函数。
    • 返回值:构建完成的新对象。

  • 使用代码示例
    1. import { clone } from 'radash'
    2. const ra = {
    3.  name: 'Ra',
    4.  power: 100
    5. }
    6. const gods = [ra]
    7. clone(ra) // => copy of ra
    8. clone(gods) // => copy of gods
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `mapValues`。
    2. export const mapValues = <
    3.  // `TValue` 表示原始对象的值的类型。
    4.  TValue,
    5.  // `TKey` 表示对象键的类型。
    6.  TKey extends string | number | symbol,
    7.  // `TNewValue` 表示映射后的新值的类型。
    8.  TNewValue
    9. >(
    10.  // `obj` 是一个对象,其键的类型为 `TKey`,值的类型为 `TValue`。
    11.  obj: Record<TKey, TValue>,
    12.  // `mapFunc` 是一个映射函数,它接受一个值和一个键,并返回一个新的值。
    13.  mapFunc: (value: TValue, key: TKey) => TNewValue
    14. ): Record<TKey, TNewValue> => {
    15.  // 使用 `Object.keys` 获取 `obj` 的所有键,并断言它们的类型为 `TKey`。
    16.  const keys = Object.keys(obj) as TKey[]
    17.  // 使用 `reduce` 方法遍历所有键,创建一个新对象,其键与 `obj` 相同,值为 `mapFunc` 函数的返回值。
    18.  return keys.reduce((acc, key) => {
    19.    // 调用 `mapFunc` 函数获取新值,并将其赋给新对象 `acc` 的同名键。
    20.    acc[key] = mapFunc(obj[key], key)
    21.    // 返回累加器 `acc`,它是正在构建的新对象。
    22.    return acc
    23.   }, {} as Record<TKey, TNewValue>) // 初始累加器是一个空对象,类型为 `Record<TKey, TNewValue>`。
    24. }
    复制代码

    • 方法流程说明:

      • mapValues 函数接受一个对象 obj 和一个映射函数 mapFunc 作为参数。
      • 函数使用 Object.keys 获取 obj 的所有键。
      • 函数使用 reduce 方法遍历键数组。
      • 对于每个键,函数调用 mapFunc 函数,传入值和键,并将返回的新值作为新对象的值。
      • 新对象的键与原始对象 obj 中的键相同。
      • 返回构建完成的新对象。


omit:创建一个省略了 keys 数组中指定的一些键的新对象


  • 使用说明

    • 功能说明:创建一个新的对象,该对象是原始对象 obj 的副本,但省略了 keys 数组中指定的一些键。这个函数接受两个参数:一个对象 obj 和一个包含要省略键名的数组 keys。
    • 参数:目标对象、要省略的key数组。
    • 返回值:省略了指定键的新对象。

  • 使用代码示例
    1. import { omit } from 'radash'
    2. const fish = {
    3.  name: 'Bass',
    4.  weight: 8,
    5.  source: 'lake',
    6.  brackish: false
    7. }
    8. omit(fish, ['name', 'source']) // => { weight, brackish }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `omit`。
    2. export const omit = <T, TKeys extends keyof T>(
    3.  // `obj` 是一个对象,其类型为泛型 `T`。
    4.  obj: T,
    5.  // `keys` 是一个数组,包含对象 `obj` 中要省略的键名,键名的类型为 `TKeys`。
    6.  keys: TKeys[]
    7. ): Omit<T, TKeys> => {
    8.  // 如果 `obj` 为空,则返回一个空对象。
    9.  if (!obj) return {} as Omit<T, TKeys>
    10.  // 如果 `keys` 为空或长度为0,则返回原始对象 `obj`。
    11.  if (!keys || keys.length === 0) return obj as Omit<T, TKeys>
    12.  // 使用 `reduce` 方法遍历 `keys` 数组,从 `obj` 中省略指定的键。
    13.  return keys.reduce(
    14.    (acc, key) => {
    15.      // 在这个较为局限的上下文中,允许直接在累加器对象 `acc` 上使用 `delete` 操作符。
    16.      // 这是出于性能考虑,通常不建议在其他地方使用这种模式。
    17.      delete acc[key]
    18.      // 返回更新后的累加器 `acc`。
    19.      return acc
    20.    },
    21.    // 使用对象展开运算符 `{ ...obj }` 创建 `obj` 的浅拷贝,以避免直接修改原始对象。
    22.    { ...obj }
    23.   )
    24. }
    复制代码

    • 方法流程说明:

      • omit 函数接受一个对象 obj 和一个键名数组 keys 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 keys 为空或长度为0,函数返回原始对象 obj。
      • 如果 keys 非空,函数使用 reduce 方法遍历 keys 数组。
      • 对于每个键名 key,函数使用 delete 操作符将其从累加器对象 acc 中删除。
      • 函数返回省略了指定键的新对象。


pick:创建一个只包含原始对象中指定的 keys`的对象


  • 使用说明

    • 功能说明:创建一个新的对象,该对象只包含原始对象 obj 中指定的 keys。这个函数接受两个参数:一个对象 obj 和一个包含要选择键名的数组 keys。
    • 参数:目标对象、需要包含的key的数组
    • 返回值:过滤完后的映射值组成的数组。

  • 使用代码示例
    1. import { pick } from 'radash'
    2. const fish = {
    3.  name: 'Bass',
    4.  weight: 8,
    5.  source: 'lake',
    6.  barckish: false
    7. }
    8. pick(fish, ['name', 'source']) // => { name, source }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `pick`。
    2. export const pick = <T extends object, TKeys extends keyof T>(
    3.  // `obj` 是一个对象,其类型为泛型 `T`。
    4.  obj: T,
    5.  // `keys` 是一个数组,包含对象 `obj` 中要选择的键名,键名的类型为 `TKeys`。
    6.  keys: TKeys[]
    7. ): Pick<T, TKeys> => {
    8.  // 如果 `obj` 为空,则返回一个空对象。
    9.  if (!obj) return {} as Pick<T, TKeys>
    10.  // 使用 `reduce` 方法遍历 `keys` 数组,从 `obj` 中选择指定的键。
    11.  return keys.reduce((acc, key) => {
    12.    // 检查 `obj` 是否自身拥有属性 `key`(不是从原型链继承来的)。
    13.    if (Object.prototype.hasOwnProperty.call(obj, key))
    14.      // 如果 `obj` 拥有 `key`,则将其添加到累加器对象 `acc` 中。
    15.      acc[key] = obj[key]
    16.    // 返回累加器 `acc`。
    17.    return acc
    18.   }, {} as Pick<T, TKeys>) // 初始累加器是一个空对象,类型为 `Pick<T, TKeys>`。
    19. }
    复制代码

    • 方法流程说明:

      • pick 函数接受一个对象 obj 和一个键名数组 keys 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 obj 非空,函数使用 reduce 方法遍历 keys 数组。
      • 对于每个键名 key,函数检查 obj 是否自身拥有这个属性(而不是从原型链继承的)。
      • 如果 obj 自身拥有这个属性,函数将这个属性及其值添加到累加器对象 acc 中。
      • 函数返回包含所选键的新对象。


set:在一个对象中设置一个由点或方括号表示法指定的路径上的值


  • 使用说明

    • 功能说明:用于在一个对象中设置一个值,该值位于由点或方括号表示法指定的路径上。如果路径中的任何中间对象不存在,set 函数将创建它们。
    • 参数:初始对象、属性路径字符串、设置值。

  • 使用代码示例
    1. import { set } from 'radash'
    2. set({}, 'name', 'ra')
    3. // => { name: 'ra' }
    4. set({}, 'cards[0].value', 2)
    5. // => { cards: [{ value: 2 }] }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `set`。
    2. export const set = <T extends object, K>(
    3.  // `initial` 是初始对象,我们将在其中设置值。
    4.  initial: T,
    5.  // `path` 是一个字符串,表示要设置值的属性路径。
    6.  path: string,
    7.  // `value` 是我们要设置在路径上的值。
    8.  value: K
    9. ): T => {
    10.  // 如果 `initial` 为空,则返回一个空对象。
    11.  if (!initial) return {} as T
    12.  // 如果 `path` 为空或 `value` 未定义,则返回原始对象 `initial`。
    13.  if (!path || value === undefined) return initial
    14.  // 使用正则表达式分割路径字符串,得到一个属性名的数组 `segments`。
    15.  // 过滤掉空字符串,确保所有段都是有效的。
    16.  const segments = path.split(/[.[]]/g).filter(x => !!x.trim())
    17.  // 定义一个递归辅助函数 `_set`。
    18.  const _set = (node: any) => {
    19.    // 如果路径 `segments` 有多个段,我们需要深入嵌套结构。
    20.    if (segments.length > 1) {
    21.      // 弹出当前段的键名 `key`。
    22.      const key = segments.shift() as string
    23.      // 检查下一个段是否表示数组索引。
    24.      const nextIsNum = toInt(segments[0], null) === null ? false : true
    25.      // 如果当前键不存在,创建一个新的对象或数组,取决于下一个段是否是数字。
    26.      node[key] = node[key] === undefined ? (nextIsNum ? [] : {}) : node[key]
    27.      // 递归调用 `_set` 函数,继续设置值。
    28.      _set(node[key])
    29.    } else {
    30.      // 如果路径 `segments` 只有一个段,直接在当前节点上设置值。
    31.      node[segments[0]] = value
    32.    }
    33.   }
    34.  // ...(函数的其余部分)
    35. }
    复制代码

    • 方法流程说明:

      • set 函数接受一个对象 initial,一个路径字符串 path,和一个值 value 作为参数。
      • 如果 initial 为空,函数返回一个空对象。
      • 如果 path 为空或 value 未定义,函数返回原始对象 initial。
      • 函数使用正则表达式分割 path 字符串,得到一个表示属性链的数组 segments。
      • 函数定义了一个递归辅助函数 _set,它负责沿着 segments 的路径设置值。
      • 如果 segments 数组有多个元素,函数递归地创建或获取中间对象,并继续沿着路径设置值。
      • 如果 segments 数组只有一个元素,函数在当前的节点上设置值。
      • _set 函数从根对象 initial 开始递归设置值。


shake:过滤对象


  • 使用说明

    • 功能说明:创建一个新的对象,该对象是原始对象 obj 的副本,但省略了那些经过 filter 函数检查并返回 true 的属性。filter 函数默认会过滤掉值为 undefined 的属性。
    • 参数:目标对象、[过滤函数]。
    • 返回值:过滤完后的映射值组成的数组。

  • 使用代码示例
    1. import { shake } from 'radash'
    2. const ra = {
    3.  mode: 'god',
    4.  greek: false,
    5.  limit: undefined
    6. }
    7. shake(ra) // => { mode, greek }
    8. shake(ra, a => !a) // => { mode }
    复制代码
  • 源码解析
    1. // 定义一个泛型函数 `shake`。
    2. export const shake = <RemovedKeys extends string, T>(
    3.  // 参数 `obj` 是一个对象,其类型为泛型 `T`。
    4.  obj: T,
    5.  // 参数 `filter` 是一个可选的函数,用于决定哪些属性应该被省略。
    6.  // 默认情况下,它会过滤掉值为 `undefined` 的属性。
    7.  filter: (value: any) => boolean = x => x === undefined
    8. ): Omit<T, RemovedKeys> => {
    9.  // 如果 `obj` 为空,则返回一个空对象。
    10.  // 这里返回的类型应该是 `Omit<T, RemovedKeys>` 而不是 `T`。
    11.  if (!obj) return {} as Omit<T, RemovedKeys>
    12.  // 使用 `Object.keys` 获取 `obj` 的所有键,并将其类型断言为 `T` 的键的类型数组。
    13.  const keys = Object.keys(obj) as (keyof T)[]
    14.  // 使用 `reduce` 方法遍历所有键,创建一个新对象。
    15.  return keys.reduce((acc, key) => {
    16.    // 如果 `filter` 函数对当前键的值返回 `true`,则省略该属性。
    17.    if (filter(obj[key])) {
    18.      return acc
    19.    } else {
    20.      // 否则,将属性添加到累加器对象 `acc` 中。
    21.      acc[key] = obj[key]
    22.      return acc
    23.    }
    24.   }, {} as Omit<T, RemovedKeys>) // 初始累加器是一个空对象,类型为 `Omit<T, RemovedKeys>`。
    25. }
    复制代码

    • 方法流程说明:

      • shake 函数接受一个对象 obj 和一个可选的过滤函数 filter 作为参数。
      • 如果 obj 为空,函数返回一个空对象。
      • 如果 obj 非空,函数使用 Object.keys 获取 obj 的所有键。
      • 函数使用 reduce 方法遍历键数组。
      • 对于每个键,函数使用 filter 函数检查对应的值,以确定是否应该省略该属性。
      • 如果 filter 函数返回 false,函数将该属性及其值添加到累加器对象 acc 中。
      • 返回包含所选属性的新对象。


写在后面


  • 我相信能看到最后的都是帅气多金想进步的大漂亮和大帅笔,感谢阅读到这儿!
  • 等所有方法更新完毕,作者会整理一份radash完整方法目录上传,包括思维导图和使用目录。
  • 大家有任何问题或见解,欢迎评论区留言交流和批评指正!!!
  • 你的每一个收藏都是作者写作的动力!!!
  • 点击访问:radash官网

来源:https://www.cnblogs.com/muqiqiang/p/18211285
免责声明:由于采集信息均来自互联网,如果侵犯了您的权益,请联系我们【E-Mail:cb@itdo.tech】 我们会及时删除侵权内容,谢谢合作!

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x

举报 回复 使用道具