[javascript] JavaScript에서 문자열의 첫 글자를 대문자로 만들려면 어떻게합니까?

문자열의 첫 글자를 대문자로 만들려면 어떻게해야합니까?

예를 들면 다음과 같습니다.

  • "this is a test" -> "This is a test"
  • "the Eiffel Tower" -> "The Eiffel Tower"
  • "/index.html" -> "/index.html"


답변

기본 솔루션은 다음과 같습니다.

function capitalizeFirstLetter(string) {
  return string.charAt(0).toUpperCase() + string.slice(1);
}

console.log(capitalizeFirstLetter('foo')); // Foo

다른 답변은 수정하지만 String.prototype(이 답변은 예전에도 사용되었지만) 유지 관리 가능성으로 인해이 문제에 대해 조언 할 것입니다 (함수가 추가되는 위치를 찾기가 어렵고 prototype다른 코드가 동일한 이름 / 브라우저를 사용하는 경우 충돌을 일으킬 수 있음) 나중에 같은 이름의 기본 함수를 추가합니다).

… 그리고 국제화를 고려할 때이 질문에 훨씬 더 많은 것이 있습니다. 이 놀라운 대답 (아래에 묻혀 있음)이 보여줍니다.

코드 단위 대신 유니 코드 코드 포인트로 작업하려는 경우 (예 : 기본 다국어 평면 외부에서 유니 코드 문자를 처리하는 경우) String#[@iterator]코드 포인트와 작동 하는 사실을 활용할 수 있으며 toLocaleUpperCase로케일이 올바른 대문자를 얻을 수 있습니다 .

function capitalizeFirstLetter([ first, ...rest ], locale = navigator.language) {
  return [ first.toLocaleUpperCase(locale), ...rest ].join('');
}

console.log(capitalizeFirstLetter('foo')); // Foo
console.log(capitalizeFirstLetter("??????")); // "??????" (correct!)
console.log(capitalizeFirstLetter("italya", 'tr')); // İtalya" (correct in Turkish Latin!)

더 많은 국제화 옵션에 대해서는 아래원래 답변을 참조하십시오 .


답변

보다 객체 지향적 인 접근 방식은 다음과 같습니다.

String.prototype.capitalize = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

다음과 같이 함수를 호출합니다.

"hello world".capitalize();

예상되는 결과는 다음과 같습니다.

"Hello world" 


답변

CSS에서 :

p:first-letter {
    text-transform:capitalize;
}


답변

다음은 문자열을 배열로 취급하여 첫 글자를 얻는 인기있는 답변의 단축 버전입니다.

function capitalize(s)
{
    return s[0].toUpperCase() + s.slice(1);
}

최신 정보:

아래 의견에 따르면 IE 7 이하에서는 작동하지 않습니다.

업데이트 2 :

undefined빈 문자열 을 피하려면 (아래 @ njzk2의 주석 참조 ) 빈 문자열을 확인할 수 있습니다.

function capitalize(s)
{
    return s && s[0].toUpperCase() + s.slice(1);
}


답변

게시 된 몇 가지 다른 방법의 성능에 관심이있는 경우 :

이 jsperf 테스트를 기반으로 가장 빠른 방법은 다음과 같습니다 (가장 빠른 순서에서 가장 느린 순서로).

보시다시피 처음 두 가지 방법은 본질적으로 성능 측면에서 비교할 수 있지만 변경 방법은 성능 측면 String.prototype에서 가장 느립니다.

// 10,889,187 operations/sec
function capitalizeFirstLetter(string) {
    return string[0].toUpperCase() + string.slice(1);
}

// 10,875,535 operations/sec
function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
}

// 4,632,536 operations/sec
function capitalizeFirstLetter(string) {
    return string.replace(/^./, string[0].toUpperCase());
}

// 1,977,828 operations/sec
String.prototype.capitalizeFirstLetter = function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
}

여기에 이미지 설명을 입력하십시오


답변

다른 경우에는 첫 글자를 대문자로하고 나머지는 소문자로 사용해야합니다. 다음과 같은 경우이 기능을 변경했습니다.

//es5
function capitalize(string) {
    return string.charAt(0).toUpperCase() + string.slice(1).toLowerCase();
}
capitalize("alfredo")  // => "Alfredo"
capitalize("Alejandro")// => "Alejandro
capitalize("ALBERTO")  // => "Alberto"
capitalize("ArMaNdO")  // => "Armando"

// es6 using destructuring 
const capitalize = ([first,...rest]) => first.toUpperCase() + rest.join('').toLowerCase();


답변

이것은 2018 ECMAScript 6+ 솔루션입니다 .

const str = 'the Eiffel Tower';
const newStr = `${str[0].toUpperCase()}${str.slice(1)}`;
console.log('Original String:', str); // the Eiffel Tower
console.log('New String:', newStr); // The Eiffel Tower