如何在我的应用程序中将蛇案例转换为camelcase

时间:2016-11-20 23:22:36

标签: javascript lodash

我的lodash代码中有一个非常奇怪的问题

我有类似

的东西
data = {
   'id':'123',
   'employee_name': 'John',
   'employee_type': 'new'  
}

var newObj = _.mapValues(data, function (value, key) {
     var t = _.camelCase(key);
     console.log(t) -> shows employeeName and employeeType

     return _.camelCase(key);
});

我期待我的newObj将成为

data = {
   'id':'123',
   'employeeName': 'John',
   'employeeType': 'new'  
}

在我运行上面的代码之后,它仍然保持原样

data = {
   'id':'123',
   'employee_name': 'John',
   'employee_type': 'new'  
}

这太奇怪了,我不知道出了什么问题。有人可以帮我这个吗?非常感谢!

13 个答案:

答案 0 :(得分:9)

使用_.mapKeys()代替_.mapValues()



var data = {
   'id': '123',
   'employee_name': 'John',
   'employee_type': 'new'  
};

var newObj = _.mapKeys(data, function (value, key) {
     return _.camelCase(key);
});

console.log('newObj: ', newObj);

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.2/lodash.min.js"></script>
&#13;
&#13;
&#13;

您可以通过将_.rearg()应用于_.camelCase()来缩短它,因此它将使用第二个arg(键)而不是第一个(值):

&#13;
&#13;
var data = {
   'id': '123',
   'employee_name': 'John',
   'employee_type': 'new'  
};

var newObj = _.mapKeys(data, _.rearg(_.camelCase, 1));

console.log('newObj: ', newObj);
&#13;
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.2/lodash.min.js"></script>
&#13;
&#13;
&#13;

答案 1 :(得分:3)

您也可以轻松地为此创建自己的功能:

&#13;
&#13;
var data = {
  'id': '123',
  'employee_name': 'John',
  'employee_type': 'new'
}

function camelCase(obj) {
  var newObj = {};
  for (d in data) {
    if (data.hasOwnProperty(d)) {
      newObj[d.replace(/(\_\w)/g, function(k) {
        return k[1].toUpperCase();
      })] = data[d];
    }
  }
  return newObj;
}

console.log(camelCase(data));
&#13;
&#13;
&#13;

答案 2 :(得分:3)

仅在字符串(ES6 +)中为蛇形到驼峰式

const snakeToCamel = str =>
  str.toLowerCase().replace(/([-_][a-z])/g, group =>
    group
      .toUpperCase()
      .replace('-', '')
      .replace('_', '')
  );

结果:

console.log(snakeToCamel('TO_CAMEL')) //toCamel
console.log(snakeToCamel('to_camel')) //toCamel
console.log(snakeToCamel('TO-CAMEL')) //toCamel
console.log(snakeToCamel('to-camel')) //toCamel

答案 3 :(得分:2)

这是另一个使用简单for循环的答案。

var data = {
   'id': '123',
   'employee_name': 'John',
   'employee_type': 'new'  
};

var output = {}
for (var key in data) {
  output[_.camelCase(key)] = data[key];
}

答案 4 :(得分:2)

在我的用例中,我需要(或想要)一个能够处理任意json对象(包括嵌套对象,数组等)的函数。解决这个问题似乎到目前为止一直有效:

const fromSnakeToCamel = (data) => {
  if (_.isArray(data)) {
    return _.map(data, fromSnakeToCamel);
  }

  if (_.isObject(data)) {
    return _(data)
      .mapKeys((v, k) => _.camelCase(k))
      .mapValues((v, k) => fromSnakeToCamel(v))
      .value();
  }

  return data;
}

请注意,如果它不是数组或对象,我只是返回数据,因为我实际上只想转换键。无论如何,希望这对某人有帮助

答案 5 :(得分:1)

如果你想转换嵌套对象,那么使用lodash可能会有点痛苦。

我尝试使用正则表达式,JSON.parse&amp; JSON.stringify 这是相同的代码

下面的代码返回具有驼峰案例而不是蛇案例的新对象

//input
var data = {
   'id': '123',
   'employee_name': 'John',
   'employee_type': {'new_name': 'foo'}  
};

JSON.parse(JSON.stringify(data).replace(
                /(_\w)\w+":/g,
                match => match[1].toUpperCase() + match.substring(2)
              ));

{
   'id': '123',
   'employeeName': 'John',
   'employeeType': {'newName': 'foo'}  
}

答案 6 :(得分:1)

这些都是很好的答案,但它们不符合我的需求。我喜欢Ashish的答案,因为它可以处理嵌套的对象,但是如果想要的数据中有下划线,该怎么办?因此,这是使Bambam递归的一个变体,因为lodash有时会很痛苦。

function toCamelCase (obj) {
    let rtn = obj
    if (typeof (obj) === 'object') {
        if (obj instanceof Array) {
            rtn = obj.map(toCamelCase)
        } else {
            rtn = {}
            for (let key in obj) {
                if (obj.hasOwnProperty(key)) {
                     const newKey = key.replace(/(_\w)/g, k => k[1].toUpperCase())
                     rtn[newKey] = toCamelCase(obj[key])
                }
            }
        }
    }
    return rtn
}

答案 7 :(得分:1)

试试这个它肯定会按预期工作。

const helpers = {};

helpers.camelize = function(str) {
    return str.trim().replace(/[A-Z]+/g, (letter, index) => {
        return index == 0 ? letter.toLowerCase() : '_' + letter.toLowerCase();
    }).replace(/(.(\_|-|\s)+.)/g, function(subStr) {
        return subStr[0]+(subStr[subStr.length-1].toUpperCase());
    });
}


helpers.camelizeKeys = function(data) {
    const result = {};
    for (const [key, val] of Object.entries(data)) {
        result[helpers.camelize(key)] = val;
    }
    return result;
}

helpers.camelizeNestedKeys = function(dataObj) {
    return JSON.parse(JSON.stringify(dataObj).trim().replace(/("\w+":)/g, function(keys) {
        return keys.replace(/[A-Z]+/g, (letter, index) => {
            return index == 0 ? letter.toLowerCase() : '_' + letter.toLowerCase();
        }).replace(/(.(\_|-|\s)+.)/g, function(subStr) {
            return subStr[0]+(subStr[subStr.length-1].toUpperCase());
        });
    }));
}


const data = {
    'id':'123',
    'employee_name': 'John',
    'employee_type': 'new'  
};

const nestedData = {
    'id':'123',
    'employee_name': 'John',
    'employee_type': 'new',
    'exployee_projects': [
        {"project_name": "test1", "project_year": 2004},
        {"project_name": "test2", "project_year": 2004}
    ]
};


// Few camelize Examples
const str1 = "banana_orange_apple_mango";
const str2 = "banana-orange-apple-mango";
const str3 = "banana orange apple mango";
const str4 = "BANANA Orange APPLE-mango";
const str5 = "banana 5orange apple #mango";
const str6 = "banana__orange-_apple5-#mango";

console.log(helpers.camelize(str1));
console.log(helpers.camelize(str2));
console.log(helpers.camelize(str3));
console.log(helpers.camelize(str4));
console.log(helpers.camelize(str5));
console.log(helpers.camelize(str6));

console.log("=============================");

// camelize object keys 
console.log(helpers.camelizeKeys(data));

console.log("=============================");

// camelize nested object keys
console.log(helpers.camelizeNestedKeys(nestedData));

答案 8 :(得分:0)

另一种方式

 _(data)
     .keys()
     .map(_.camelCase)
     .zipObject(_.values(data))
     .value()

答案 9 :(得分:0)

我真的很喜欢Mardok带有嵌套对象的版本,唯一的问题是它将“空”转换为{}

这里是我的

import _ from 'lodash';

export const toCamelCase: any = (obj: any) => {
    let rtn = obj
    if (typeof obj === 'object') {
        if (obj instanceof Array) {
            rtn = obj.map(toCamelCase)
        }
        else if (_.isEmpty(obj)) {
            rtn = null
        } else {
            rtn = {}
            for (let key in obj) {
                if (obj.hasOwnProperty(key)) {
                    const newKey = key.replace(/(_\w)/g, k => k[1].toUpperCase())
                    rtn[newKey] = toCamelCase(obj[key])
                }
            }
        }
    }
    return rtn
}

答案 10 :(得分:0)

是的,我不是图书馆的忠实拥护者。这是使用原生Javascript的方法...

let data = {
   'id':'123',
   'employee_name': 'John',
   'employee_type': 'new'  
}

// #1 simple function which converts a string from snake case to camel case ...
const snakeToCamel = s => s.replace(/(_\w)/g, k => k[1].toUpperCase())

// #2 create new data object with camelCase keys...
data = Object.entries(data).reduce((x,[k,v]) => (x[snakeToCamel(k)]=v) && x, {})

console.log(data)

答案 11 :(得分:0)

以递归方式创建驼色对象。

function camelCase(obj) {
  const newObj = {};
  for (const key in obj) {
    if (obj.hasOwnProperty(key)) {
        const value = obj[key];
        const keyCamel = key.replace(/(\_\w)/g, (match) => match[1].toUpperCase());
        const isRecursive = typeof value === 'object';
        newObj[keyCamel] = isRecursive ? camelCase(value) : value;
    }
  }
  return newObj;
}

let data = {
  id: '123',
  employee_name: 'John',
  inner: {
    employee_type: 'new'
  },
}

camelCase(data);

答案 12 :(得分:-1)

此函数将对象中的所有蛇形大小写键递归转换为驼峰命名。包括数组中的对象和对象中的对象。

const convertSnakeCaseToCamelCase = (obj) => {
    let newObj = {};
    if (typeof(obj) !== 'object') {
        return obj;
    } else if (Array.isArray(obj)) {
        newObj = [];
    }
    for (const key in obj) {
        const childObj = convertSnakeCaseToCamelCase(obj[key]);
        if (Array.isArray(obj)) {
            newObj.push(childObj);
        } else {
            const newKey = key.replace(/(\_\w)/g, (k) => k[1].toUpperCase());
            newObj[newKey] = childObj;
        }
    }
    return newObj;
};