Vraag Hoe maak ik de eerste letter van een string in hoofdletters in JavaScript?


Hoe maak ik de eerste letter van een string in hoofdletters, maar verander ik het geval van een van de andere letters niet?

Bijvoorbeeld:

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

2960
2018-06-22 08:25


oorsprong


antwoorden:


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

Sommige andere antwoorden wijzigen String.prototype (dit antwoord was vroeger ook), maar ik zou dit nu afraden vanwege onderhoudbaarheid (moeilijk om erachter te komen waar de functie wordt toegevoegd aan de prototype en kan conflicten veroorzaken als andere code dezelfde naam gebruikt / een browser voegt in de toekomst een native-functie met diezelfde naam toe).


4721
2018-06-22 08:30



Een meer objectgerichte benadering:

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

En dan:

"hello world".capitalize();  =>  "Hello world" 

1194
2017-07-20 15:51



In CSS:

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

408
2017-07-17 14:06



Hier is een verkorte versie van het populaire antwoord dat de eerste letter krijgt door de string als array te behandelen:

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

Bijwerken:

Volgens de opmerkingen hieronder werkt dit niet in IE 7 of lager.

Update 2:

Vermijden undefined voor lege reeksen (zie @ njzk2's reactie hieronder), kunt u controleren op een lege tekenreeks:

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

235
2017-08-28 23:03



Als je geïnteresseerd bent in de prestaties van een paar verschillende geposte methoden:

Dit zijn de snelste methoden op basis van deze jsperf-test (besteld van snelste tot langzaamste).

Zoals u kunt zien, zijn de eerste twee methoden in wezen vergelijkbaar in termen van prestaties, terwijl het veranderen van de String.prototype is verreweg de langzaamste qua prestaties.

// 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);
}

enter image description here


134
2017-11-14 03:26



Voor een ander geval heb ik het nodig om de eerste letter te kapitaliseren en de rest in kleine letters. In de volgende gevallen heb ik deze functie gewijzigd:

//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();

128
2017-07-19 18:17



Dit zijn de beste oplossingen:

Eerste oplossing In CSS:

p {
  text-transform: capitalize;
}

Tweede oplossing :

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

Je zou het ook kunnen toevoegen aan de String.prototype dus je zou het met andere methoden kunnen ketenen:

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

en gebruik het als volgt:

'string'.capitalizeFirstLetter() // String

Derde oplossing:

function ucFirstAllWords( str )
{
    var pieces = str.split(" ");
    for ( var i = 0; i < pieces.length; i++ )
    {
        var j = pieces[i].charAt(0).toUpperCase();
        pieces[i] = j + pieces[i].substr(1).toLowerCase();
    }
    return pieces.join(" ");
}

106
2018-02-16 05:30



var string = "hello world";
string = string.charAt(0).toUpperCase() + string.slice(1);
alert(string);

62
2017-07-17 06:23



Hoofdletter van de eerste letter van alle woorden in een string:

function ucFirstAllWords( str )
{
    var pieces = str.split(" ");
    for ( var i = 0; i < pieces.length; i++ )
    {
        var j = pieces[i].charAt(0).toUpperCase();
        pieces[i] = j + pieces[i].substr(1);
    }
    return pieces.join(" ");
}

58
2017-11-30 17:16



We zouden het eerste personage kunnen krijgen met een van mijn favorieten RegExp, ziet eruit als een schattige smiley: /^./

String.prototype.capitalize = function () {
  return this.replace(/^./, function (match) {
    return match.toUpperCase();
  });
};

En voor alle koffie-junkies:

String::capitalize = ->
  @replace /^./, (match) ->
    match.toUpperCase()

... en voor alle jongens die denken dat er een betere manier is om dit te doen, zonder native prototypes uit te breiden:

var capitalize = function (input) {
  return input.replace(/^./, function (match) {
    return match.toUpperCase();
  });
};

44
2018-02-15 06:55



String.prototype.capitalize = function(allWords) {
   return (allWords) ? // if all words
      this.split(' ').map(word => word.capitalize()).join(' ') : //break down phrase to words then  recursive calls until capitalizing all words
      this.charAt(0).toUpperCase() + this.slice(1); // if allWords is undefined , capitalize only the first word , mean the first char of the whole string
}

En dan:

 "capitalize just the first word".capitalize(); ==> "Capitalize just the first word"
 "capitalize all words".capitalize(true); ==> "Capitalize All Words"

Update nov.2016 (ES6), alleen voor FUN:

const capitalize = (string = '') => [...string].map(    //convert to array with each item is a char of string by using spread operator (...)
    (char, index) => index ? char : char.toUpperCase()  // index true means not equal 0 , so (!index) is the first char which is capitalized by `toUpperCase()` method
 ).join('')                                             //return back to string

dan capitalize("hello") // Hello


44
2017-11-29 20:01