JavaScript ile dizgiyi başlık durumuna dönüştürme

Bir dizeyi başlık durumuna dönüştürmenin basit bir yolu var mı? Örneğin john smitholur John Smith. John Resig'in çözümü gibi karmaşık bir şey aramıyorum , sadece (umarım) bir ya da iki astarlı.

Bunu dene:

    function toTitleCase(str) {
        return str.replace(
            /\w\S*/g,
            function(txt) {
                return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
            }
        );
    }

<form>
Input:
<br /><textarea name="input" onchange="form.output.value=toTitleCase(this.value)"  onkeyup="form.output.value=toTitleCase(this.value)"></textarea>
<br />Output:
<br /><textarea name="output" readonly onclick="select(this)"></textarea>
</form>

Greg Dean'in işlevini uyarlayan biraz daha zarif bir yol:

String.prototype.toProperCase = function () {
    return this.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
};

Şöyle çağırın:

"pascal".toProperCase();

Metin dönüşümü CSS stilini denetimlerinize uygulamayı deneyin .

Örneğin: (text-transform: capitalize);

JS yaklaşımını yalnızca kesinlikle gerekli olduğunda kullanın.

İşte benim versiyonum, IMO da anlaşılması kolay ve zarif.

var str = "foo bar baz"

console.log(

str.split(' ')
   .map(w => w[0].toUpperCase() + w.substr(1).toLowerCase())
   .join(' ')

)
// returns "Foo Bar Baz"

Başlık büyük harf dönüştüren ama aynı zamanda tanımlanmış kısaltmaları büyük harf ve küçük kelimeleri küçük harf olarak koruyan fonksiyonum:

String.prototype.toTitleCase = function() {
  var i, j, str, lowers, uppers;
  str = this.replace(/([^\W_]+[^\s-]*) */g, function(txt) {
    return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
  });

  // Certain minor words should be left lowercase unless 
  // they are the first or last words in the string
  lowers = ['A', 'An', 'The', 'And', 'But', 'Or', 'For', 'Nor', 'As', 'At', 
  'By', 'For', 'From', 'In', 'Into', 'Near', 'Of', 'On', 'Onto', 'To', 'With'];
  for (i = 0, j = lowers.length; i < j; i++)
    str = str.replace(new RegExp('\\s' + lowers[i] + '\\s', 'g'), 
      function(txt) {
        return txt.toLowerCase();
      });

  // Certain words such as initialisms or acronyms should be left uppercase
  uppers = ['Id', 'Tv'];
  for (i = 0, j = uppers.length; i < j; i++)
    str = str.replace(new RegExp('\\b' + uppers[i] + '\\b', 'g'), 
      uppers[i].toUpperCase());

  return str;
}

Örneğin:

"TO LOGIN TO THIS SITE and watch tv, please enter a valid id:".toTitleCase();
// Returns: "To Login to This Site and Watch TV, Please Enter a Valid ID:"

Diğer cevaplara göre aşağıdakileri tercih ederim. Her kelimenin sadece ilk harfiyle eşleşir ve büyük harf kullanır. Daha basit kod, okunması daha kolay ve daha az bayt. Kısaltmaların bozulmasını önlemek için mevcut büyük harfleri korur. Ancak toLowerCase()önce dizenizi her zaman arayabilirsiniz .

function title(str) {
  return str.replace(/(^|\s)\S/g, function(t) { return t.toUpperCase() });
}

Bunu dize prototipinize şu şekilde ekleyebilirsiniz 'my string'.toTitle():

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

Misal:

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

console.log('all lower case ->','all lower case'.toTitle());
console.log('ALL UPPER CASE ->','ALL UPPER CASE'.toTitle());
console.log("I'm a little teapot ->","I'm a little teapot".toTitle());

Regex kullanmadan sadece referans için:

String.prototype.toProperCase = function() {
  var words = this.split(' ');
  var results = [];
  for (var i = 0; i < words.length; i++) {
    var letter = words[i].charAt(0).toUpperCase();
    results.push(letter + words[i].slice(1));
  }
  return results.join(' ');
};

console.log(
  'john smith'.toProperCase()
)

Hemen toLowerCasedizeyi ve daha sonra toUpperCaseher kelimenin ilk harfini kullanabilirsiniz. Çok basit bir 1 astar olur:

function titleCase(str) {
  return str.toLowerCase().replace(/\b(\w)/g, s => s.toUpperCase());
}

console.log(titleCase('iron man'));
console.log(titleCase('iNcrEdible hulK'));

Bu doldurucu kelimeler hakkında endişelenmeniz durumunda, işleve her zaman büyük harf kullanmamanızı söyleyebilirsiniz.

/**
 * @param String str The text to be converted to titleCase.
 * @param Array glue the words to leave in lowercase. 
 */
var titleCase = function(str, glue){
    glue = (glue) ? glue : ['of', 'for', 'and'];
    return str.replace(/(\w)(\w*)/g, function(_, i, r){
        var j = i.toUpperCase() + (r != null ? r : "");
        return (glue.indexOf(j.toLowerCase())<0)?j:j.toLowerCase();
    });
};

Umarım bu size yardımcı olur.

Düzenle

Eğer önde gelen tutkal kelimeleri ele almak istiyorsanız, bu w / bir değişkenini takip edebilirsiniz:

var titleCase = function(str, glue){
    glue = !!glue ? glue : ['of', 'for', 'and', 'a'];
    var first = true;
    return str.replace(/(\w)(\w*)/g, function(_, i, r) {
        var j = i.toUpperCase() + (r != null ? r : '').toLowerCase();
        var result = ((glue.indexOf(j.toLowerCase()) < 0) || first) ? j : j.toLowerCase();
        first = false;
        return result;
    });
};

Yukarıdaki çözümlerde kullanılan normal ifade sizi karıştırıyorsa, şu kodu deneyin:

function titleCase(str) {
  return str.split(' ').map(function(val){ 
    return val.charAt(0).toUpperCase() + val.substr(1).toLowerCase();
  }).join(' ');
}

"McDonald" veya "MacDonald" veya "O'Toole" veya "D'Orazio" gibi soyadlarını (başlık durumu değil) işleyebilen bu işlevi yaptım. Ancak Almanca ya da Hollandaca isimleri genellikle küçük harf olan "van" ya da "von" ile işlemez ... "de" nin "Robert de Niro" gibi genellikle küçük harf olduğuna inanıyorum. Bunlar hala ele alınmalıdır.

function toProperCase(s)
{
  return s.toLowerCase().replace( /\b((m)(a?c))?(\w)/g,
          function($1, $2, $3, $4, $5) { if($2){return $3.toUpperCase()+$4+$5.toUpperCase();} return $1.toUpperCase(); });
}

var toMatch = "john w. smith";
var result = toMatch.replace(/(\w)(\w*)/g, function (_, i, r) {
      return i.toUpperCase() + (r != null ? r : "");
    }
)

Çalışıyor gibi görünüyor ... Yukarıdaki ile test, "çabuk kahverengi, tilki? / Atlar / ^ üzerinde ^ tembel! Köpek ..." ve "C: / program dosyaları / bazı satıcı / onların 2. uygulama / a file1.txt".

2 yerine 2Nd istiyorsanız, /([a-z])(\w*)/g .

İlk form aşağıdaki gibi basitleştirilebilir:

function toTitleCase(toTransform) {
  return toTransform.replace(/\b([a-z])/g, function (_, initial) {
      return initial.toUpperCase();
  });
}

Bunu dene

String.prototype.toProperCase = function(){
    return this.toLowerCase().replace(/(^[a-z]| [a-z]|-[a-z])/g, 
        function($1){
            return $1.toUpperCase();
        }
    );
};

Misal

var str = 'john smith';
str.toProperCase();

Kodunuzda üçüncü taraf kitaplıkları kullanabiliyorsanız, lodash'ın bizim için bir yardımcı işlevi vardır.

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'

Bunu en kısa yoldan deneyin:

str.replace(/(^[a-z])|(\s+[a-z])/g, txt => txt.toUpperCase());

ES 6

str.split(' ')
   .map(s => s.slice(0, 1).toUpperCase() + s.slice(1).toLowerCase())
   .join(' ')

Başka

str.split(' ').map(function (s) {
    return s.slice(0, 1).toUpperCase() + s.slice(1).toLowerCase();
}).join(' ')

Bu cevapların çoğu, sınır metakarakter (\ b) kelimesini kullanma olasılığını göz ardı etmektedir. Greg Dean'in bu cevabı kullanmasının daha kısa bir versiyonu:

function toTitleCase(str)
{
    return str.replace(/\b\w/g, function (txt) { return txt.toUpperCase(); });
}

Jim-Bob gibi tireli isimler için de çalışır.

Bence en basiti css kullanıyor.

function format_str(str) {
    str = str.toLowerCase();
    return '<span style="text-transform: capitalize">'+ str +'</span>';
}

/\S+/gAksanları desteklemek için kullanın :

function toTitleCase(str) {
  return str.replace(/\S+/g, str => str.charAt(0).toUpperCase() + str.substr(1).toLowerCase());
}

console.log(toTitleCase("a city named örebro")); // A City Named Örebro

Ancak: " s unshine ( y ellow )" ⇒ " S unshine ( y ellow )"

Burada listelenentoTitleCase gramer kurallarını dikkate alan sağlam bir işleve ihtiyaç duyduğum için kendi cevabımı eklemek istedim (Google tarafından önerilen makale). Giriş dizesinin uzunluğuna bağlı çeşitli kurallar vardır. Fonksiyon + birim testleri aşağıdadır.

İşlev ayrıca boşlukları birleştirir ve özel karakterleri kaldırır (gereksinimleriniz için normal ifadeyi değiştirin)

toTitleCase İşlevi

const toTitleCase = (str) => {
  const articles = ['a', 'an', 'the'];
  const conjunctions = ['for', 'and', 'nor', 'but', 'or', 'yet', 'so'];
  const prepositions = [
    'with', 'at', 'from', 'into','upon', 'of', 'to', 'in', 'for',
    'on', 'by', 'like', 'over', 'plus', 'but', 'up', 'down', 'off', 'near'
  ];

  // The list of spacial characters can be tweaked here
  const replaceCharsWithSpace = (str) => str.replace(/[^0-9a-z&/\\]/gi, ' ').replace(/(\s\s+)/gi, ' ');
  const capitalizeFirstLetter = (str) => str.charAt(0).toUpperCase() + str.substr(1);
  const normalizeStr = (str) => str.toLowerCase().trim();
  const shouldCapitalize = (word, fullWordList, posWithinStr) => {
    if ((posWithinStr == 0) || (posWithinStr == fullWordList.length - 1)) {
      return true;
    }

    return !(articles.includes(word) || conjunctions.includes(word) || prepositions.includes(word));
  }

  str = replaceCharsWithSpace(str);
  str = normalizeStr(str);

  let words = str.split(' ');
  if (words.length <= 2) { // Strings less than 3 words long should always have first words capitalized
    words = words.map(w => capitalizeFirstLetter(w));
  }
  else {
    for (let i = 0; i < words.length; i++) {
      words[i] = (shouldCapitalize(words[i], words, i) ? capitalizeFirstLetter(words[i], words, i) : words[i]);
    }
  }

  return words.join(' ');
}

Doğruluğu Sağlamak İçin Birim Testleri

import { expect } from 'chai';
import { toTitleCase } from '../../src/lib/stringHelper';

describe('toTitleCase', () => {
  it('Capitalizes first letter of each word irrespective of articles, conjunctions or prepositions if string is no greater than two words long', function(){
    expect(toTitleCase('the dog')).to.equal('The Dog'); // Capitalize articles when only two words long
    expect(toTitleCase('for all')).to.equal('For All'); // Capitalize conjunctions when only two words long
    expect(toTitleCase('with cats')).to.equal('With Cats'); // Capitalize prepositions when only two words long
  });

  it('Always capitalize first and last words in a string irrespective of articles, conjunctions or prepositions', function(){
    expect(toTitleCase('the beautiful dog')).to.equal('The Beautiful Dog');
    expect(toTitleCase('for all the deadly ninjas, be it so')).to.equal('For All the Deadly Ninjas Be It So');
    expect(toTitleCase('with cats and dogs we are near')).to.equal('With Cats and Dogs We Are Near');
  });

  it('Replace special characters with space', function(){
    expect(toTitleCase('[wolves & lions]: be careful')).to.equal('Wolves & Lions Be Careful');
    expect(toTitleCase('wolves & lions, be careful')).to.equal('Wolves & Lions Be Careful');
  });

  it('Trim whitespace at beginning and end', function(){
    expect(toTitleCase(' mario & Luigi superstar saga ')).to.equal('Mario & Luigi Superstar Saga');
  });

  it('articles, conjunctions and prepositions should not be capitalized in strings of 3+ words', function(){
    expect(toTitleCase('The wolf and the lion: a tale of two like animals')).to.equal('The Wolf and the Lion a Tale of Two like Animals');
    expect(toTitleCase('the  three Musketeers  And plus ')).to.equal('The Three Musketeers and Plus');
  });
});

Sağlanan dizelerden biraz özel karakter kaldırdığımı lütfen unutmayın. Projenizin gereksinimlerini karşılamak için normal ifadeyi değiştirmeniz gerekir.

"john f. kennedy".replace(/\b\S/g, t => t.toUpperCase())

"Lewax00" çözümünü alarak, boşlukla başlayarak "w" ye ya da kelime başlatan "w" ye zorlayan, ancak fazladan ara boşlukları kaldıramayan bu basit çözümü yarattım.

"SOFÍA vergara".toLowerCase().replace(/\b(\s\w|^\w)/g, function (txt) { return txt.toUpperCase(); });

Sonuç "Sofía Vergara" dır.

Burada aksanlı karakterlerle ilgilenen (fransızca için önemli!) İşlevim ve istisnaların azaltılmasını açıp kapatabilen işlevim. Umarım yardımcı olur.

String.prototype.titlecase = function(lang, withLowers = false) {
    var i, string, lowers, uppers;

    string = this.replace(/([^\s:\-'])([^\s:\-']*)/g, function(txt) {
        return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();
    }).replace(/Mc(.)/g, function(match, next) {
        return 'Mc' + next.toUpperCase();
    });

    if (withLowers) {
        if (lang == 'EN') {
            lowers = ['A', 'An', 'The', 'At', 'By', 'For', 'In', 'Of', 'On', 'To', 'Up', 'And', 'As', 'But', 'Or', 'Nor', 'Not'];
        }
        else {
            lowers = ['Un', 'Une', 'Le', 'La', 'Les', 'Du', 'De', 'Des', 'À', 'Au', 'Aux', 'Par', 'Pour', 'Dans', 'Sur', 'Et', 'Comme', 'Mais', 'Ou', 'Où', 'Ne', 'Ni', 'Pas'];
        }
        for (i = 0; i < lowers.length; i++) {
            string = string.replace(new RegExp('\\s' + lowers[i] + '\\s', 'g'), function(txt) {
                return txt.toLowerCase();
            });
        }
    }

    uppers = ['Id', 'R&d'];
    for (i = 0; i < uppers.length; i++) {
        string = string.replace(new RegExp('\\b' + uppers[i] + '\\b', 'g'), uppers[i].toUpperCase());
    }

    return string;
}

Burada ofiste bir tartışma yapıyoruz ve insanların isimleri istediğiniz şekilde girme şeklini otomatik olarak düzeltmeye çalışmanın olası sorunlarla dolu olduğunu düşünüyoruz.

Farklı otomatik büyük harf türlerinin dağıldığı ve bunların yalnızca İngilizce isimler için olduğu, her dilin kendine özgü karmaşıklıkları olan birkaç durumla karşılaştık.

Her ismin ilk harfini büyük harfe çeviren sorunlar:

• IBM gibi kısaltmaların girilmesine izin verilmez, IBM'e dönüştürülür.

• McDonald adı yanlış olan Mcdonald'a dönüşür, aynı şey MacDonald için de geçerlidir.

• Marie-Tonks gibi çift namlulu isimler Marie-tonks'a dönüşecekti.

• O'Connor gibi isimler O'connor'a dönüşecekti.

Bunların çoğu için bununla başa çıkmak için özel kurallar yazabilirsiniz, ancak bunun daha önce olduğu gibi Acronyms ile ilgili sorunları vardır ve yeni bir sorun elde edersiniz:

• MacDonald gibi Mac ile adları düzeltmek için bir kural eklemek, Macy gibi kesme adlarını MacY'ye dönüştürür.

Hiç yanlış gelmediğimiz tek çözüm, DBS'nin de kullandığı kaba kuvvet yöntemi olan her harfi büyük harfle yazmaktır.

İşlemi otomatikleştirmek istiyorsanız, her isim ve kelimenin bir sözlüğü ve nasıl kapitleştirilmesi gerekmeksizin yapmak imkansız kadar iyidir, Her şeyi kapsayan bir kuralınız yoksa, onu kullanmayın kullanıcılarınızı rahatsız edecek ve isimlerini doğru girmek isteyen kişilere başka bir yere gitmelerini isteyecektir.

css (ve dönüştürmek istediğiniz metin büyük harf içeriyorsa) javascript kullanan başka bir çözüm:

html

<span id='text'>JOHN SMITH</span>

js

var str = document.getElementById('text').innerHtml;
var return_text = str.toLowerCase();

css

#text{text-transform:capitalize;}

Düzenli ifadelerden korkanlarımız için (lol):

function titleCase(str)
{
    var words = str.split(" ");
    for ( var i = 0; i < words.length; i++ )
    {
        var j = words[i].charAt(0).toUpperCase();
        words[i] = j + words[i].substr(1);
    }
    return words.join(" ");
}

Tek satırlık çözümüm:

String.prototype.capitalizeWords = function() {
    return this.split(" ").map(function(ele){ return ele[0].toUpperCase() + ele.slice(1).toLowerCase();}).join(" ");
};

Ardından, yöntemi capitalizeWords()herhangi bir dizede çağırabilirsiniz . Örneğin:

var myS = "this actually works!";
myS.capitalizeWords();

>>> This Actually Works

Diğer çözümüm:

function capitalizeFirstLetter(word) {
    return word[0].toUpperCase() + word.slice(1).toLowerCase();
}
String.prototype.capitalizeAllWords = function() {
    var arr = this.split(" ");
    for(var i = 0; i < arr.length; i++) {
        arr[i] = capitalizeFirstLetter(arr[i]);
    }
    return arr.join(" ");
};

Ardından, yöntemi capitalizeWords()herhangi bir dizede çağırabilirsiniz . Örneğin:

var myStr = "this one works too!";
myStr.capitalizeWords();

>>> This One Works Too

Greg Dean yanıtına dayalı alternatif çözüm:

function capitalizeFirstLetter(word) {
    return word[0].toUpperCase() + word.slice(1).toLowerCase();
}
String.prototype.capitalizeWords = function() {
    return this.replace(/\w\S*/g, capitalizeFirstLetter);
};

Ardından, yöntemi capitalizeWords()herhangi bir dizede çağırabilirsiniz . Örneğin:

var myString = "yes and no";
myString.capitalizeWords()

>>> Yes And No

Dinlenme parametresinin kullanımından hiç kimsenin bahsetmediğini görmek şaşırdı. İşte ES6 Rest parametrelerini kullanan basit bir astar.

let str="john smith"
str=str.split(" ").map(([firstChar,...rest])=>firstChar.toUpperCase()+rest.join("").toLowerCase()).join(" ")
console.log(str)

Bu, FreeCodeCamp'ın Bonfire "Title Case" çözümüne dayanıyor , bu da önce verilen dizeyi tüm küçük harflere dönüştürmenizi ve daha sonra bir boşlukta ilerleyen her karakteri büyük harfe dönüştürmenizi gerektiriyor.

Normal ifade kullanmadan:

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