J'ai essayé d'obtenir une commande JavaScript regex pour transformer quelque chose comme thisString
en This String
, mais le plus proche que j'ai eu consiste à remplacer une lettre, ce qui aboutit à quelque chose comme Thi String
ou This tring
. Des idées?
Pour clarifier, je peux gérer la simplicité de la majuscule d'une lettre, je ne suis tout simplement pas aussi fort avec RegEx, et diviser somethingLikeThis
en something Like This
est l'endroit où j'ai des problèmes.
"thisStringIsGood"
// insert a space before all caps
.replace(/([A-Z])/g, ' $1')
// uppercase the first character
.replace(/^./, function(str){ return str.toUpperCase(); })
affiche
This String Is Good
(function() {
var $textbox = $('#textbox'),
$result = $('#result'),
splitter = function() {
$result.html($textbox.val()
// insert a space before all caps
.replace(/([A-Z])/g, ' $1')
// uppercase the first character
.replace(/^./, function(str) {
return str.toUpperCase();
}));
};
$textbox.on('input', splitter);
splitter();
}());
#result {
margin-top: 10px;
padding-top: 10px;
border-top: solid 1px #c3c3c3;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
Text to split
<input id="textbox" value="thisStringIsGood" />
</div>
<div id="result"></div>
Cela ne m'intéressait pas du tout, en particulier le traitement des séquences de majuscules, comme dans xmlHTTPRequest. Les fonctions répertoriées produiraient "Requête XML" ou "Requête HTTP HTTP", la mienne produisant "Requête HTTP XML".
function unCamelCase (str){
return str
// insert a space between lower & upper
.replace(/([a-z])([A-Z])/g, '$1 $2')
// space before last upper in a sequence followed by lower
.replace(/\b([A-Z]+)([A-Z])([a-z])/, '$1 $2$3')
// uppercase the first character
.replace(/^./, function(str){ return str.toUpperCase(); })
}
Il existe également une version String.prototype dans un Gist .
Cela peut être fait de manière concise avec un look reeadx ( démo en direct ):
function splitCamelCaseToString(s) {
return s.split(/(?=[A-Z])/).join(' ');
}
(Je pensais que le drapeau g
(global) était nécessaire, mais curieusement, ce n'est pas le cas.)
L'utilisation de lookahead avec split
garantit que la lettre majuscule correspondante n'est pas consommée et évite de traiter avec un espace non significatif si UpperCamelCase est une solution à prendre en compte. Pour capitaliser la première lettre de chacun, vous pouvez utiliser:
function splitCamelCaseToString(s) {
return s.split(/(?=[A-Z])/).map(function(p) {
return p.charAt(0).toUpperCase() + p.slice(1);
}).join(' ');
}
La méthode de tableau map
est une fonctionnalité ES5, mais vous pouvez toujours l'utiliser dans les navigateurs plus anciens avec du code provenant de MDC . Vous pouvez également parcourir les éléments du tableau à l'aide d'une boucle for
.
Je pense que cela devrait pouvoir gérer des caractères majuscules consécutifs ainsi que camelCase simple.
Par exemple: someVariable => someVariable, mais ABCCode! = A B C Code.
L'expression rationnelle ci-dessous fonctionne sur votre exemple, mais également sur l'exemple courant de représentation des abréviations dans camcelCase.
"somethingLikeThis"
.replace(/([a-z])([A-Z])/g, '$1 $2')
.replace(/([A-Z])([a-z])/g, ' $1$2')
.replace(/\ +/g, ' ') => "something Like This"
"someVariableWithABCCode"
.replace(/([a-z])([A-Z])/g, '$1 $2')
.replace(/([A-Z])([a-z])/g, ' $1$2')
.replace(/\ +/g, ' ') => "some Variable With ABC Code"
Vous pouvez également ajuster comme ci-dessus pour mettre le premier caractère en majuscule.
function spacecamel(s){
return s.replace(/([a-z])([A-Z])/g, '$1 $2');
}
spacecamel ('quelque chose comme ça')
// valeur renvoyée: quelque chose comme ça
Une solution qui gère également les chiffres:
function capSplit(str){
return str.replace
( /(^[a-z]+)|[0-9]+|[A-Z][a-z]+|[A-Z]+(?=[A-Z][a-z]|[0-9])/g
, function(match, first){
if (first) match = match[0].toUpperCase() + match.substr(1);
return match + ' ';
}
)
}
Testé ici [JSFiddle, pas de bibliothèque. Pas essayé IE]; devrait être assez stable.
Lodash s'en occupe bien avec _.startCase()
Ma version
function camelToSpace (txt) {
return txt
.replace(/([^A-Z]*)([A-Z]*)([A-Z])([^A-Z]*)/g, '$1 $2 $3$4')
.replace(/ +/g, ' ')
}
camelToSpace("camelToSpaceWithTLAStuff") //=> "camel To Space With TLA Stuff"
Si vous ne vous souciez pas des anciens navigateurs (ou si vous utilisez une solution de repli rØduirepour eux), vous pouvez scinder mŒme des chaines telles que 'xmlHTTPRequest' (mais certainement pas celles de 'XMLHTTPRequest').
function splitCamelCase(str) {
return str.split(/(?=[A-Z])/)
.reduce(function(p, c, i) {
if (c.length === 1) {
if (i === 0) {
p.Push(c);
} else {
var last = p.pop(), ending = last.slice(-1);
if (ending === ending.toLowerCase()) {
p.Push(last);
p.Push(c);
} else {
p.Push(last + c);
}
}
} else {
p.Push(c.charAt(0).toUpperCase() + c.slice(1));
}
return p;
}, [])
.join(' ');
}
Essayez cette solution ici -
var value = "myCamelCaseText";
var newStr = '';
for (var i = 0; i < value.length; i++) {
if (value.charAt(i) === value.charAt(i).toUpperCase()) {
newStr = newStr + ' ' + value.charAt(i)
} else {
(i == 0) ? (newStr += value.charAt(i).toUpperCase()) : (newStr += value.charAt(i));
}
}
return newStr;