Mettre les mots en majuscules dans la chaîne

Quelle est la meilleure approche pour mettre des mots en majuscules dans une chaîne?

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

• corrige la solution de Marco Demaio où la première lettre précédée d'un espace n'est pas en majuscule.

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

• peut gérer les symboles nationaux et les lettres accentuées.

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

• peut gérer les guillemets et les accolades.

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

L'implémentation la plus courte pour la mise en majuscule des mots dans une chaîne est la suivante à l'aide des fonctions fléchées d'ES6:

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

Implémentation compatible ES5:

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

L'expression régulière correspond essentiellement à la première lettre de chaque mot dans la chaîne donnée et ne transforme que cette lettre en majuscule:

• \ b correspond à une limite de mot (le début ou la fin du mot);
• \ w correspond au méta-caractère suivant [a-zA-Z0-9].

Pour les caractères non ASCII, reportez-vous à cette solution à la place

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

Cette expression régulière correspond à la première lettre et à toutes les lettres non blanches précédées d'un espace blanc dans la chaîne donnée et transforme uniquement cette lettre en majuscule:

• \ s correspond à un caractère d'espacement
• \ S correspond à un caractère non blanc
• (x | y) correspond à l'une des alternatives spécifiées

Un groupe non capturant aurait pu être utilisé ici comme suit, /(?:^|\s)\S/gbien que le gdrapeau dans notre regex ne capture de toute façon pas les sous-groupes par conception.

À votre santé!

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

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

sortie: "C'est la pire chaîne de tous les temps"

Mettre à jour:

Il semble que cette solution remplace la mienne: https://stackoverflow.com/a/7592235/104380

La réponse fournie par vsync fonctionne tant que vous n'avez pas de lettres accentuées dans la chaîne d'entrée.

Je ne connais pas la raison, mais apparemment, l' \bexpression rationnelle in correspond également aux lettres accentuées (testé sur IE8 et Chrome), donc une chaîne comme celle- "località"ci serait mal convertie en majuscule"LocalitÀ" (la àlettre est en majuscule car l'expression rationnelle pense que c'est une limite de mot)

Une fonction plus générale qui fonctionne également avec les lettres accentuées est celle-ci:

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

Vous pouvez l'utiliser comme ceci:

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

Puisque tout le monde vous a donné la réponse JavaScript que vous avez demandée, je vais ajouter que la propriété CSS text-transform: capitalizefera exactement cela.

Je me rends compte que ce n'est peut- être pas ce que vous demandez - vous ne nous avez pas donné le contexte dans lequel vous exécutez cela - mais si c'est juste pour la présentation, j'irais certainement avec l'alternative CSS.

John Resig (de renommée jQuery) a porté un script perl, écrit par John Gruber, sur JavaScript. Ce script capitalise de manière plus intelligente, il ne capitalise pas les petits mots comme «de» et «et» par exemple.

Vous pouvez le trouver ici: Capitalisation du titre en JavaScript

Utiliser JavaScript et 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>

En gros, vous pouvez le faire string.capitalize()et il mettra en majuscule chaque 1ère lettre de chaque mot.

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

La réponse d'Ivo est bonne, mais je préfère ne pas correspondre \wcar il n'est pas nécessaire de capitaliser 0-9 et AZ. Nous pouvons les ignorer et ne faire correspondre que sur az.

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

C'est le même résultat, mais je pense que plus clair en termes de code auto-documenté.

Si vous utilisez lodash dans votre application JavaScript, vous pouvez utiliser _.capitalize :

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

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

Une manière concise ES6 de le faire pourrait ressembler à ceci.

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

Cela ne fait que mettre en majuscule la première lettre et n'affecte pas le reste de la casse de la phrase.

Ma solution:

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

Exemple:

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

Cela devrait couvrir la plupart des cas d'utilisation de 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

Edit: meilleure lisibilité de la cartographie.

Cette solution n'utilise pas de regex, prend en charge les caractères accentués et est également prise en charge par presque tous les navigateurs.

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

Usage:

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

Production:

Çao 2nd Inside Javascript Program

http://www.mediacollege.com/internet/javascript/text/case-capitalize.html est l'une des nombreuses réponses disponibles.

Google peut être tout ce dont vous avez besoin pour de tels problèmes.

Une approche naïve consisterait à diviser la chaîne par un espace, à mettre en majuscule la première lettre de chaque élément du tableau résultant et à la joindre à nouveau. Cela laisse les majuscules existantes seules (par exemple, HTML reste HTML et ne devient pas quelque chose de stupide comme Html). Si vous ne voulez pas que cela affecte, mettez toute la chaîne en minuscules avant de la fractionner.

Ce code met en majuscule les mots après le point:

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

J'aime aller avec un processus simple. Commencez par changer la chaîne en tableau pour une itération facile, puis en utilisant la fonction de carte, changez chaque mot comme vous le souhaitez.

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 ou Javascipt ne fournit pas de méthode intégrée pour y parvenir.

La transformation de test CSS (text-transform: capitalize;) ne met pas vraiment en majuscule les données de la chaîne mais montre un rendu en majuscule à l'écran.

Si vous recherchez un moyen plus légitime d'y parvenir au niveau des données en utilisant plain vanillaJS, utilisez cette solution =>

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

Utilisez ceci:

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>

Vous pouvez utiliser ce qui suit pour mettre des mots en majuscules dans une chaîne:

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;

}

Il y a aussi locutus: https://locutus.io/php/strings/ucwords/ qui le définit de cette façon:

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

J'utiliserais regex à cette fin:

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