แปลงสตริงเป็นกรณีหัวเรื่องด้วย JavaScript

มีวิธีง่ายๆในการแปลงสตริงเป็นกรณีชื่อ? เช่นจะกลายเป็นjohn smith John Smithฉันไม่ได้มองหาบางสิ่งที่ซับซ้อนเช่นวิธีแก้ปัญหาของ John Resigเพียงแค่หวังว่าจะเป็นแบบหนึ่งหรือสองแบบ

ลองสิ่งนี้:

    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:

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

เรียกว่าชอบ:

"pascal".toProperCase();

ลองใช้สไตล์ CSS แปลงข้อความกับตัวควบคุมของคุณ

เช่น: (text-transform: capitalize);

ใช้วิธีการ JS เมื่อจำเป็นเท่านั้น

นี่คือเวอร์ชั่นของฉัน IMO มันเข้าใจง่ายและสง่างามเช่นกัน

var str = "foo bar baz"

console.log(

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

)
// returns "Foo Bar Baz"

นี่คือฟังก์ชันของฉันที่แปลงเป็นชื่อตัวพิมพ์ แต่ยังคงคำย่อที่กำหนดไว้เป็นตัวพิมพ์ใหญ่และคำย่อยเป็นตัวพิมพ์เล็ก

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

ตัวอย่างเช่น:

"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:"

ฉันชอบสิ่งต่อไปนี้มากกว่าคำตอบอื่น ๆ มันจับคู่เพียงตัวอักษรตัวแรกของแต่ละคำและใช้ตัวพิมพ์ใหญ่ รหัสเรียบง่ายอ่านง่ายขึ้นและน้อยกว่าไบต์ มันรักษาตัวอักษรที่มีอยู่เพื่อป้องกันการบิดเบือนคำย่อ อย่างไรก็ตามคุณสามารถโทรหาสายtoLowerCase()ของคุณก่อนเสมอ

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

คุณสามารถเพิ่มสิ่งนี้ลงในต้นแบบเครื่องสายของคุณซึ่งจะช่วยให้คุณ'my string'.toTitle()ดังต่อไปนี้:

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

ตัวอย่าง:

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 เพียงเพื่อการอ้างอิง:

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

คุณสามารถtoLowerCaseสตริงได้ทันทีจากนั้นก็แค่toUpperCaseตัวอักษรตัวแรกของแต่ละคำ กลายเป็น 1 ซับง่าย ๆ :

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

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

ในกรณีที่คุณกังวลเกี่ยวกับคำที่เติมคุณสามารถบอกฟังก์ชั่นที่จะไม่ใช้ประโยชน์

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

หวังว่านี่จะช่วยคุณได้

แก้ไข

หากคุณต้องการจัดการคำกาวชั้นนำคุณสามารถติดตามตัวแปร w ​​/ นี้อีกหนึ่งตัวแปร:

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

หาก regex ที่ใช้ในการแก้ปัญหาข้างต้นทำให้คุณสับสนลองรหัสนี้:

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

ฉันสร้างฟังก์ชั่นนี้ซึ่งสามารถรองรับนามสกุล (ดังนั้นจึงไม่ใช่กรณีที่มีชื่อ) เช่น "McDonald" หรือ "MacDonald" หรือ "O'Toole" หรือ "D'Orazio" อย่างไรก็ตามมันไม่ได้จัดการชื่อเยอรมันหรือดัตช์ด้วย "van" หรือ "von" ซึ่งมักจะเป็นตัวพิมพ์เล็ก ... ฉันเชื่อว่า "de" มักจะเป็นตัวพิมพ์เล็กเช่น "Robert de Niro" สิ่งเหล่านี้จะต้องได้รับการแก้ไข

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

ดูเหมือนว่าจะทำงาน ... ผ่านการทดสอบข้างต้น "the quick-brown, fox? / jumps / ^ over ^ the ¡ lazy! dog ... " และ "C: / ไฟล์โปรแกรม / ผู้ขายบางราย / แอปพลิเคชันที่สอง / a file1.txt"

หากคุณต้องการ 2Nd แทน 2nd คุณสามารถเปลี่ยนเป็น /([a-z])(\w*)/gคุณสามารถเปลี่ยนไป

แบบฟอร์มแรกสามารถทำให้ง่ายขึ้นเป็น:

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

ลองสิ่งนี้

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

ตัวอย่าง

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

หากคุณสามารถใช้ห้องสมุดบุคคลที่สามในรหัสของคุณแล้ว lodash มีฟังก์ชั่นตัวช่วยสำหรับเรา

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'

ลองวิธีนี้สั้นที่สุด:

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

อื่น

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

คำตอบเหล่านี้ส่วนใหญ่ดูเหมือนจะเพิกเฉยต่อความเป็นไปได้ที่จะใช้คำว่า metacharacter (\ b) คำตอบสั้น ๆ ของ Greg Dean ใช้:

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

ใช้งานได้กับชื่อยัติภังค์เช่น Jim-Bob ด้วย

ฉันคิดว่าวิธีที่ง่ายที่สุดคือการใช้ css

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

ใช้/\S+/gเพื่อสนับสนุนกำกับออกเสียง:

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

อย่างไรก็ตาม " s unshine ( Y ellow)" ⇒ " S unshine ( Y ellow)"

ฉันต้องการที่จะเพิ่มคำตอบของตัวเองเพราะฉันต้องการtoTitleCaseฟังก์ชั่นที่มีประสิทธิภาพซึ่งคำนึงถึงกฎไวยากรณ์ที่ระบุไว้ที่นี่ (บทความแนะนำจาก Google) มีกฎต่าง ๆ ที่ขึ้นอยู่กับความยาวของสายป้อน ด้านล่างเป็นการทดสอบฟังก์ชั่น + หน่วย

ฟังก์ชั่นนี้ยังรวมถึงช่องว่างและลบอักขระพิเศษ (แก้ไข regex สำหรับความต้องการของคุณ)

ฟังก์ชัน toTitleCase

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

ทดสอบหน่วยเพื่อให้แน่ใจว่าถูกต้อง

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

โปรดทราบว่าฉันกำลังลบตัวอักขระพิเศษออกเล็กน้อยจากสตริงที่ให้ไว้ คุณจะต้องปรับแต่ง regex เพื่อตอบสนองความต้องการของโครงการของคุณ

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

การใช้โซลูชัน "lewax00" ฉันสร้างโซลูชันง่าย ๆ นี้ที่บังคับให้ "w" เริ่มต้นด้วยช่องว่างหรือ "w" ที่เริ่มต้นคำ แต่ไม่สามารถลบช่องว่างกลางพิเศษ

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

ผลลัพธ์คือ "Sofía Vergara"

นี่คือฟังก์ชั่นของฉันที่ดูแลตัวละครที่เน้นเสียง (สำคัญสำหรับภาษาฝรั่งเศส!) และสามารถเปิด / ปิดการจัดการข้อยกเว้นที่ลดลงได้ หวังว่าจะช่วย

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

เราได้มีการพูดคุยกันที่นี่ที่สำนักงานและเราคิดว่าการพยายามแก้ไขชื่อผู้ใช้ให้เป็นปัจจุบันในแบบที่คุณต้องการโดยอัตโนมัตินั้นเต็มไปด้วยปัญหาที่อาจเกิดขึ้น

เรามีหลายกรณีที่การใช้ตัวพิมพ์ใหญ่แบบอัตโนมัติแตกต่างกันและนี่เป็นเพียงชื่อภาษาอังกฤษเพียงอย่างเดียวแต่ละภาษามีความซับซ้อนของตัวเอง

ปัญหาเกี่ยวกับการใช้อักษรตัวใหญ่ของชื่อแต่ละตัว:

•คำย่อเช่น IBM ไม่ได้รับอนุญาตให้ป้อนเข้าจะกลายเป็น IBM

•ชื่อ McDonald จะกลายเป็น Mcdonald ซึ่งไม่ถูกต้องสิ่งเดียวกันคือ MacDonald เช่นกัน

•ชื่อที่ลำกล้องสองครั้งเช่น Marie-Tonks จะกลายเป็น Marie-tonks

•ชื่ออย่าง O'Connor จะกลายเป็น O'connor

สำหรับสิ่งเหล่านี้ส่วนใหญ่คุณสามารถเขียนกฎที่กำหนดเองเพื่อจัดการกับมันอย่างไรก็ตามสิ่งนี้ยังคงมีปัญหาเกี่ยวกับตัวย่อเหมือนเมื่อก่อนและคุณจะได้รับปัญหาใหม่:

•การเพิ่มกฎเพื่อแก้ไขชื่อด้วย Mac เช่น MacDonald ชื่อตัวแบ่งเช่น Macy จะเปลี่ยนเป็น MacY

ทางออกเดียวที่เราเกิดขึ้นกับสิ่งที่ไม่ถูกต้องก็คือการใช้ประโยชน์จากตัวอักษรทุกตัวซึ่งเป็นวิธีบังคับเดรัจฉานที่ DBS ใช้

ดังนั้นหากคุณต้องการทำให้กระบวนการเป็นไปโดยอัตโนมัติมันเป็นเรื่องที่เป็นไปไม่ได้ที่จะทำโดยไม่มีพจนานุกรมของชื่อและคำทุกคำและมันควรจะเป็นตัวพิมพ์ใหญ่อย่างไรถ้าคุณไม่มีกฎที่ครอบคลุมทุกอย่างไม่ใช้มัน จะรบกวนผู้ใช้ของคุณและแจ้งให้ผู้ที่ต้องการป้อนชื่ออย่างถูกต้องเพื่อไปที่อื่น

นี่คือวิธีแก้ไขปัญหาอื่นโดยใช้ css (และ javascript หากข้อความที่คุณต้องการแปลงเป็นตัวพิมพ์ใหญ่):

HTML

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

js

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

CSS

#text{text-transform:capitalize;}

สำหรับพวกเราที่กลัวการแสดงออกปกติ (หัวเราะ):

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

โซลูชันบรรทัดเดียวของฉัน:

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

จากนั้นคุณสามารถเรียกใช้เมธอดcapitalizeWords()บนสตริงใดก็ได้ ตัวอย่างเช่น:

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

>>> This Actually Works

โซลูชันอื่นของฉัน:

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

จากนั้นคุณสามารถเรียกใช้เมธอดcapitalizeWords()บนสตริงใดก็ได้ ตัวอย่างเช่น:

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

>>> This One Works Too

โซลูชันทางเลือกที่อิงตามคำตอบของ Greg Dean:

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

จากนั้นคุณสามารถเรียกใช้เมธอดcapitalizeWords()บนสตริงใดก็ได้ ตัวอย่างเช่น:

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

>>> Yes And No

แปลกใจที่ไม่มีใครพูดถึงการใช้พารามิเตอร์ที่เหลือ นี่คือซับง่ายๆหนึ่งที่ใช้พารามิเตอร์ ES6 Rest

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

สิ่งนี้ขึ้นอยู่กับโซลูชันของฉันสำหรับ"ชื่อคดี" ของกองไฟซึ่งเป็น FreeCodeCampซึ่งคุณต้องแปลงสตริงที่กำหนดให้เป็นตัวพิมพ์เล็กทั้งหมดก่อนแล้วจึงแปลงอักขระทุกตัวที่ดำเนินการเว้นวรรคเป็นตัวพิมพ์ใหญ่

โดยไม่ใช้ regex:

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