Kaip padaryti, kad pirmoji raidės raidė didžiosiomis raidėmis būtų javascript?

Kaip padaryti pirmąją eilutės raidę didžiosiomis raidėmis, bet nekeičiant bet kurios kitos raidės?

Pavyzdžiui:

  • "this is a test""this is a test"
  • "the Eiffel Tower""the Eiffel Tower"
  • "/index.html""/index.html"
3226
22 июня '09 в 11:25 2009-06-22 11:25 Robertas Willsas paprašė birželio 22 d., 09:25 2009-06-22 11:25
ответ 81 atsakymas
  • 1
  • 2
  • 3
 function capitalizeFirstLetter(string) { return string.charAt(0).toUpperCase() + string.slice(1); } 

Kai kurie kiti atsakymai keičia String.prototype (šis atsakymas taip pat buvo naudojamas), bet dabar String.prototype nes tai yra išlaikomumas (sunku žinoti, kur ši funkcija pridedama prie prototype ir gali sukelti konfliktų, jei kitas kodas naudoja tą patį pavadinimą / naršyklę būsimos funkcijos su tuo pačiu pavadinimu).

5080
22 июня '09 в 11:30 2009-06-22 11:30 atsakymas Steve Harrisonui birželio 22 d., 09:30 val. 2009-06-22 11:30

Daugiau objekto orientuoto požiūrio:

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

Ir tada:

 "hello world".capitalize(); => "Hello world" 
1236
20 июля '10 в 18:51 2010-07-20 18:51 Atsakymą pateikė Steve Hansell liepos 20 d., 10 val., 18:51, 2010-07-20 18:51

CSS:

 p:first-letter { text-transform:capitalize; } 
448
17 июля '12 в 17:06 2012-07-17 17:06 atsakymas pateikiamas sam6ber liepos 17 d., 12:06, 2012-07-17 17:06

Čia yra sutrumpinta populiaraus atsakymo versija, gaunanti pirmąją raidę, apdorojant eilutę kaip masyvą:

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

Atnaujinti:

Remiantis toliau pateiktomis pastabomis, tai neveikia IE 7 ar žemesnėje versijoje.

2 naujinimas:

Norėdami išvengti undefined tuščių eilučių (žr. Toliau pateiktą komentarą @ njzk2 ), galite patikrinti tuščią eilutę:

 function capitalize(s) { return s  s[0].toUpperCase() + s.slice(1); } 
250
29 авг. atsakymas, kurį pateikė joelvh rugpjūčio 29 d 2011-08-29 02:03 '11 at 2:03 2011-08-29 02:03

Jei jus domina atlikti kelis paskelbtus metodus:

Čia yra sparčiausiai pasitelkiami šio jsperf testo metodai (užsakomi nuo greičiausios iki lėtiausios ).

Kaip matote, pirmieji du metodai iš esmės yra palyginami pagal veiklos rezultatus, o String.prototype pats String.prototype pagal rezultatus.

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

2019

14 нояб. Atsakymą pateikė Josh Crozier 14 lapkričio. 2015-11-14 06:26 '15 at 6:26 am 2015-11-14 06:26

Kitą kartą man reikia, kad jis pavadintų pirmąją raidę, o apačioje - likusią. Šie atvejai privertė mane pakeisti šią funkciją:

 //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(); 
137
19 июля '13 в 21:17 2013-07-19 21:17 atsakymą pateikė alejandro liepos 19 d. 13 val. 21:17 2013-07-19 21:17

Čia pateikiami geriausi sprendimai:

Pirmasis sprendimas CSS:

 p { text-transform: capitalize; } 

Antrasis sprendimas :

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

Taip pat galite pridėti jį prie String.prototype kad galėtumėte jį String.prototype kitaip:

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

ir naudokite jį taip:

 'string'.capitalizeFirstLetter() // String 

Trečiasis sprendimas :

 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(" "); } 
134
16 февр. atsakymas, kurį pateikė Kamil Ibadov 2017-02-16 08:30 '17 8:30 val. 2017-02-16 08:30
 var string = "hello world"; string = string.charAt(0).toUpperCase() + string.slice(1); alert(string); 
63
17 июля '13 в 9:23 2013-07-17 09:23 atsakymą pateikė Anupas liepos 17 d. 13 val

Parašykite pirmąją visų eilutėje esančių žodžių raidę:

 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
30 нояб. Atsakyti Dan 30 lapkričio. 2011-11-30 20:16 '11, 20:16, 2011-11-30 20:16

Tai yra 2018 ES6 + sprendimas :

54
19 марта '18 в 18:32 2018-03-19 18:32 atsakymą pateikė Sterlingas Bourne 19 d. 18 val. 18:32 2018-03-19 18:32

Jei jau esate (arba svarsto) naudodami „ lodash , sprendimas yra paprastas:

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

Žr. Jų dokumentus: 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' 

Vanilės js pirmosios didelės raidės:

 function upperCaseFirst(str){ return str.charAt(0).toUpperCase() + str.substring(1); } 
50
29 нояб. atsakymas pateikiamas chovy yra lapkričio 29 d. 2015-11-29 11:13 '15, 11:13 2015-11-29 11:13
 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 } 

Ir tada:

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

Atnaujinimas 2016 m. Lapkričio mėn. (ES6), tik 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 

tada capitalize("hello") // Hello

45
29 нояб. atsakymą pateikė Abdennour TOUMI lapkričio 29 d 2013-11-29 23:01 '13, 23:01, 2013-11-29 23:01

Mes galėtume gauti pirmąjį simbolį su vienu iš mano mėgstamiausių „ RegExp , atrodo kaip mielas šypsenėlis: /^./

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

Ir visiems narkomanams:

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

... ir visiems vaikinams, manantiems, kad yra geresnis būdas tai padaryti, neišplėsdami savo prototipų:

 var capitalize = function (input) { return input.replace(/^./, function (match) { return match.toUpperCase(); }); }; 
45
15 февр. atsakymas pateikiamas vasario 15 d. 2013-02-15 09:55 '13, 9:55, 2013-02-15 09:55

Jei naudojate „ underscore.js“ arba „ Lo-Dash“ , underscore.string suteikia eilutės plėtinius, įskaitant „capize“:

_. kapitalizuoti (eilutė) Pirmąją eilutės raidę paverčia didžiosiomis raidėmis.

Pavyzdys:

 _.capitalize("foo bar") == "Foo bar" 
43
12 июня '14 в 11:00 2014-06-12 11:00 atsakymą pateikė Andersas birželio 12 d., 14 val
 var capitalized = yourstring[0].toUpperCase() + yourstring.substr(1); 
37
25 авг. atsakymas pateikiamas zianwar 25 rug . 2016-08-25 15:29 '16 at 15:29 pm 2016-08-25 15:29

Tik CSS

 p::first-letter { text-transform: uppercase; } 
  • Nors jis vadinamas ::first-letter , jis taikomas pirmajam simboliui. , tai yra, jei eilutė %a , šis selektorius bus taikomas % ir, kaip toks, a nebus kapitalizuotas.
  • IE9 + arba IE5.5 +, tai palaikoma muzikine notacija, kurioje yra tik viena dvitaškis ( :first-letter ).

ES2015 viena eilutė

Kadangi yra daug atsakymų, tačiau ES2015 nėra tokių, kurie veiksmingai išspręstų pradinę problemą, pateikiau:

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

Pastabos

  • parameters => function vadinama rodyklės funkcija .
  • Aš atėjau su pavadinimu capitalizeFirstChar vietoj capitalizeFirstLetter pirmąjį laišką, nes OP neprašė kodo, kuris vadovauja pirmajai raidei visoje eilutėje, bet pats pirmasis simbolis (jei šis laiškas, žinoma).
  • const suteikia mums galimybę paskelbti capitalizeFirstChar kaip konstanta, kuri yra pageidautina, nes kaip programuotojas visada turėtumėte aiškiai nurodyti savo ketinimus.
  • Atlikus testą, nebuvo reikšmingo skirtumo tarp string.charAt(0) ir string[0] . Atminkite, kad ši string[0] bus undefined tuščiai eilutei, todėl ji turėtų būti perrašyta į string string[0] , kuri yra per sunki, palyginti su alternatyva.
  • string.substring(1) greitesnis nei string.slice(1) .

Lyginamoji analizė

  • 4,956,962 ops / s ± 3,03% šiam tirpalui,
  • 4,577,946 ops / s ± 1,2% už labiausiai balsavusį atsakymą.
  • Sukurta iš „ JSBench.me“ „Google Chrome“ 57.

2019

05 апр. atsakymas duotas Przemek 05 balandžio. 2017-04-05 20:21 '17 at 8:21 pm 2017-04-05 20:21

Jei norite pakeisti visą tekstą, galite pakeisti kitus pavyzdžius:

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

Tai pakeis šį tekstą:

 TEST => Test This Is A TeST => This is a test 
35
08 авг. atsakymas pateikiamas monokromui 08 rug . 2011-08-08 19:55 '11, 19:55, 2011-08-08 19:55

CSS atrodo paprastesnis:

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

Tai iš CSS teksto transformavimo nuosavybės ( W3Schools ).

35
09 дек. atsakymas pateikiamas Ryan 09 dec. 2011-12-09 03:27 '11 at 3:27 2011-12-09 03:27
 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' 
33
13 июля '15 в 23:34 2015-07-13 23:34 atsakymą pateikė Fredrik A. Liepos 13 d. 15, 23:34 2015-07-13 23:34

Visada geriau pirmiausia tvarkyti tokius dalykus naudodami CSS , apskritai, jei galite išspręsti kažką su CSS, atlikite tai pirmiausia, tada išbandykite „JavaScript“, kad išspręstumėte savo problemas, todėl šiuo atveju pabandykite naudoti :first-letter CSS ir taikyti text-transform:capitalize;

Todėl pabandykite sukurti klasę tam, kad galėtumėte jį naudoti visame pasaulyje, pavyzdžiui:.

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

„JavaScript“ taip pat yra alternatyva, todėl kažkas panašaus būtų geriausia:

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

ir pavadinkite jį kaip:

 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' 

Jei norite jį naudoti vėl ir vėl, tai geriau pridėti prie vietinio javascript eilutės, todėl kažką panašaus į žemiau pateiktą:

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

ir pavadinkite jį taip:

 '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' 
31
14 мая '17 в 11:12 2017-05-14 11:12 Atsakymą pateikė Alireza gegužės 17 d. 17 val. 11:12
 String.prototype.capitalize = function(){ return this.replace( /(^|\s)([az])/g , function(m,p1,p2){ return p1+p2.toUpperCase(); } ); }; 

Naudoti:

 capitalizedString = someString.capitalize(); 

Tai teksto eilutė => Tai teksto eilutė

27
15 дек. Murat Kucukosman atsakymas, pateiktas gruodžio 15 d. 2010-12-15 13:15 '10, 13:15, 2010-12-15 13:15

Čia yra funkcija „ ucfirst“ () (trumpas „pirmosios pirmosios raidės raidė“):

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

Pavyzdžiui, galite naudoti eilutę ucfirst („kai kurios eilutės“)

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

Jis veikia nutraukdamas liniją į dvi dalis. Pirmoje eilutėje jis išsitraukia pirmąjį raidę , o antroje eilutėje jis naudoja pirmąjį raidę , skambindamas pirmuoju Letter.toUpperCase .

Galbūt manote, kad tai sukels tuščios eilutės klaidą, ir tokioje kalboje, kaip C, turėsite ją patenkinti. Tačiau „JavaScript“, kai jūs įtraukiate į tuščią eilutę, tiesiog grįžkite tuščią eilutę.

26
22 июня '09 в 11:33 2009-06-22 11:33 atsakymą pateikė Robert Wills, birželio 22 d., 09:33, 2009-06-22 11:33
 var str = "test string"; str = str.substring(0,1).toUpperCase() + str.substring(1); 
26
06 мая '14 в 8:15 2014-05-06 08:15 atsakymas duotas Salimui 06 Gegužės 14 d. 8:15 2014-05-06 08:15

Rezervuokite šį sprendimą:

 var stringVal = 'master'; stringVal.replace(/^./, stringVal[0].toUpperCase()); // returns Master 
20
23 авг. Raju Bera atsakymas 23 rug. 2015-08-23 15:51 '15 15:51 2015-08-23 15:51
 yourString.replace(/^[az]/, function(m){ return m.toUpperCase() }); 

(Jūs galite įterpti ją į funkciją arba netgi pridėti jį prie prototipo „String“, jei jį dažnai naudojate.)

18
19 нояб. Atsakymą Simonas pateikė lapkričio 19 d. 2012-11-19 21:33 '12 21:33 2012-11-19 21:33

ucfirst funkcija veikia, jei tai padarysite.

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

Ačiū JP už aklimatizaciją.

16
19 авг. Atsakymas suteiktas 19 rug . 2010-08-19 00:07 '10 - 0:07 2010-08-19 00:07

Tai galite padaryti vienoje eilutėje

 string[0].toUpperCase() + string.substring(1) 
14
22 янв. atsakymas pateikiamas Qwerty sausio 22 d 2018-01-22 21:27 '18, 21:27 2018-01-22 21:27
Pakeiskite pirmosios raidės ( \w ) simbolį ir konvertuokite jį į didžiosios raidės.  Nereikia nieko ypatingo. 

14
14 июля '18 в 22:40 2018-07-14 22:40 atsakymą pateikė Wolfas liepos 14 d. 18 val. 10.40 2018-07-14 22:40

Yra labai paprastas būdas jį įgyvendinti pakeičiant . ES6:

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

rezultatas:

 'Foo' 
14
08 нояб. Atsakymą pateikė Little Roys 08 Nov. 2018-11-08 11:31 '18, 11:31 ; 2018-11-08 11:31

CoffeeScript“ pridėti eilutes prie prototipo:

 String::capitalize = -> @substr(0, 1).toUpperCase() + @substr(1) 

Naudoti:

 "woobie".capitalize() 

Kas suteikia:

 "Woobie" 
12
15 авг. atsakymas suteikiamas ilgai 15 rug. 2012-08-15 21:06 '12 21:06 2012-08-15 21:06
  • 1
  • 2
  • 3

Kiti klausimai apie „ žymų arba Užduoti klausimą