Capitaliser la première lettre de chaque mot dans une chaîne de caractères - JavaScript

Vous rend complexe une chose très facile. Vous pouvez ajouter ceci dans votre CSS:

 .capitalize {
    text-transform: capitalize;   
  }

En javascript, vous pouvez ajouter la classe à un élément

 document.getElementById("element").className="capitalize";

version ES6:

const toTitleCase = (phrase) => {
  return phrase
    .toLowerCase()
    .split(' ')
    .map(word => word.charAt(0).toUpperCase() + word.slice(1))
    .join(' ');
};

let result = toTitleCase('maRy hAd a lIttLe LaMb');
console.log(result);

si vous pouvez utiliser thirdparty library alors lodash a une fonction helper pour vous.

https://lodash.com/docs/4.17.3#startCase

_.startCase('foo bar');
// => 'Foo Bar'

_.startCase('--foo-bar--');
// => 'Foo Bar'
 
_.startCase('fooBar');
// => 'Foo Bar'
 
_.startCase('__FOO_BAR__');
// => 'FOO BAR'

<script src="https://cdn.jsdelivr.net/lodash/4.17.3/lodash.min.js"></script>

ES2015 version:

const titleCase = title => title
    .split(/ /g).map(word => 
        `${word.substring(0,1).toUpperCase()}${word.substring(1)}`)
    .join("");

aussi une bonne option (particulièrement si vous utilisez freeCodeCamp):

function titleCase(str) {
  var wordsArray = str.toLowerCase().split(/\s+/);
  var upperCased = wordsArray.map(function(word) {
    return word.charAt(0).toUpperCase() + word.substr(1);
  });
  return upperCased.join(" ");
}

vous pouvez simplement utiliser une fonction d'expression régulière pour changer la majuscule de chaque lettre. Avec les optimisations V8 JIST, cela devrait s'avérer le plus rapide et le plus efficace en mémoire.

'tHe VeRy LOOong StRINg'.replace(/\b[a-z]|\B[A-Z]/g, function(x){return String.fromCharCode(x.charCodeAt(0)^32)})

Ou, comme une fonction:

var autoCaps = (function(){
    var fromCharCode = String.fromCharCode;
    return function(string){
        string.replace(/\b[a-z]|\B[A-Z]/g, function(x){
            return fromCharCode(x.charCodeAt(0)^32);
        });
    }
})();

Démo

<input id="input" type="text" value="'tHe VeRy LOOong StRINg'" /><br /><br />
<input id="output" type="text" readonly />
<script>
(function(){
    var fromCharCode = String.fromCharCode;
    (input.oninput = function(){
      output.value = input.value.replace(
        /\b[a-z]|\B[A-Z]/g,
        function(x){return fromCharCode(x.charCodeAt(0)^32)}
      );
    })();
})();
</script>

cette routine traitera les mots avec un trait d'Union et les mots avec apostrophe.

function titleCase(txt) {
var firstLtr = 0;
for (var i = 0;i < text.length;i++){
    if (i == 0 &&/[a-zA-Z]/.test(text.charAt(i))) firstLtr = 2;
    if (firstLtr == 0 &&/[a-zA-Z]/.test(text.charAt(i))) firstLtr = 2;
    if (firstLtr == 1 &&/[^a-zA-Z]/.test(text.charAt(i))){
        if (text.charAt(i) == "'"){
            if (i + 2 == text.length &&/[a-zA-Z]/.test(text.charAt(i + 1))) firstLtr = 3;
            else if (i + 2 < text.length &&/[^a-zA-Z]/.test(text.charAt(i + 2))) firstLtr = 3;
        }
    if (firstLtr == 3) firstLtr = 1;
    else firstLtr = 0;
    }
    if (firstLtr == 2){
        firstLtr = 1;
        text = text.substr(0, i) + text.charAt(i).toUpperCase() + text.substr(i + 1);
    }
    else {
        text = text.substr(0, i) + text.charAt(i).toLowerCase() + text.substr(i + 1);
    }
}

}

titleCase ("pAt o'Neil"); // renvoie "Pat O'Neil";

function titleCase(str) {

var myString = str.toLowerCase().split(' ');
for (var i = 0; i < myString.length; i++) {
    var subString = myString[i].split('');
    for (var j = 0; j < subString.length; j++) {
        subString[0] = subString[0].toUpperCase();

    }
    myString[i] = subString.join('');
}

return myString.join(' '); }

code brut:

function capi(str) {
    var s2 = str.trim().toLowerCase().split(' ');
  var s3 = [];
  s2.forEach(function(elem, i) {
          s3.push(elem.charAt(0).toUpperCase().concat(elem.substring(1)));  
  });
  return s3.join(' ');
}
capi('js string exasd');

/* 1. Transform your string into lower case
2. Split your string into an array. Notice the white space i'm using for separator
3. Iterate the new array, and assign the current iteration value (array[c]) a new formatted string:
 - With the sentence: array[c][0].toUpperCase() the first letter of the string converts to upper case.
 - With the sentence: array[c].substring(1) we get the rest of the string (from the second letter index to the last one).
 - The "add" (+) character is for concatenate both strings. 
4. return array.join(' ') // returns the formatted array like a new string.*/


function titleCase(str){
    str = str.toLowerCase();
    var array = str.split(' ');
    for(var c = 0; c < array.length; c++){
        array[c] = array[c][0].toUpperCase() + array[c].substring(1);
    }
return array.join(' ');
}

titleCase("I'm a little tea pot");

Utilisé replace() avec RegExp

function titleCase(str) {

  var newStr = str.toLowerCase().replace(/./, (x) => x.toUpperCase()).replace(/[^']\b\w/g, (y) => y.toUpperCase());


console.log(newStr);

}

titleCase("I'm a little tea pot")

ou peut être fait en utilisant remplacer (), et remplacer la première lettre de chaque mot avec son "majuscule".

function titleCase(str) {
  return str.toLowerCase().split(' ').map(function(word) {
     return word.replace(word[0], word[0].toUpperCase());
      }).join(' ');
}

titleCase("I'm a little tea pot");

Veuillez vérifier le code ci-dessous.

function titleCase(str) {
  var splitStr = str.toLowerCase().split(' ');
  var nstr = ""; 
  for (var i = 0; i < splitStr.length; i++) {
    nstr +=  (splitStr[i].charAt(0).toUpperCase()+ splitStr[i].slice(1) + " 
    ");
  }
  console.log(nstr);
}

var strng = "this is a new demo for checking the string";
titleCase(strng);

je préfère généralement ne pas utiliser regexp en raison de la lisibilité et aussi j'essaie de rester à l'écart des boucles. Je pense que c'est lisible.

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

une réécriture plus compacte (et moderne) de la solution proposée par @somethingth there's:

function titleCase(str) {
    return str.toLowerCase().split(' ').map(function(chunk){
        return chunk.charAt(0).toUpperCase() + chunk.substring(1);
    }).join(' ');
}
    
document.write(titleCase("I'm an even smaller tea pot"));

Comme de ECMA2017 ou ES8

const titleCase = (string) => {
  return string
    .split(' ')
    .map(word => word.substr(0,1).toUpperCase() + word.substr(1,word.length))
    .join(' ');
};

let result = titleCase('test test test');
console.log(result);

Explication:

1. Tout d'abord, nous passons la chaîne de caractères "test test test test" à notre fonction "titleCase".

2. Nous nous sommes séparés d'une chaîne sur l'espace de sorte que le résultat de la première fonction "split" sera ["test","test","test"]

3. Comme nous avons obtenu un tableau, nous avons utilisé la fonction de carte pour manipuler chaque mot dans le tableau. Nous capitalisons le premier caractère et ajoutons le caractère restant à il.

4. Dans le dernier, nous rejoignons le tableau en utilisant l'espace que nous séparons la chaîne par sapce.

n'est-il pas préférable de faire une corde entière une minuscule et seulement la première lettre de celle-ci en haut?

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