How can I convert a string from underscore or dashed format to camelCase or UpperCamelCase in Javascript?

Question

How can I take a string that is in dashed notation :

something-like-this

or underscore notation :

something_like_this

and convert it to camelCase :

somethingLikeThis

or UpperCamelCase :

SomethingLikeThis

?

Edited to add @torazaburo accuses this of being a duplicate of Converting any string into camel case however, that question does not address either of the inputs, dashed or underscore, in question here. @torazaburo, please revoke your false accusation.

score 4 · Answer 1 · answered Sep 04 '15 at 07:11

For those who'd rather not mess with natives :

toCamelCase = function(string){
    return string.replace(/[_\-]([^_\-])/g, function($0,$1){return $1.toUpperCase();});
}
toUpperCamelCase = function(string){
    return string.charAt(0).toUpperCase() + toCamelCase(string.substring(1));
}

Or for those comfortable extending natives:

if (!String.prototype.toCamelCase)String.prototype.toCamelCase = function(){
    return this.replace(/[_\-]([^_\-])/g, function($0,$1){return $1.toUpperCase();});
};
if (!String.prototype.toUpperCamelCase)String.prototype.toUpperCamelCase = function(){
    return this.charAt(0).toUpperCase() + this.substring(1).toCamelCase();
};

Fiddle: http://jsfiddle.net/trex005/akj0hx7b/

score 1 · Answer 2 · answered Sep 04 '15 at 07:50

trex005's answer is good enough, but mine takes input in dashed, underscore, camelCase OR UpperCamelCase. Not sure you've converted a string yet? Convert it again! No worries!

For those who'd rather not mess with natives:

toCamelCase = function(string){
    string = string.replace(/[_\-A-Z]([^_\-A-Z])/g, function($0,$1){return $0.charAt(0).match(/[A-Z]/)?$0:$1.toUpperCase();});
    return string.charAt(0).toLowerCase() + string.substring(1);
}
toUpperCamelCase = function(string){
    string = toCamelCase(string);
    return string.charAt(0).toUpperCase() + string.substring(1);
}

Or for those comfortable extending natives

if (!String.prototype.toCamelCase)String.prototype.toCamelCase = function(){
    string = this.replace(/[_\-A-Z]([^_\-A-Z])/g, function($0,$1){return $0.charAt(0).match(/[A-Z]/)?$0:$1.toUpperCase();});
    return string.charAt(0).toLowerCase() + string.substring(1);
}
if (!String.prototype.toUpperCamelCase)String.prototype.toUpperCamelCase = function(){
    string = toCamelCase(this);
    return string.charAt(0).toUpperCase() + string.substring(1);
}

Fiddle: http://jsfiddle.net/trex005/akj0hx7b/1/

score 1 · Answer 3 · edited May 23 '17 at 10:26

trex005's answer was good, and trex005's addition to it was even more handy, but if you're going to go that far, why not go all the way and allow you to convert back and forth between dashed, underscore, camelCase AND UpperCamelCase as needed?

For those who'd rather not mess with natives:

formatParts = function(string){
    var parts = [];
    string.replace(/([_\-A-Z]|^[^_\-A-Z])([^_\-A-Z]*)/g,function($0,$1,$2){
        var part = $1.match(/[_\-]/)?$2:$1+$2;
        parts.push(part.toLowerCase());
    });
    return parts;
}
toCamelCase = function(string){
    var output = '';
    formatParts(string).forEach(function(part,index){
        output += index?part.charAt(0).toUpperCase() + part.substring(1):part;
    });
    return output;
}
toUpperCamelCase = function(string){
    var output = '';
    formatParts(string).forEach(function(part,index){
        output += part.charAt(0).toUpperCase() + part.substring(1);
    });
    return output;
}
toDashed = function(string){
    return formatParts(string).join('-');
}
toUnderscored = function(string){
    return formatParts(string).join('_');
}

Or for those comfortable extending natives:

if (!String.prototype.formatParts)String.prototype.formatParts = function(){
    var parts = [];
    this.replace(/([_\-A-Z]|^[^_\-A-Z])([^_\-A-Z]*)/g,function($0,$1,$2){
        var part = $1.match(/[_\-]/)?$2:$1+$2;
        parts.push(part.toLowerCase());
    });
    return parts;
}
if (!String.prototype.toCamelCase)String.prototype.toCamelCase = function(){
    var output = '';
    this.formatParts().forEach(function(part,index){
        output += index?part.charAt(0).toUpperCase() + part.substring(1):part;
    });
    return output;
}
if (!String.prototype.toUpperCamelCase)String.prototype.toUpperCamelCase = function(){
    var output = '';
    this.formatParts().forEach(function(part,index){
        output += part.charAt(0).toUpperCase() + part.substring(1);
    });
    return output;
}
if (!String.prototype.toDashed)String.prototype.toDashed = function(){
    return this.formatParts().join('-');
}
if (!String.prototype.toUnderscored)String.prototype.toUnderscored = function(){
    return this.formatParts().join('_');
}

Fiddle: http://jsfiddle.net/trex005/akj0hx7b/3/

How can I convert a string from underscore or dashed format to camelCase or UpperCamelCase in Javascript?

3 Answers3