Avec regex (je suppose) ou une autre méthode, comment puis-je convertir des choses comme:
marker-image
ou my-example-setting
à markerImage
ou myExampleSetting
.
Je pensais simplement diviser par -
puis convertir l'index de cet hypen +1 en majuscules. Mais il semble assez sale et espère une aide avec Regex qui pourrait rendre le code plus propre.
Non jQuery …
Essaye ça:
var camelCased = myString.replace(/-([az])/g, function (g) { return g[1].toUpperCase(); });
L'expression régulière correspondra à -i
dans l' marker-image
et ne capture que le i
. Ceci est ensuite mis en majuscules dans la fonction de rappel et remplacé.
C'est l'un des grands utilitaires que Lodash propose si vous êtes éclairé et que vous l' incluiez dans votre projet.
var str = 'my-hyphen-string'; str = _.camelCase(str); // results in 'myHyphenString'
Vous pouvez obtenir l'hypen et le prochain personnage et le remplacer par la version en majuscule du personnage:
var str="marker-image-test"; str.replace(/-([az])/g, function (m, w) { return w.toUpperCase(); });
Voici ma version de la fonction camelCase:
var camelCase = (function () { var DEFAULT_REGEX = /[-_]+(.)?/g; function toUpper(match, group1) { return group1 ? group1.toUpperCase() : ''; } return function (str, delimiters) { return str.replace(delimiters ? new RegExp('[' + delimiters + ']+(.)?', 'g') : DEFAULT_REGEX, toUpper); }; })();
Il gère tous les cas de bord suivants:
Voici un lien vers les tests en direct: http://jsfiddle.net/avKzf/2/
Voici les résultats des tests:
Notez que les chaînes qui commencent par des délimiteurs se traduiront par une lettre majuscule au début. Si ce n'est pas ce que vous attendez, vous pouvez toujours utiliser lcfirst. Voici mon premier, si vous en avez besoin:
function lcfirst(str) { return str && str.charAt(0).toLowerCase() + str.substring(1); }
Voici une autre option qui combine quelques réponses ici et la met sur une chaîne:
if (typeof String.prototype.toCamel !== 'function') { String.prototype.toCamel = function(){ return this.replace(/[-_]([az])/g, function (g) { return g[1].toUpperCase(); }) }; }
Utilisé comme ceci:
'quick_brown'.toCamel(); // quickBrown 'quick-brown'.toCamel(); // quickBrown
# Turn the dash separated variable name into camelCase. str = str.replace(/\b-([az])/g, function(all, char) { return char.toUpperCase() });
Une autre prise.
Utilisé quand …
var string = "hyphen-delimited-to-camel-case" or var string = "snake_case_to_camel_case" function toCamelCase( string ){ return string.toLowerCase().replace(/(_|-)([az])/g, toUpperCase ); } function toUpperCase( string ){ return string[1].toUpperCase(); } Output: hyphenDelimitedToCamelCase
Est également possible d'utiliser indexOf avec récursion pour cette tâche.
input some-foo_sd_dsd-weqe output someFooSdDsdWeqe
Comparaison ::: mesure le temps d'exécution pour deux scripts différents:
$ node camelCased.js someFooSdDsdWeqe test1: 2.986ms someFooSdDsdWeqe test2: 0.231ms
code:
console.time('test1'); function camelCased (str) { function check(symb){ let idxOf = str.indexOf(symb); if (idxOf === -1) { return str; } let letter = str[idxOf+1].toUpperCase(); str = str.replace(str.substring(idxOf+1,idxOf+2), ''); str = str.split(symb).join(idxOf !== -1 ? letter : ''); return camelCased(str); } return check('_') && check('-'); } console.log(camelCased ('some-foo_sd_dsd-weqe')); console.timeEnd('test1'); console.time('test2'); function camelCased (myString){ return myString.replace(/(-|\_)([az])/g, function (g) { return g[1].toUpperCase(); }); } console.log(camelCased ('some-foo_sd_dsd-weqe')); console.timeEnd('test2');
Cela ne me crie pas pour un RegExp
. Personnellement, j'essaie d'éviter les expressions régulières lorsque des méthodes de chaîne et de matrice simples suffiront:
let upFirst = word => word[0].toUpperCase() + word.toLowerCase().slice(1) let camelize = text => { let words = text.split(/[-_]/g) // ok one simple regexp. return words[0].toLowerCase() + words.slice(1).map(upFirst) } camelize('marker-image') // markerImage