CODEWITHSUNDEEP
javascriptregex
JMac
JMac

Reputation: 1756

Convert javascript object camelCase keys to underscore_case

I want to be able to pass any javascript object containing camelCase keys through a method and return an object with underscore_case keys, mapped to the same values.

So, I have this:

var camelCased = {firstName: 'Jon', lastName: 'Smith'}

And I want a method to output this:

{first_name: 'Jon', last_name: 'Jon'}

What's the fastest way to write a method that takes any object with any number of key/value pairs and outputs the underscore_cased version of that object?

Upvotes: 17

Views: 24172

Answers (10)

Yiming
Yiming

Reputation: 393

You can try let key = 'AttributeKEYName'; let newKey = key.replaceAll(/([A-Z]+)([A-Z][a-z])/g, '$1_$2').replaceAll(/([a-z\d])([A-Z])/g, '$1_$2').toLowerCase();

Upvotes: 0

BelgoCanadian
BelgoCanadian

Reputation: 934

Any of the above snakeCase functions can be used in a reduce function as well:

const snakeCase = [lodash / case-converter / homebrew]

const snakeCasedObject = Object.keys(obj).reduce((result, key) => ({
      ...result,
      [snakeCase(key)]: obj[key],
    }), {})

Upvotes: 0

HiLuLiT
HiLuLiT

Reputation: 553

following what's suggested above, case-converter library is deprectaed, use snakecase-keys instead - https://github.com/bendrucker/snakecase-keys

supports also nested objects & exclusions.

Upvotes: 0

jbrian24
jbrian24

Reputation: 21

Marcos Dimitrio posted above with his conversion function, which works but is not a pure function as it changes the original object passed in, which may be an undesireable side effect. Below returns a new object that doesn't modify the original.

export function camelCaseKeysToSnake(obj){
  if (typeof(obj) != "object") return obj;
  let newObj = {...obj}
  for(var oldName in newObj){

      // Camel to underscore
      let newName = oldName.replace(/([A-Z])/g, function($1){return "_"+$1.toLowerCase();});

      // Only process if names are different
      if (newName != oldName) {
          // Check for the old property name to avoid a ReferenceError in strict mode.
          if (newObj.hasOwnProperty(oldName)) {
              newObj[newName] = newObj[oldName];
              delete newObj[oldName];
          }
      }

      // Recursion
      if (typeof(newObj[newName]) == "object") {
          newObj[newName] = camelCaseKeysToSnake(newObj[newName]);
      }
  }
  return newObj;
}

Upvotes: 2

Denis S Dujota
Denis S Dujota

Reputation: 611

Came across this exact problem when working between JS & python/ruby objects. I noticed the accepted solution is using for in which will throw eslint error messages at you ref: https://github.com/airbnb/javascript/issues/851 which alludes to rule 11.1 re: use of pure functions rather than side effects ref:https://github.com/airbnb/javascript#iterators--nope

To that end, figured i'd share the below which passed the said rules. 

import { snakeCase } from 'lodash'; // or use the regex in the accepted answer

camelCase = obj => {
  const camelCaseObj = {};
  for (const key of Object.keys(obj)){
    if (Object.prototype.hasOwnProperty.call(obj, key)) {
     camelCaseObj[snakeCase(key)] = obj[key];
    }
  }

  return camelCaseObj;
};

Upvotes: 2

Bryan Schoen
Bryan Schoen

Reputation: 761

es6 node solution below. to use, require this file, then pass object you want converted into the function and it will return the camelcased / snakecased copy of the object.

const snakecase = require('lodash.snakecase');

const traverseObj = (obj) => {
  const traverseArr = (arr) => {
    arr.forEach((v) => {
      if (v) {
        if (v.constructor === Object) {
          traverseObj(v);
        } else if (v.constructor === Array) {
          traverseArr(v);
        }
      }
    });
  };

  Object.keys(obj).forEach((k) => {
    if (obj[k]) {
      if (obj[k].constructor === Object) {
        traverseObj(obj[k]);
      } else if (obj[k].constructor === Array) {
        traverseArr(obj[k]);
      }
    }

    const sck = snakecase(k);
    if (sck !== k) {
      obj[sck] = obj[k];
      delete obj[k];
    }
  });
};

module.exports = (o) => {
  if (!o || o.constructor !== Object) return o;

  const obj = Object.assign({}, o);

  traverseObj(obj);

  return obj;
};

Upvotes: 4

Marcos Dimitrio
Marcos Dimitrio

Reputation: 6852

If you have an object with children objects, you can use recursion and change all properties:

function camelCaseKeysToUnderscore(obj){
    if (typeof(obj) != "object") return obj;

    for(var oldName in obj){

        // Camel to underscore
        newName = oldName.replace(/([A-Z])/g, function($1){return "_"+$1.toLowerCase();});

        // Only process if names are different
        if (newName != oldName) {
            // Check for the old property name to avoid a ReferenceError in strict mode.
            if (obj.hasOwnProperty(oldName)) {
                obj[newName] = obj[oldName];
                delete obj[oldName];
            }
        }

        // Recursion
        if (typeof(obj[newName]) == "object") {
            obj[newName] = camelCaseKeysToUnderscore(obj[newName]);
        }

    }
    return obj;
}

So, with an object like this:

var obj = {
    userId: 20,
    userName: "John",
    subItem: {
        paramOne: "test",
        paramTwo: false
    }
}

newobj = camelCaseKeysToUnderscore(obj);

You'll get:

{
    user_id: 20,
    user_name: "John",
    sub_item: {
        param_one: "test",
        param_two: false
    }
}

Upvotes: 8

MoeSattler
MoeSattler

Reputation: 6904

this library does exactly that: case-converter It converts snake_case to camelCase and vice versa

  const caseConverter = require('case-converter')

  const snakeCase = {
    an_object: {
      nested_string: 'nested content',
      nested_array: [{ an_object: 'something' }]
    },
    an_array: [
      { zero_index: 0 },
      { one_index: 1 }
    ]
  }

  const camelCase = caseConverter.toCamelCase(snakeCase);

  console.log(camelCase)
  /*
    {
      anObject: {
        nestedString: 'nested content',
        nestedArray: [{ anObject: 'something' }]
      },
      anArray: [
        { zeroIndex: 0 },
        { oneIndex: 1 }
      ]
    }
  */

Upvotes: 0

Josh Beam
Josh Beam

Reputation: 19772

Here's your function to convert camelCase to underscored text (see the jsfiddle):

function camelToUnderscore(key) {
    return key.replace( /([A-Z])/g, "_$1").toLowerCase();
}

console.log(camelToUnderscore('helloWorldWhatsUp'));

Then you can just loop (see the other jsfiddle):

var original = {
    whatsUp: 'you',
    myName: 'is Bob'
},
    newObject = {};

function camelToUnderscore(key) {
    return key.replace( /([A-Z])/g, "_$1" ).toLowerCase();
}

for(var camel in original) {
    newObject[camelToUnderscore(camel)] = original[camel];
}

console.log(newObject);

Upvotes: 17

abc123
abc123

Reputation: 18763

jsfiddle

//This function will rename one property to another in place
Object.prototype.renameProperty = function (oldName, newName) {
     // Do nothing if the names are the same
     if (oldName == newName) {
         return this;
     }
    // Check for the old property name to avoid a ReferenceError in strict mode.
    if (this.hasOwnProperty(oldName)) {
        this[newName] = this[oldName];
        delete this[oldName];
    }
    return this;
};

//rename this to something like camelCase to snakeCase
function doStuff(object) {
    for (var property in object) {
        if (object.hasOwnProperty(property)) {
            var r = property.replace(/([A-Z])/, function(v) { return '_' + v.toLowerCase(); });
            console.log(object);
            object.renameProperty(property, r);
            console.log(object);
        }
    }
}

//example object
var camelCased = {firstName: 'Jon', lastName: 'Smith'};
doStuff(camelCased);

Note: remember to remove any and all console.logs as they aren't needed for production code

Upvotes: -1

Related Questions