Преобразование дефисов в верблюжьей кейсе (camelCase)
С помощью регулярного выражения (предположим) или другого метода, как я могу преобразовать такие вещи, как:
marker-image
или my-example-setting
до markerImage
или myExampleSetting
.
Я думал о простое разбиение на -
, а затем преобразовал индекс этого hypen +1 в верхний регистр. Но он выглядит довольно грязным и надеется на некоторую помощь с регулярным выражением, которое могло бы сделать код более чистым.
Нет jQuery...
Ответы
Ответ 1
Попробуйте следующее:
var camelCased = myString.replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });
Регулярное выражение будет соответствовать -i
в marker-image
и отображать только i
. Затем это происходит в верхней части функции обратного вызова и заменяется.
Ответ 2
Это одна из великих утилит, которую Lodash предлагает, если вы просвещены и включили ее в свой проект.
var str = 'my-hyphen-string';
str = _.camelCase(str);
// results in 'myHyphenString'
Ответ 3
Вы можете получить hypen и следующий символ и заменить его на верхнюю версию символа:
var str="marker-image-test";
str.replace(/-([a-z])/g, function (m, w) {
return w.toUpperCase();
});
Ответ 4
Здесь моя версия функции 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);
};
})();
Он обрабатывает все следующие случаи ребер:
- по умолчанию выполняет как подчеркивания, так и дефис (настраивается со вторым параметром)
- строка с символами Unicode
- строка, заканчивающаяся дефисом или подчеркиванием
- строка с последовательными дефисами или символами подчеркивания
Здесь ссылка на живые тесты: http://jsfiddle.net/avKzf/2/
Вот результаты тестов:
- input: "ab-cd-ef", результат: "abCdEf"
- input: "ab-cd-ef-", result: "abCdEf"
- input: "ab-cd-ef--", result: "abCdEf"
- input: "ab-cd - ef--", result: "abCdEf"
- input: "--ab-cd - ef--", result: "AbCdEf"
- input: "-ab-cd -__- ef--", result: "AbCdEf"
Обратите внимание, что строки, начинающиеся с разделителей, приведут к заглавной букве в начале.
Если это не то, что вы ожидаете, вы всегда можете использовать lcfirst.
Здесь мой lcfirst, если вам это нужно:
function lcfirst(str) {
return str && str.charAt(0).toLowerCase() + str.substring(1);
}
Ответ 5
Это не кричит для RegExp
для меня. Лично я стараюсь избегать регулярных выражений, когда достаточно простого метода строк и массивов:
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
Ответ 6
Вот еще один вариант, который сочетает здесь пару ответов и делает его методом для строки:
if (typeof String.prototype.toCamel !== 'function') {
String.prototype.toCamel = function(){
return this.replace(/[-_]([a-z])/g, function (g) { return g[1].toUpperCase(); })
};
}
Используется следующим образом:
'quick_brown'.toCamel(); // quickBrown
'quick-brown'.toCamel(); // quickBrown
Ответ 7
// Turn the dash separated variable name into camelCase.
str = str.replace(/\b-([a-z])/g, (_, char) => char.toUpperCase());
Ответ 8
Другое дело.
Используется, когда...
var string = "hyphen-delimited-to-camel-case"
or
var string = "snake_case_to_camel_case"
function toCamelCase( string ){
return string.toLowerCase().replace(/(_|-)([a-z])/g, toUpperCase );
}
function toUpperCase( string ){
return string[1].toUpperCase();
}
Output: hyphenDelimitedToCamelCase
Ответ 9
также можно использовать indexOf с рекурсией для этой задачи.
input some-foo_sd_dsd-weqe
output someFooSdDsdWeqe
сравнение: измерение времени выполнения для двух разных скриптов:
$ node camelCased.js
someFooSdDsdWeqe
test1: 2.986ms
someFooSdDsdWeqe
test2: 0.231ms
код:
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(/(-|\_)([a-z])/g, function (g) { return g[1].toUpperCase(); });
}
console.log(camelCased ('some-foo_sd_dsd-weqe'));
console.timeEnd('test2');
Ответ 10
Просто версия с флагом, для цикла и без Regex:
function camelCase(dash) {
var camel = false;
var str = dash;
var camelString = '';
for(var i = 0; i < str.length; i++){
if(str.charAt(i) === '-'){
camel = true;
} else if(camel) {
camelString += str.charAt(i).toUpperCase();
camel = false;
} else {
camelString += str.charAt(i);
}
}
return camelString;
}
Ответ 11
Вот моя реализация (просто чтобы испачкать руки)
/**
* kebab-case to UpperCamelCase
* @param {String} string
* @return {String}
*/
function toUpperCamelCase(string) {
return string
.toLowerCase()
.split('-')
.map(it => it.charAt(0).toUpperCase() + it.substr(1))
.join('');
}