JavaScript Challenge 6: 문자열을 카멜 케이스로 변환

This article was originally posted on my blog. Head over to inspiredwebdev.com for more articles and tutorials. Check out my JavaScript course on Educative to learn everything from ES6 to ES2020.

이 기사에서는 CodeWars의 문자열을 카멜 케이스로 변환 문제를 함께 해결할 것입니다. 여기link에서 찾을 수 있습니다. 이번 챌린지의 난이도는 쉽습니다.

함께 작업을 읽어 봅시다.

Complete the method/function so that it converts dash/underscore delimited words into camel casing. The first word within the output should be capitalized only if the original word was capitalized (known as Upper Camel Case, also often referred to as Pascal case).

Examples
toCamelCase("the-stealth-warrior") // returns >"theStealthWarrior"

toCamelCase("The_Stealth_Warrior") // returns "TheStealthWarrior"

이 문제를 해결하는 가장 쉬운 방법은 RegEx를 사용하는 것이며 이 경우 복잡한 문제도 필요하지 않습니다.

RegExp 작성

/[-_]\w/ig 이것이 우리가 필요한 전부입니다.

[-_]는 모든 밑줄 및 대시와 일치합니다

.

\w는 대시 또는 밑줄 바로 뒤의 모든 문자와 일치합니다

.

/ig는 대소문자를 구분하지 않는 전역 검색을 수행합니다.

챌린지를 더 쉽게 완료하는 데 도움이 되는 트릭은 \w로 대시 또는 밑줄 바로 뒤에 있는 문자를 캡처할 수 있습니다. 즉, 한 번에 쉽게 대문자로 만들 수 있습니다.

RegEx를 가지고 놀고 싶을 때 작동 방식도 설명하는 훌륭한 놀이터입니다regexr.com.

이제 함수의 가장 중요한 부분이 있으므로 이를 중심으로 함수를 빌드해 보겠습니다.

function toCamelCase(str){
      const regExp = /[-_]\w/ig;
      return str.replace(regExp,(match) => {
          console.log(match);
       });
}
toCamelCase("the-stealth-warrior")
// -s
// -w

String.replace()는 하위 문자열뿐만 아니라 RegExp만 첫 번째 매개변수로 사용할 수 있으며 결과를 두 번째 매개변수로 전달합니다.

보시다시피 RexExp는 각 대시와 뒤의 첫 번째 문자를 일치시킵니다.

기능 완성

이제 함수로 할 일은 대시나 밑줄 없이 대문자만 반환하는 것입니다.

function toCamelCase(str){
      const regExp = /[-_]\w/ig;
      return str.replace(regExp,(match) => {
          return match[1].toUppercase()
       });
}
toCamelCase("the-stealth-warrior")

그게 다야, 우리가 추가한 마지막 줄은 -s 대신 S를 반환하고 -w 대신 W를 반환합니다.

이 문제를 해결하는 다른 많은 방법이 있습니다. 의견에 귀하의 방법을 알려주십시오.

이러한 유형의 콘텐츠가 마음에 드셨다면 댓글로 알려주시면 더 많은 콘텐츠를 만들겠습니다.

ES6에서 ES2020까지 JavaScript에 대한 모든 것을 배우고 싶다면 Github에서 무료로 읽을 수 있는 제 책을 확인하세요. 과정도 진행 중입니다 Educative.