Hur gör jag den första bokstaven i en sträng versal i JavaScript?

Hur gör jag så att den första bokstaven i en sträng blir versal om det är en bokstav, men utan att ändra skiftläget på de andra bokstäverna?

Till exempel:

"detta är ett test" → "Detta är ett test"
"Eiffeltornet" → "Eiffeltornet"
"/index.html" → "/index.html"

Svar #1

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

Vissa andra svar modifierar String.prototype (detta svar gjorde det tidigare också), men jag skulle nu avråda från detta på grund av underhållbarhet (det är svårt att ta reda på var funktionen läggs till i prototype och det kan orsaka konflikter om annan kod använder samma namn/en webbläsare lägger till en inbyggd funktion med samma namn i framtiden).

Svar #2

Redigerad för att lägga till denna FRISKRIVNING: vänligen läs kommentarerna för att förstå riskerna med att redigera JS grundläggande typer.

Här är ett mer objektorienterat tillvägagångssätt:

Object.defineProperty(String.prototype, 'capitalize', {
  value: function() {
    return this.charAt(0).toUpperCase() + this.slice(1);
  },
  enumerable: false
});

Du skulle kalla funktionen, så här:

"hello, world!".capitalize();

Med det förväntade resultatet vara:

"Hello, world!"

Svar #3

Använda bara CSS och dess text-transform-egenskap:

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

Svar #4

Här är en förkortad version av det populära svaret som får den första bokstaven genom att behandla strängen som en array:

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

Uppdatera

Enligt kommentarerna nedan fungerar detta inte i IE 7 eller tidigare.

Uppdatering 2:

För att undvika undefined för tomma strängar (se @njzk2:s kommentar nedan), kan du kontrollera om det är en tom sträng:

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

ES6-version

const capitalize = s => s && String(s[0]).toUpperCase() + String(s).slice(1)

// to always return type string event when s may be falsy other than empty-string
const capitalize = s => (s && String(s[0]).toUpperCase() + String(s).slice(1)) || ""

Svar #5

Jag såg ingen hänvisning i de befintliga svaren till problem relaterade till ~~astrala plan-kodpunkter eller~~ internationalisering. "Versaler" betyder inte samma sak på alla språk som använder ett givet skriftsystem.

Initialt såg jag inga svar som tog upp problem relaterade till astralplanetens kodpunkter. Det finns ett, men det är lite gömt (som detta kommer att vara, antar jag!)

Översikt över det dolda problemet och olika tillvägagångssätt för det

De flesta av de föreslagna funktionerna ser ut så här:

function capitalizeFirstLetter(str) {
  return str[0].toUpperCase() + str.slice(1);
}

Men vissa tecken med skiftläge ligger utanför BMP (basic multilingual plane, kodpunkter U+0 till U+FFFF). Ta till exempel denna Deseret-text:

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉"); // "𐐶𐐲𐑌𐐼𐐲𐑉"

Det första tecknet här misslyckas med att bli versal eftersom arrayer-indexerade egenskaper hos strängar inte får tillgång till "tecken" eller kodpunkter*. De får tillgång till UTF-16-kod-enheter. Detta gäller även vid skivning — indexvärdena pekar på kod-enheter.

Det råkar vara så att UTF-16-kodenheter är 1:1 med USV (Unicode-skalarvärde) kodpunkter inom två intervall, U+0 till U+D7FF och U+E000 till U+FFFF inklusive. De flesta versala tecken faller inom dessa två intervall, men inte alla.

Från och med ES2015 blev det lite lättare att hantera detta. String.prototype[@@iterator] ger strängar som motsvarar kodpunkter**. Så till exempel kan vi göra så här:

function capitalizeFirstLetter([ first='', ...rest ]) {
  return [ first.toUpperCase(), ...rest ].join('');
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

För längre strängar är detta förmodligen inte särskilt effektivt*** — vi behöver egentligen inte iterera över resten. Vi skulle kunna använda String.prototype.codePointAt för att komma åt den första (möjliga) bokstaven, men vi skulle fortfarande behöva bestämma var snittet ska börja. Ett sätt att undvika att iterera över resten skulle vara att testa om den första kodpunkten är utanför BMP; om den inte är det börjar snittet vid 1, och om den är det börjar snittet vid 2.

function capitalizeFirstLetter(str) {
  if (!str) return '';

  const firstCodePoint = str.codePointAt(0);
  const index = firstCodePoint > 0xFFFF ? 2 : 1;

  return String.fromCodePoint(firstCodePoint).toUpperCase() + str.slice(index);
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

Du skulle kunna använda bitvis matematik istället för > 0xFFFF där, men det är förmodligen lättare att förstå på det här sättet och båda skulle uppnå samma sak.

Vi kan också få detta att fungera i ES5 och lägre genom att ta logiken ett steg längre om det behövs. Det finns inga inbyggda metoder i ES5 för att arbeta med kodpunkter, så vi måste manuellt testa om den första kodenheten är en surrogat****:

function capitalizeFirstLetter(str) {
  if (!str) return '';

  var firstCodeUnit = str[0];

  if (firstCodeUnit < '\uD800' || firstCodeUnit > '\uDFFF') {
    return str[0].toUpperCase() + str.slice(1);
  }

  return str.slice(0, 2).toUpperCase() + str.slice(2);
}

capitalizeFirstLetter("𐐶𐐲𐑌𐐼𐐲𐑉") // "𐐎𐐲𐑌𐐼𐐲𐑉"

Djupare in i internationalisering (vilkens versalisering?)

I början nämnde jag också internationaliseringsaspekter. Vissa av dessa är mycket svåra att ta hänsyn till eftersom de kräver kunskap inte bara om vilket språk som används, utan också kan kräva specifika kunskaper om orden i språket. Till exempel är den irländska digrafen "mb" versal som "mB" i början av ett ord. Ett annat exempel är den tyska eszett, som aldrig börjar ett ord (såvitt jag vet), men som ändå hjälper till att illustrera problemet. Små bokstäver eszett ("ß") är versaler till "SS", men "SS" kan skrivas med gemener till antingen "ß" eller "ss" - du behöver kunskap utanför detta sammanhang om det tyska språket för att veta vilket som är korrekt!

Det mest kända exemplet på denna typ av problem är förmodligen turkiska. På turkiska i det latinska alfabetet är versalformen av i İ, medan den gemena formen av I är ı — de är två olika bokstäver. Lyckligtvis har vi ett sätt att redogöra för detta:

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

capitalizeFirstLetter("italy", "en") // "Italy"
capitalizeFirstLetter("italya", "tr") // "İtalya"

I en webbläsare indikeras användarens mest föredragna språktagg med navigator.language, en lista i ordning av preferens finns på navigator.languages, och ett givet DOM-elements språk kan (vanligtvis) erhållas med Object(element.closest('[lang]')).lang || DITT_STANDARD_HÄR i flerspråkiga dokument.

I agenter som stöder Unicode-egenskapsklass för tecken i RegExp, vilka introducerades i ES2018, kan vi städa upp saker ytterligare genom att direkt uttrycka vilka tecken vi är intresserade av:

function capitalizeFirstLetter(str, locale=navigator.language) {
  return str.replace(/^\p{CWU}/u, char => char.toLocaleUpperCase(locale));
}

Detta skulle kunna justeras lite för att också hantera att kapitalisera flera ord i en sträng med ganska god noggrannhet för åtminstone några språk, även om ytterlighetsfall kommer vara svåra att helt undvika om man gör det oavsett vilket huvudspråket är.

Egenskapen \p{CWU} eller Changes_When_Uppercased matchar alla kodpunkter som ändras när de görs versala i det generiska fallet där specifik lokal data saknas. Det finns andra intressanta Unicode-tecknegenskaper relaterade till versaler och gemener som du kanske vill leka med. Det är en cool zon att utforska, men vi skulle hålla på hela dagen om vi listade dem alla här. Här är dock något för att väcka din nyfikenhet om du inte är bekant: \p{Lower} är en större grupp än \p{LowercaseLetter} (även känd som \p{Ll}) — praktiskt illustrerat av jämförelsen av standardteckenuppsättningen i detta verktyg som tillhandahålls av Unicode. (NB: inte allt du kan referera där är också tillgängligt i ES-reguljära uttryck, men det mesta av det du sannolikt vill ha är det).

Alternativ till case-mapping i JS (Firefox och CSS älskar holländarna!)

Om digrafer med unika regler för lokala/språkliga/ortografiska versaler råkar ha en enkel kodpunkts "sammansatt" representation i Unicode, kan dessa användas för att göra ens förväntningar på versaler explicit även i frånvaro av lokaldata. Till exempel kan vi föredra den sammansatta i-j-digrafen, ĳ/U+133, som är associerad med holländska, för att säkerställa en mappning med versaler till Ĳ/U+132:

capitalizeFirstLetter('ĳsselmeer'); // "Ĳsselmeer"

Å andra sidan är förkomponerade digrafer och liknande ibland föråldrade (som den där, verkar det som!) och kan ändå vara oönskade i utbytt text på grund av den potentiella kopiera-klistra-besväret om det inte är det vanliga sättet folk skriver sekvensen på i praktiken. Tyvärr, i avsaknad av förkompositions-”hint”, kommer en explicit lokal inte hjälpa här (åtminstone såvitt jag vet). Om vi stavar ijsselmeer med ett vanligt i + j, kommer capitalizeFirstLetter ge fel resultat även om vi uttryckligen anger nl som lokal:

capitalizeFirstLetter('ijsselmeer', 'nl'); // "Ijsselmeer" :(

(Jag är inte helt säker på om det finns några sådana fall där beteendet beror på tillgången till ICU-data — kanske någon annan kan säga.)

Om syftet med transformationen däremot är att visa textinnehåll i en webbläsare, har du ett helt annat alternativ tillgängligt som sannolikt kommer att vara ditt bästa val: att utnyttja funktioner i webbplattformens andra kärnspråk, HTML och CSS. Med HTML:s lang=... och CSS:s text-transform:..., har du en (pseudo-)deklarativ lösning som lämnar extra utrymme för användaragenten att vara ”smart.” Ett JS API behöver ha förutsägbara resultat över alla webbläsare (generellt) och får inte experimentera med heuristik. Själva användaragenten är däremot endast skyldig sin användare, och heuristiska lösningar är tillåtna när resultatet är för en människa. Om vi säger till den ”den här texten är nederländsk, men vänligen visa den med versaler,” kan det specifika resultatet variera mellan webbläsare, men det är sannolikt det bästa var och en av dem kan göra. Låt oss se:

<!DOCTYPE html>
<dl>
<dt>Untransformed
<dd>ijsselmeer
<dt>Capitalized with CSS and <code>lang=en</code>
<dd lang="en" style="text-transform: capitalize">ijsselmeer
<dt>Capitalized with CSS and <code>lang=nl</code>
<dd lang="nl" style="text-transform: capitalize">ijsselmeer

I Chromium vid tiden för detta skrivande kommer både den engelska och nederländska raden ut som Ijsselmeer — så det gör inte bättre än JS. Men prova det i nuvarande Firefox! Elementet som vi berättade för webbläsaren innehåller nederländska kommer att återges korrekt som IJsselmeer där.

Den här lösningen är specifik för ändamålet (den kommer inte att hjälpa dig i Node, i alla fall) men det var dumt av mig att inte uppmärksamma det tidigare med tanke på att vissa kanske inte inser att de googlar fel fråga. Tack @paul23 för att du klargjorde mer om naturen hos IJ-digrafen i praktiken och uppmuntrade till vidare undersökning!

Från och med januari 2021 har alla stora motorer implementerat funktionen för Unicode-egenskapens teckenklass, men beroende på ditt målstödsområde kanske du ännu inte kan använda den säkert. Den senaste webbläsaren att införa stöd var Firefox (78; 30 juni 2020). Du kan kontrollera stöd för denna funktion med Kangax kompatibilitetstabell. Babel kan användas för att kompilera RegExp-litteraler med egenskapsreferenser till motsvarande mönster utan dem, men var medveten om att den resulterande koden ibland kan bli enorm. Du skulle troligen inte vilja göra detta om du inte är säker på att avvägningen är motiverad för ditt användningsfall.

Högst sannolikt kommer personer som ställer denna fråga inte att bry sig om Deseret-stor bokstavsanvändning eller internationalisering. Men det är bra att vara medveten om dessa frågor eftersom det finns en stor sannolikhet att du kommer att stöta på dem så småningom även om de inte är aktuella problem just nu. De är inte »edge«-fall, eller snarare, de är inte per definition edge-fall — det finns ett helt land där de flesta talar turkiska ändå, och att blanda ihop kodenheter med kodpunkter är en ganska vanlig källa till buggar (särskilt när det gäller emoji). Både strängar och språk är ganska komplicerade!

* Kodenheterna i UTF-16/UCS2 är också Unicode-kodpunkter i den meningen att t.ex. U+D800 tekniskt sett är en kodpunkt, men det är inte vad det “betyder” här ... på ett sätt ... även om det blir ganska suddigt. Vad surrogaterna definitivt inte är, däremot, är USV:er (Unicode scalar values).

** Men om en surrogatkodenhet är "föräldralös" - det vill säga inte en del av ett logiskt par - kan du fortfarande få surrogater här också.

*** kanske. Jag har inte testat det. Om du inte har fastställt att versalisering är en meningsfull flaskhals, skulle jag troligen inte bry mig om det — välj vad du tror är mest klart och läsbart.

**** en sådan funktion kan vilja testa både den första och andra kodenheten istället för bara den första, eftersom det är möjligt att den första enheten är en föräldralös surrogat. Till exempel skulle insatsen "\uD800x" göra X stor som det är, vilket kanske eller kanske inte var förväntat.

Svar #6

Om du är intresserad av prestandan hos några olika metoder som har publicerats:

Här är de snabbaste metoderna baserat på detta jsperf-test (ordnade från snabbast till långsammast).

Som du kan se är de två första metoderna i princip jämförbara när det gäller prestanda, medan att ändra String.prototype är långt ifrån den långsammaste när det gäller prestanda.

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

Svar #7

För ett annat fall behöver jag att det gör den första bokstaven stor och resten små. Följande fall fick mig att ändra denna funktion:

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

Svar #8

Om du redan använder (eller överväger att använda) Lodash är lösningen enkel:

_.upperFirst('fred');
// => 'Fred'

_.upperFirst('FRED');
// => 'FRED'

_.capitalize('fred') //=> 'Fred'

Se deras dokumentation: https://lodash.com/docs#capitalize

_.camelCase('Foo Bar'); //=> 'fooBar'

https://lodash.com/docs/4.15.0#camelCase

_.lowerFirst('Fred');
// => 'fred'

_.lowerFirst('FRED');
// => 'fRED'

_.snakeCase('Foo Bar');
// => 'foo_bar'

Vanilj JavaScript för första stora bokstaven:

function upperCaseFirst(str){
    return str.charAt(0).toUpperCase() + str.substring(1);
}

Svar #9

Detta är 2018 års ECMAScript 6+-lösning:

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

Svar #10

Det finns ett mycket enkelt sätt att implementera det med replace. För ECMAScript 6:

'foo'.replace(/^./, str => str.toUpperCase())

Resultat :

'Foo'

Svar #11

Endast CSS

Om omvandlingen endast behövs för visning på en webbsida:

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

Trots att det kallas "::first-letter", tillämpas det på det första tecknet, dvs. i fallet med strängen %a skulle denna selektor tillämpas på % och därmed skulle a inte bli versal.
I IE9+ eller IE5.5+ stöds det i äldre notation med endast ett kolon (:first-letter).

ES2015 enradare

const capitalizeFirstChar = str => str.charAt(0).toUpperCase() + str.substring(1);

Kommentarer

I det benchmark jag genomförde fanns det ingen signifikant skillnad mellan string.charAt(0) och string[0]. Notera dock att string[0] skulle vara undefined för en tom sträng, så funktionen skulle behöva skrivas om för att använda "string && string[0]", vilket är alldeles för omständligt jämfört med alternativet.
string.substring(1) är snabbare än string.slice(1).

Jämförelse mellan `substring()` och `slice()`

Skillnaden är ganska liten nuförtiden (kör testet själv):

21 580 613,15 ops/s ±1,6 % för substring(),
21 096 394,34 ops/s ±1,8 % (2,24 % långsammare) för slice().

Svar #12

Gör den första bokstaven i alla ord i en sträng versal:

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(" ");
}

Svar #13

Det är alltid bättre att hantera sådana här saker med CSS först, i allmänhet, om du kan lösa något med CSS, välj det först, sedan försök med JavaScript för att lösa dina problem, så i det här fallet försök att använda :first-letter i CSS och applicera text-transform:capitalize;

Så försök skapa en klass för det, så att du kan använda den globalt, till exempel: .first-letter-uppercase och lägg till något liknande nedan i ditt CSS:

.first-letter-uppercase:first-letter {
    text-transform:capitalize;
}

Alternativt är JavaScript också ett alternativ, så det bästa kommer att vara något i stil med detta:

function capitalizeTxt(txt) {
  return txt.charAt(0).toUpperCase() + txt.slice(1); //or if you want lowercase the rest txt.slice(1).toLowerCase();
}

och kalla det så:

capitalizeTxt('this is a test'); // return 'This is a test'
capitalizeTxt('the Eiffel Tower'); // return 'The Eiffel Tower'
capitalizeTxt('/index.html');  // return '/index.html'
capitalizeTxt('alireza');  // return 'Alireza'
capitalizeTxt('dezfoolian');  // return 'Dezfoolian'

Om du vill återanvända det om och om igen, är det bättre att bifoga det till JavaScript:s inbyggda String, så något som nedan:

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

och kalla det som nedan:

'this is a test'.capitalizeTxt(); // return 'This is a test'
'the Eiffel Tower'.capitalizeTxt(); // return 'The Eiffel Tower'
'/index.html'.capitalizeTxt();  // return '/index.html'
'alireza'.capitalizeTxt();  // return 'Alireza'

Svar #14

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

Och sedan:

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

Uppdatering november 2016 (ES6), bara för kul:

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 character which is capitalized by
                                                        // the `toUpperCase()` method
 ).join('')                                             // Return back to string

then capitalize("hello")/Hello

Svar #15

KORTASTE 3 lösningar, 1 och 2 hanterar fall när s strängen är "", null och undefined:

 s&&s[0].toUpperCase()+s.slice(1)        // 32 char

 s&&s.replace(/./,s[0].toUpperCase())    // 36 char - using regexp

'foo'.replace(/./,x=>x.toUpperCase())    // 31 char - direct on string, ES6

let s='foo bar';

console.log( s&&s[0].toUpperCase()+s.slice(1) );

console.log( s&&s.replace(/./,s[0].toUpperCase()) );

console.log( 'foo bar'.replace(/./,x=>x.toUpperCase()) );

Svar #16

Vi kan få den första karaktären med en av mina favorit-RegExp, ser ut som en söt smiley: /^./

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

Och för alla kaffeälskare:

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

...och för alla killar som tror att det finns ett bättre sätt att göra detta på, utan att utöka de inbyggda prototyperna:

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

Svar #17

Här är en funktion som heter ucfirst() (kort för "stor bokstav först"):

function ucfirst(str) {
    var firstLetter = str.substr(0, 1);
    return firstLetter.toUpperCase() + str.substr(1);
}

Du kan göra en sträng med stor begynnelsebokstav genom att anropa ucfirst("någon sträng") -- till exempel,

ucfirst("this is a test") --> "This is a test"

Det fungerar genom att dela upp strängen i två delar. På den första raden hämtar den firstLetter och sedan på den andra raden gör den firstLetter versalt genom att anropa firstLetter.toUpperCase() och slår ihop det med resten av strängen, som hittas genom att anropa str.substr(1).

Du kanske tror att detta skulle misslyckas för en tom sträng, och faktiskt i ett språk som C skulle du behöva ta hänsyn till detta. Men i JavaScript, när du tar en delsträng av en tom sträng, får du bara tillbaka en tom sträng.

Svar #18

Om du är okej med att skriva med stor bokstav i första bokstaven av varje ord, och ditt användningsområde är i HTML, kan du använda följande CSS:

<style type="text/css">
    p.capitalize {text-transform:capitalize;}
</style>
<p class="capitalize">This is some text.</p>

Detta är från CSS text-transform-egenskap (på W3Schools).

Svar #19

Använd :

var str = "ruby java";

console.log(str.charAt(0).toUpperCase() + str.substring(1));

Det kommer att skriva ut "Ruby java" till konsolen.

Svar #20

Om du använder Underscore.js eller Lodash, tillhandahåller biblioteket underscore.string strängförlängningar, inklusive capitalize:

_.capitalize(string) Konverterar den första bokstaven i strängen till versal.

Exempel :

_.capitalize("foo bar") == "Foo bar"

Svar #21

Om du vill formatera om text med endast versaler kanske du vill ändra de andra exemplen på följande sätt:

function capitalize (text) {
    return text.charAt(0).toUpperCase() + text.slice(1).toLowerCase();
}

Detta kommer att säkerställa att följande text ändras:

TEST => Test
This Is A TeST => This is a test

Svar #22

var capitalized = yourstring[0].toUpperCase() + yourstring.substr(1);

Svar #23

yourString.replace(/\w/, c => c.toUpperCase())

Jag tyckte den här pilfunktionen var lättast. Replace matchar det första bokstavstecknet (\w) i din sträng och konverterar det till versal. Inget mer avancerat är nödvändigt.

Svar #24

function capitalize(s) {
    // returns the first letter capitalized + the string from index 1 and out aka. the rest of the string
    return s[0].toUpperCase() + s.substr(1);
}


// examples
capitalize('this is a test');
=> 'This is a test'

capitalize('the Eiffel Tower');
=> 'The Eiffel Tower'

capitalize('/index.html');
=> '/index.html'

Svar #25

String.prototype.capitalize = function(){
    return this.replace(/(^|\s)([a-z])/g, 
                        function(m, p1, p2) {
                            return p1 + p2.toUpperCase();
                        });
};

Användning :

capitalizedString = someString.capitalize();

Detta är en textsträng => Detta är en textsträng

Svar #26

En lösning som fungerar för alla Unicode-tecken

57 81 olika svar på denna fråga, några utanför ämnet, och ändå tar ingen av dem upp den viktiga frågan att ingen av de listade lösningarna kommer att fungera med asiatiska tecken, emoji och andra tecken med högt Unicode-värde i många webbläsare. Här är en lösning som kommer att göra det:

const consistantCapitalizeFirstLetter = "\uD852\uDF62".length === 1 ?
    function(S) {
        "use-strict"; // Hooray! The browser uses UTF-32!
        return S.charAt(0).toUpperCase() + S.substring(1);
    } : function(S) {
        "use-strict";
        // The browser is using UCS16 to store UTF-16
        var code = S.charCodeAt(0)|0;
        return (
          code >= 0xD800 && code <= 0xDBFF ? // Detect surrogate pair
            S.slice(0,2).toUpperCase() + S.substring(2) :
            S.charAt(0).toUpperCase() + S.substring(1)
        );
    };
const prettyCapitalizeFirstLetter = "\uD852\uDF62".length === 1 ?
    function(S) {
        "use-strict"; // Hooray! The browser uses UTF-32!
        return S.charAt(0).toLocaleUpperCase() + S.substring(1);
    } : function(S) {
        "use-strict";
        // The browser is using UCS16 to store UTF-16
        var code = S.charCodeAt(0)|0;
        return (
          code >= 0xD800 && code <= 0xDBFF ? // Detect surrogate pair
            S.slice(0,2).toLocaleUpperCase() + S.substring(2) :
            S.charAt(0).toLocaleUpperCase() + S.substring(1)
        );
    };

Observera att ovanstående lösning försöker ta hänsyn till UTF-32. Specifikationen anger dock officiellt att webbläsare är skyldiga att göra allt i UTF-16 mappat till UCS2. Ändå, om vi alla går samman, gör vår del och börjar förbereda oss för UTF-32, finns det en chans att TC39 kan tillåta webbläsare att börja använda UTF-32 (precis som Python använder 24 bitar för varje tecken i strängen). Detta måste verka löjligt för en engelsktalande: ingen som bara använder latin-1 har någonsin behövt hantera Mojibake eftersom Latin-1 stöds av alla teckenkodningar. Men användare i andra länder (såsom Kina, Japan, Indonesien, etc. ) är inte lika lyckligt lottade. De kämpar ständigt med kodningsproblem, inte bara från webbsidan, utan även från JavaScript: många kinesiska/japanska tecken behandlas som två bokstäver av JavaScript och kan därför brytas mitt i, vilket resulterar i � och � (två frågetecken som inte är meningsfulla för slutanvändaren). Om vi kunde börja förbereda oss för UTF-32, kanske TC39 skulle tillåta webbläsare att göra det Python gjorde för många år sedan, vilket hade gjort Python mycket populärt för att arbeta med hög Unicode-tecken: att använda UTF-32.

consistantCapitalizeFirstLetter fungerar korrekt i Internet Explorer 3+ (när const ändras till var). prettyCapitalizeFirstLetter kräver Internet Explorer 5.5+ (se toppen av sidan 250 i detta dokument). Dessa fakta är dock mer som skämt eftersom det är mycket troligt att resten av koden på din webbplats inte ens kommer att fungera i Internet Explorer 8 - på grund av alla DOM- och JScript-buggar och brist på funktioner i dessa äldre webbläsare. Dessutom använder ingen längre Internet Explorer 3 eller Internet Explorer 5.5.

Svar #27

var str = "test string";
str = str.substring(0,1).toUpperCase() + str.substring(1);

Svar #28

Kolla in den här lösningen:

var stringVal = 'master';
stringVal.replace(/^./, stringVal[0].toUpperCase()); // Returns Master

Svar #29

med pilfunktion

let fLCapital = s => s.replace(/./, c => c.toUpperCase())
fLCapital('this is a test') // "This is a test"

med pilfunktion, en annan lösning

let fLCapital = s => s = s.charAt(0).toUpperCase() + s.slice(1);
fLCapital('this is a test') // "This is a test"

med array och map()

let namesCapital = names => names.map(name => name.replace(/./, c => c.toUpperCase()))
namesCapital(['james', 'robert', 'mary']) // ["James", "Robert", "Mary"]

Svar #30

Det finns redan så många bra svar, men du kan också använda en enkel CSS-transformering:

text-transform: capitalize;

div.text-capitalize {
  text-transform: capitalize;
}

<h2>text-transform: capitalize:</h2>
<div class="text-capitalize">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>