Metti in maiuscolo le parole in stringa

Qual è l'approccio migliore per scrivere in maiuscolo le parole in una stringa?

/**
 * Capitalizes first letters of words in string.
 * @param {string} str String to be modified
 * @param {boolean=false} lower Whether all other letters should be lowercased
 * @return {string}
 * @usage
 *   capitalize('fix this string');     // -> 'Fix This String'
 *   capitalize('javaSCrIPT');          // -> 'JavaSCrIPT'
 *   capitalize('javaSCrIPT', true);    // -> 'Javascript'
 */
const capitalize = (str, lower = false) =>
  (lower ? str.toLowerCase() : str).replace(/(?:^|\s|["'([{])+\S/g, match => match.toUpperCase());
;

• risolve la soluzione di Marco Demaio in cui la prima lettera con uno spazio precedente non è maiuscola.

capitalize(' javascript'); // -> ' Javascript'

• può gestire simboli nazionali e lettere accentate.

capitalize('бабушка курит трубку');  // -> 'Бабушка Курит Трубку'
capitalize('località àtilacol')      // -> 'Località Àtilacol'

• può gestire virgolette e parentesi graffe.

capitalize(`"quotes" 'and' (braces) {braces} [braces]`);  // -> "Quotes" 'And' (Braces) {Braces} [Braces]

L'implementazione più breve per scrivere in maiuscolo all'interno di una stringa è la seguente utilizzando le funzioni freccia di ES6:

'your string'.replace(/\b\w/g, l => l.toUpperCase())
// => 'Your String'

Implementazione compatibile ES5:

'your string'.replace(/\b\w/g, function(l){ return l.toUpperCase() })
// => 'Your String'

Il regex fondamentalmente corrisponde alla prima lettera di ogni parola all'interno della stringa data e trasforma solo quella lettera in maiuscolo:

• \ b corrisponde al limite di una parola (l'inizio o la fine della parola);
• \ w corrisponde al seguente meta-carattere [a-zA-Z0-9].

Per i caratteri non ASCII, consultare invece questa soluzione

'ÿöur striñg'.replace(/(^|\s)\S/g, l => l.toUpperCase())

Questa regex corrisponde alla prima lettera e ogni lettera non di spazi preceduta da spazi all'interno della stringa specificata e trasforma solo quella lettera in maiuscolo:

• \S corrisponde a un carattere di spazi bianchi
• \S corrisponde a un carattere non bianco
• (x | y) corrisponde a una delle alternative specificate

Un gruppo non di cattura avrebbe potuto essere utilizzato qui come segue /(?:^|\s)\S/gsebbene ilg bandiera all'interno del nostro regex non catturerà comunque sottogruppi secondo la progettazione.

Saluti!

function capitalize(s){
    return s.toLowerCase().replace( /\b./g, function(a){ return a.toUpperCase(); } );
};

capitalize('this IS THE wOrst string eVeR');

output: "Questa è la peggior stringa di sempre"

Aggiornare:

Sembra che questa soluzione sostituisca la mia: https://stackoverflow.com/a/7592235/104380

La risposta fornita da vsync funziona fintanto che non hai lettere accentate nella stringa di input.

Non ne conosco il motivo, ma a quanto pare la \bregexp corrisponde anche alle lettere accentate (testate su IE8 e Chrome), quindi una stringa come "località"sarebbe erroneamente convertita in maiuscole"LocalitÀ" (la àlettera viene maiuscola perché la regexp pensa che sia un limite di parole)

Una funzione più generale che funziona anche con lettere accentate è questa:

String.prototype.toCapitalize = function()
{ 
   return this.toLowerCase().replace(/^.|\s\S/g, function(a) { return a.toUpperCase(); });
}

Puoi usarlo in questo modo:

alert( "hello località".toCapitalize() );

Dal momento che tutti ti hanno dato la risposta JavaScript che hai chiesto, ti dirò che la proprietà CSS text-transform: capitalizefarà esattamente questo.

Mi rendo conto che questo potrebbe non essere quello che stai chiedendo - non ci hai fornito nessuno del contesto in cui lo stai eseguendo - ma se fosse solo per la presentazione, sceglierei sicuramente l'alternativa CSS.

John Resig (di fama jQuery) ha portato uno script perl, scritto da John Gruber, su JavaScript. Questo script capitalizza in un modo più intelligente, non fa maiuscole piccole parole come "di" e "e" per esempio.

Puoi trovarlo qui: Titolo in maiuscolo in JavaScript

Utilizzando JavaScript e HTML

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

<form name="form1" method="post">
  <input name="instring" type="text" value="this is the text string" size="30">
  <input type="button" name="Capitalize" value="Capitalize >>" onclick="form1.outstring.value=form1.instring.value.capitalize();">
  <input name="outstring" type="text" value="" size="30">
</form>

Fondamentalmente, puoi farlo string.capitalize() e capitalizzerà ogni 1 lettera di ogni parola.

Fonte: http://www.mediacollege.com/internet/javascript/text/case-capitalize.html

La risposta di Ivo è buona, ma preferisco non coincidere \wperché non è necessario capitalizzare 0-9 e AZ. Possiamo ignorarli e abbinare solo su az.

'your string'.replace(/\b[a-z]/g, match => match.toUpperCase())
// => 'Your String'

È lo stesso risultato, ma penso più chiaro in termini di codice auto-documentante.

Se stai usando lodash nella tua applicazione JavaScript, puoi usare _.capitalize :

console.log( _.capitalize('ÿöur striñg') );
 

<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.min.js"></script>

Un modo conciso di ES6 per farlo potrebbe assomigliare a questo.

const capitalizeFirstLetter = s => s.charAt(0).toUpperCase() + s.slice(1)

Questo maiuscolo solo la prima lettera e non influisce sul resto dell'involucro della frase.

La mia soluzione:

String.prototype.toCapital = function () {
    return this.toLowerCase().split(' ').map(function (i) {
        if (i.length > 2) {
            return i.charAt(0).toUpperCase() + i.substr(1);
        }

        return i;
    }).join(' ');
};

Esempio:

'álL riGht'.toCapital();
// Returns 'Áll Right'

Questo dovrebbe coprire la maggior parte dei casi d'uso di base.

const capitalize = (str) => {
    if (typeof str !== 'string') {
      throw Error('Feed me string')
    } else if (!str) {
      return ''
    } else {
      return str
        .split(' ')
        .map(s => {
            if (s.length == 1 ) {
                return s.toUpperCase()
            } else {
                const firstLetter = s.split('')[0].toUpperCase()
                const restOfStr = s.substr(1, s.length).toLowerCase()
                return firstLetter + restOfStr
            }     
        })
        .join(' ')
    }
}


capitalize('THIS IS A BOOK') // => This Is A Book
capitalize('this is a book') // => This Is A Book
capitalize('a 2nd 5 hour boOk thIs weEk') // => A 2nd 5 Hour Book This Week

Modifica: migliore leggibilità della mappatura.

Questa dose di soluzione non utilizza regex, supporta caratteri accentati e supportata anche da quasi tutti i browser.

function capitalizeIt(str) {
    if (str && typeof(str) === "string") {
        str = str.split(" ");    
        for (var i = 0, x = str.length; i < x; i++) {
            if (str[i]) {
                str[i] = str[i][0].toUpperCase() + str[i].substr(1);
            }
        }
        return str.join(" ");
    } else {
        return str;
    }
}    

Uso:

console.log (capitalizeIt ('çao 2nd inside Javascript program'));

Produzione:

Çao Secondo programma Javascript interno

http://www.mediacollege.com/internet/javascript/text/case-capitalize.html è una delle tante risposte là fuori.

Google può essere tutto ciò di cui hai bisogno per tali problemi.

Un approccio ingenuo sarebbe quello di dividere la stringa per spazi bianchi, scrivere in maiuscolo la prima lettera di ciascun elemento dell'array risultante e ricollegarla. Questo lascia solo la capitalizzazione esistente (ad es. HTML rimane HTML e non diventa qualcosa di stupido come HTML). Se non vuoi quell'effetto, trasforma l'intera stringa in minuscolo prima di dividerlo.

Questo codice mette in maiuscolo le parole dopo il punto:

function capitalizeAfterPeriod(input) { 
    var text = '';
    var str = $(input).val();
    text = convert(str.toLowerCase().split('. ')).join('. ');
    var textoFormatado = convert(text.split('.')).join('.');
    $(input).val(textoFormatado);
}

function convert(str) {
   for(var i = 0; i < str.length; i++){
      str[i] = str[i].split('');
      if (str[i][0] !== undefined) {
         str[i][0] = str[i][0].toUpperCase();
      }
      str[i] = str[i].join('');
   }
   return str;
}

Mi piace seguire un processo semplice. Prima cambia la stringa in Array per una facile iterazione, quindi usando la funzione mappa cambia ogni parola come vuoi che sia.

function capitalizeCase(str) {
    var arr = str.split(' ');
    var t;
    var newt;
    var newarr = arr.map(function(d){
        t = d.split('');
        newt = t.map(function(d, i){
                  if(i === 0) {
                     return d.toUpperCase();
                    }
                 return d.toLowerCase();
               });
        return newt.join('');
      });
    var s = newarr.join(' ');
    return s;
  }

Jquery o Javascipt non forniscono un metodo integrato per raggiungere questo obiettivo.

Trasformazione test CSS (text-transform: capitalize;) in realtà non capitalizza i dati della stringa ma mostra un rendering in maiuscolo sullo schermo.

Se stai cercando un modo più legittimo per raggiungere questo obiettivo a livello di dati usando plain vanillaJS, usa questa soluzione =>

var capitalizeString = function (word) {    
    word = word.toLowerCase();
    if (word.indexOf(" ") != -1) { // passed param contains 1 + words
        word = word.replace(/\s/g, "--");
        var result = $.camelCase("-" + word);
        return result.replace(/-/g, " ");
    } else {
    return $.camelCase("-" + word);
    }
}

Usa questo:

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

let str = 'text';
document.querySelector('#demo').innerText = str.toTitleCase();

<div class = "app">
  <p id = "demo"></p>
</div>

È possibile utilizzare quanto segue per scrivere in maiuscolo le parole in una stringa:

function capitalizeAll(str){

    var partes = str.split(' ');

    var nuevoStr = ""; 

    for(i=0; i<partes.length; i++){
    nuevoStr += " "+partes[i].toLowerCase().replace(/\b\w/g, l => l.toUpperCase()).trim(); 
    }    

    return nuevoStr;

}

C'è anche locutus: https://locutus.io/php/strings/ucwords/ che lo definisce in questo modo:

function ucwords(str) {
  //  discuss at: http://locutus.io/php/ucwords/
  // original by: Jonas Raoni Soares Silva (http://www.jsfromhell.com)
  // improved by: Waldo Malqui Silva (http://waldo.malqui.info)
  // improved by: Robin
  // improved by: Kevin van Zonneveld (http://kvz.io)
  // bugfixed by: Onno Marsman (https://twitter.com/onnomarsman)
  // bugfixed by: Cetvertacov Alexandr (https://github.com/cetver)
  //    input by: James (http://www.james-bell.co.uk/)
  //   example 1: ucwords('kevin van  zonneveld')
  //   returns 1: 'Kevin Van  Zonneveld'
  //   example 2: ucwords('HELLO WORLD')
  //   returns 2: 'HELLO WORLD'
  //   example 3: ucwords('у мэри был маленький ягненок и она его очень любила')
  //   returns 3: 'У Мэри Был Маленький Ягненок И Она Его Очень Любила'
  //   example 4: ucwords('τάχιστη αλώπηξ βαφής ψημένη γη, δρασκελίζει υπέρ νωθρού κυνός')
  //   returns 4: 'Τάχιστη Αλώπηξ Βαφής Ψημένη Γη, Δρασκελίζει Υπέρ Νωθρού Κυνός'

  return (str + '').replace(/^(.)|\s+(.)/g, function ($1) {
    return $1.toUpperCase();
  });
};

Vorrei usare regex per questo scopo:

myString = '  this Is my sTring.  ';
myString.trim().toLowerCase().replace(/\w\S*/g, (w) => (w.replace(/^\w/, (c) => c.toUpperCase())));