javascript 将嵌套对象数组的所有键转换为驼峰式大小写的最佳方法是什么?

eimct9ow  于 2023-06-20  发布在  Java
关注(0)|答案(2)|浏览(159)

我想把我的对象数组的所有键都转换为Typescript中的camelCase。我有以下数据:

[
    {
       "Name":"Custom property",
       "Details":{
          "Address":"Huston",
          "Price":"1000000",
       },
       "Contact":{
          "Global":"3432432",
          "Local":"432423423"
       },
    },
    {
       "Name":"Myproperty",
       "Details":{
          "Address":"Huston",
          "Price":"10000001",
       },
       "Contact":{
          "Global":"34324323",
          "Local":"4324234233"
       },
    },
]

我已经尝试了下面的代码,但它返回一个新的字典只有细节。我该怎么解决呢?

const newObjOptions = options.map((obj: any) =>
    Object.fromEntries(
      Object.entries(obj).map(([k, v]) => [_.camelCase(k), v])
    )
  );
  const newObjDetailsOptions = newObjOptions.map((obj: any) =>
    Object.fromEntries(
      Object.entries(obj.details).map(([k, v]) => [_.camelCase(k), v])
    )
  );
w8ntj3qf

w8ntj3qf1#

如果同时记录newObjOptionsnewObjDetailsOptions,您的实现可以正常工作,您将看到键的顶层确实是 Camel 大小写。
主要问题是代码没有检查对象是否包含任何其他对象。

const newObjOptions = options.map((obj) =>
  Object.fromEntries(
    // Here you should check if `v` is an object
    // and if so you need to camel-case that too
    Object.entries(obj).map(([k, v]) => [_.camelCase(k), v])
  )
)

要修改你的代码来做到这一点,你可以这样做:

// Here we check if `v` is an object and if it is we apply camel casing to that too
const camelCaseEntry = ([k, v]) => [_.camelCase(k), typeof v === 'object' ? camelCaseObject(v) : v]

const camelCaseObject = obj => Object.fromEntries(
  Object.entries(obj).map(camelCaseEntry)
)

const newObjOptions = options.map(camelCaseObject)
console.log(newObjOptions)

这在你的例子中是可行的,但是如果你的对象包含一个数组(试试看),它就会中断。这可以用一个简单的递归函数很好地解决,这里有一个可能看起来像什么的想法:

/**
 * Takes any object and returns a new object with all keys in camel case
 */
function camelCaseObject (object) {
  if (Array.isArray(object)) {
    return object.map(camelCaseObject)
  }
  if (typeof object === 'object') {
    const entries = Object.entries(object)
    return Object.fromEntries(entries.map(transfromEntry))
  }
  return object

  function transfromEntry ([k, v]) {
    return [
      _.camelCase(k),
      typeof v === 'object' ? camelCaseObject(v) : v
    ]
  }
}
3ks5zfa0

3ks5zfa02#

虽然kill提供的答案被接受,但当我试图在内部使用它时,有两个缺点。
1.不是一般的。
1.它不能处理null值(如果嵌套数组包含任何空值,则会导致永不返回的函数)
让我们编写一个泛型函数,它也可以处理null值:

const objectify = (transformFn: (key: string) => string) => (object: object): object => {
  const transform = ([k, v]: [string, any]) => [
    transformFn(k),
    typeof v === 'object' ? objectify(transformFn)(v) : v
  ]

  if (Array.isArray(object)) {
    return object.map(objectify(transformFn))
  }

  if (typeof object === 'object' && object !== null) {
    const entries = Object.entries(object)
    return Object.fromEntries(entries.map(transform))
  }

  return object
}

export default objectify

现在让我们使用objectify实现camelCase:

import { camelCase } from 'lodash'
import objectify from './objectify'

const camelify = <T extends object> (object: T): object => objectify(camelCase)(object)

export default camelify

要使用此函数,只需将您的对象传入其中:import camelify from './camelify'

const object = camelify({hello_world: 'value'}); // becomes {helloWorld: 'value'}

相关问题