Insert space before capital letters

JavascriptJqueryRegexStringReplace

Javascript Problem Overview


I have a string "MySites". I want to place a space between My and Sites.

How can I do this in jQuery or JavaScript?

Javascript Solutions


Solution 1 - Javascript

You can just add a space before every uppercase character and trim off the leading and trailing spaces

s = s.replace(/([A-Z])/g, ' $1').trim()

Solution 2 - Javascript

This will find each occurrence of a lower case character followed by an upper case character, and insert a space between them:

s = s.replace(/([a-z])([A-Z])/g, '$1 $2');

For special cases when 2 consecutive capital letters occur (Eg: ThisIsATest) add additional code below:

 s = s.replace(/([A-Z])([A-Z])/g, '$1 $2');

Solution 3 - Javascript

Might I suggest a slight edit to the currently accepted answer:

function insertSpaces(string) {
    string = string.replace(/([a-z])([A-Z])/g, '$1 $2');
    string = string.replace(/([A-Z])([A-Z][a-z])/g, '$1 $2')
    return string;
}

This means that:

ACROText -> ACRO Text
UserNameTest -> User Name Test

Which might be slightly more useful if you are dealing with db column names (And are using acronyms for some things)

Solution 4 - Javascript

Here is what i ended up using to convert a string to a title case, based on a few of the answers here:

str = str
  .replace(/(_|-)/g, ' ')
  .trim()
  .replace(/\w\S*/g, function(str) {
    return str.charAt(0).toUpperCase() + str.substr(1)
  })   
  .replace(/([a-z])([A-Z])/g, '$1 $2')
  .replace(/([A-Z])([A-Z][a-z])/g, '$1 $2')   

Here is a JSFiddle where you can test your string to see if this meets your needs: https://jsfiddle.net/thomastasa/5236dv8t/85/


Examples:

  • "yourStringHere" -> "Your String Here"
  • "AnotherStringHere" -> "Another String Here"
  • "someones_string" -> "Someones String"
  • "Another-String-Here" -> "Another String Here"
  • "myAWESOMEString" -> "My AWESOME String"

Solution 5 - Javascript

This should insert a space between each capital letter that was not preceded by a capital letter.

var myString = "MySites"
var newString = "";
var wasUpper = false;
for (var i = 0; i < myString.length; i++)
{
    if (!wasUpper && myString[i] == myString.toUpperCase()[i])
    {
        newString = newString + " ";
        wasUpper = true;
    }
    else
    {
        wasUpper = false;
    }
    newString = newString + myString[i];
}

newString will have the value you want. Also, if you want to shorten your code using regex, you can use the following code from <https://stackoverflow.com/questions/4149276/javascript-camelcase-to-regular-form>

"thisStringIsGood"
    // insert a space before all caps
    .replace(/([A-Z])/g, ' $1')
    // uppercase the first character
    .replace(/^./, function(str){ return str.toUpperCase(); })

Solution 6 - Javascript

regex to find lower case - upper case boundary then insert a space

<div id='x'>ThisIsMySites</div>
$('#x').text( $('#x').text().replace(/([a-z])([A-Z])/g, "$1 $2") );

http://jsfiddle.net/uXy64/

Solution 7 - Javascript

In a single regex replace (without trims or joins) that allows any character not just letters [a-z] or [A-Z].

const str = "MySites";
str.replace(/(?<!^)([A-Z])/, " $1"); // -> "My Sites"

You can check more about the look behind (?<!^) here.

Solution 8 - Javascript

This is another possibility, way much compact

export function replaceCamelSpaces(colorName){
   return colorName.replace(/\B([A-Z])\B/g, ' $1');
}

Explained :

\B uppercase word boundary to find, for more read this

([A-Z]) finding zero, one or more occurence of Upper letters

\B as before but at the end of the search

/g match all occurences of previous matches

replace with

' $1'

Replace with some letter(lowacase) and a space at beginning

Solution 9 - Javascript

You can use String#split() and a look-ahead for the capitalized alphabet ([A-Z]) and then Array#join() the array with a space:

let stringCamelCase = "MySites";

let string = stringCamelCase.split(/(?=[A-Z])/).join(" ");

console.log(string)

Or, as a String Object function:

String.prototype.cC2SC = function() {
  return this.split(/(?=[A-Z])/).join(" ");
}

console.log("MyCamelCase".cC2SC());

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionCLiownView Question on Stackoverflow
Solution 1 - Javascriptuser2051552View Answer on Stackoverflow
Solution 2 - JavascriptGuffaView Answer on Stackoverflow
Solution 3 - JavascriptJosephGarroneView Answer on Stackoverflow
Solution 4 - JavascriptThomas SteinView Answer on Stackoverflow
Solution 5 - JavascriptDevin BurkeView Answer on Stackoverflow
Solution 6 - JavascriptAdam StraughanView Answer on Stackoverflow
Solution 7 - JavascriptJose Da SilvaView Answer on Stackoverflow
Solution 8 - JavascriptCarmine TambasciaView Answer on Stackoverflow
Solution 9 - JavascriptLuca KiebelView Answer on Stackoverflow