将数组中的所有键从下划线转换为js中的驼峰式大小写答案

【问题标题】：Transform all keys in array from underscore to camel case in js将数组中的所有键从下划线转换为js中的驼峰式大小写
【发布时间】：2016-07-30 06:12:56
【问题描述】：

所以，我需要将数组中的所有键从下划线转换为 js 中的驼峰空间。这就是我在将表单发送到服务器之前需要做的事情。我正在使用Angular.js，我想将它表示为一个过滤器（但我认为在这种情况下它并不重要）。无论如何，这是我创建的一个函数。

.filter('underscoreToCamelKeys', function () {
        return function (data) {

            var tmp = [];
            function keyReverse(array) {
                angular.forEach(array, function (value, key) {
                        tmp[value] = underscoreToCamelcase(key);
                });

                return tmp;
            }

            var new_obj = {};
            for (var prop in keyReverse(data)) {
                if(tmp.hasOwnProperty(prop)) {
                    new_obj[tmp[prop]] = prop;
                }
            }
            return new_obj;
        };

        function underscoreToCamelcase (string) {
            return string.replace(/(\_\w)/g, function(m){
                return m[1].toUpperCase();
            });
        }
    })

在这里我将尝试解释它是如何工作的，因为它一开始看起来很糟糕。

underscoreToCamelcase 函数只是将下划线中的任何字符串恢复为大小写，但第一个字符除外（如some_string => someString）

所以，正如我之前所说，我应该将所有键恢复为驼峰大小写，但正如您所了解的，我们不能简单地写

date[key] = underscoreToCamelcase(key)

所以keyReverse 函数返回一个还原的数组，这里是示例

some_key => value

将会

value => someKey

最后我只是将键和值还原回来，以得到这个

someKey => value

但是，你可能已经理解了，我遇到了一个问题，如果数组中存在相同的值，那么这些数据将会消失

数组

some_key1 => value, some_key2 => value

返回为

someKey2 => value

那么我该如何解决呢？我有一个建议来检查这些值是否存在以及是否添加一些特殊的子字符串，像这样

some_key1 => value, some_key2 => value

value => someKey1, zx99value => someKey2

毕竟为 zx99 解析它，但我想我快疯了...... 在这种情况下，也许有人有更好的解决方案？

重要！他们的主要问题不仅仅是将一些字符串转换为驼峰大小写，而是使用数组键！

【问题讨论】：

一种解决方案是使用npmjs.com/package/camelcase，这正是您想要的。
不是，因为问题是将数组键恢复为驼峰大小写，而不是仅仅驼峰化字符串，我已经创建了一个驼峰化字符串的函数underscoreToCamelcase
var str = "under_score", rep = str.replace(/_([a-z])/,function(match, p1) { return p1.toUpperCase(); }); // <- underScore
伙计们，我的驼峰函数下划线完美运行，命名为underscoreToCamelcase，问题是恢复数组键
你为什么要切换键/值对？为什么不随手更换钥匙呢？例如提取值和键，删除当前键，设置转换后的键下的值

标签： javascript arrays angularjs

【解决方案1】：

如果您使用现有库进行驼峰变换，则可以像这样减少对象

import {camelCase} from 'lodash/string'

const camelCaseKeys = (obj) =>
  Object.keys(obj).reduce((ccObj, field) => ({
    ...ccObj,
    [camelCase(field)]: obj[field]
  }), {})

【讨论】：

这不处理嵌套的 json 对象
[camelCase(field)]: typeof obj === "object" ? camelCaseKeys(obj[field]) : obj[field] 会这样做
您的嵌套对象示例很棒，但会破坏值。这是工作：stackoverflow.com/a/50620653/3332734

【解决方案2】：

.filter('underscoreToCamelKeys', function () {
        return function (data) {

            var tmp = {};
            angular.forEach(data, function (value, key) {
                var tmpvalue = underscoreToCamelcase(key);
                tmp[tmpvalue] = value;
            });

            return tmp;
        };

        function underscoreToCamelcase (string) {
            return string.replace(/(\_\w)/g, function(m){
                return m[1].toUpperCase();
            });
        }
    })

感谢 ryanlutgen

【讨论】：

【解决方案3】：

作为替代解决方案，您可以使用JSON.stringify 方法的可选replacer 参数。

var result = JSON.stringify(myVal, function (key, value) {

  if (value && typeof value === 'object') {
    var replacement = {};
    for (var k in value) {
      if (Object.hasOwnProperty.call(value, k)) {
        replacement[underscoreToCamelcase(k)] = value[k];
      }
    }
    return replacement;
  }

  return value;
});

当然，你最终会得到一个字符串，并且必须调用JSON.parse 来获取对象。

【讨论】：