정규식 (나는 가정) 또는 다른 방법으로 다음과 같은 것을 어떻게 변환 할 수 있습니까?
marker-image
나 my-example-setting
에게 markerImage
또는 myExampleSetting
.
나는 -
그 hypen +1의 색인을 대문자로 변환하여 나누는 것에 대해 생각하고있었습니다 . 그러나 그것은 더러워 보였고 코드를 깨끗하게 만들 수있는 정규 표현식에 대한 도움을 원했습니다.
jQuery가 없습니다 ...
정규식 (나는 가정) 또는 다른 방법으로 다음과 같은 것을 어떻게 변환 할 수 있습니까?
marker-image
나 my-example-setting
에게 markerImage
또는 myExampleSetting
.
나는 -
그 hypen +1의 색인을 대문자로 변환하여 나누는 것에 대해 생각하고있었습니다 . 그러나 그것은 더러워 보였고 코드를 깨끗하게 만들 수있는 정규 표현식에 대한 도움을 원했습니다.
jQuery가 없습니다 ...
답변:
이 시도:
var camelCased = myString.replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });
정규식은 -i
in marker-image
과 일치하고 만 캡처합니다 i
. 그런 다음 콜백 함수에서 대문자로 대체됩니다.
myString.replace(/([a-z][A-Z])/g, function (g) { return g[0] + '-' + g[1].toLowerCase() });
myString.replace(/-([a-z])/i, function (i) { return i[1].toUpperCase() });
i
플래그 를 추가하여 정규식을보다 강력하게 만드는 것이 좋습니다 . 그렇지 않으면 패턴에 "자본 부분"이 누락됩니다 ( "자본 부분"으로 변경되지 않음). 또한 개인적으로 여러 매개 변수의 향상된 가독성을 선호하지만 이는 분명히 스타일의 문제입니다. 대체로, 나는 갈 것이다 .replace( /-([a-z])/gi, function ( $0, $1 ) { return $1.toUpperCase(); } );
.
var camelCased = myString.replace(/(-+|\s+)\w/g, function (g) { return g[1].toUpperCase(); });
var camelCased = myString.replace(/(-+|\s+)\w/g, function (g) { return g[g.length - 1].toUpperCase(); });
어때?
하이픈과 다음 문자를 가져 와서 대문자의 문자 버전으로 바꿀 수 있습니다.
var str="marker-image-test";
str.replace(/-([a-z])/g, function (m, w) {
return w.toUpperCase();
});
내 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);
};
})();
다음과 같은 경우를 모두 처리합니다.
라이브 테스트 링크는 다음과 같습니다. http://jsfiddle.net/avKzf/2/
테스트 결과는 다음과 같습니다.
구분 기호로 시작하는 문자열은 처음에 대문자로 나타납니다. 이것이 예상과 다르면 언제든지 lcfirst를 사용할 수 있습니다. 필요한 경우 내 lcfirst가 있습니다.
function lcfirst(str) {
return str && str.charAt(0).toLowerCase() + str.substring(1);
}
이것은 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
여기에 몇 가지 답변을 결합하고 문자열에서 메소드를 만드는 또 다른 옵션이 있습니다.
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
또 다른 테이크.
때 사용 ...
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
해당 작업에 대한 재귀와 함께 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');
for 루프와 정규 표현식이없는 플래그가있는 버전 :
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;
}
문자열에 숫자 를 허용 하면 이것을 사용하십시오 .
숫자로 시작하는 부분은 대문자로 표시되지 않지만 일부 상황에서는 유용 할 수 있습니다.
function fromHyphenToCamelCase(str) {
return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}
function fromHyphenToCamelCase(str) {
return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}
const str1 = "category-123";
const str2 = "111-222";
const str3 = "a1a-b2b";
const str4 = "aaa-2bb";
console.log(`${str1} => ${fromHyphenToCamelCase(str1)}`);
console.log(`${str2} => ${fromHyphenToCamelCase(str2)}`);
console.log(`${str3} => ${fromHyphenToCamelCase(str3)}`);
console.log(`${str4} => ${fromHyphenToCamelCase(str4)}`);