camelCaseTextを文のケーステキストに変換

JavaScriptで「helloThere」または「HelloThere」などの文字列を「Hello There」に変換するにはどうすればよいですか？

var text = 'helloThereMister';
var result = text.replace( /([A-Z])/g, " $1" );
var finalResult = result.charAt(0).toUpperCase() + result.slice(1);
console.log(finalResult);

最初の文字を大文字にします-例として。

のスペースに注意してください" $1"。

編集：最初の文字の大文字化の例を追加しました。もちろん、最初の文字がすでに大文字である場合-削除するための予備のスペースがあります。

または、lodashを使用します。

lodash.startCase(str);

例：

_.startCase('helloThere');
// ➜ 'Hello There'

Lodashは、多くの日常のjsタスクへのショートカットを提供する素晴らしいライブラリです。などcamelCase、他にも多くの類似した文字列操作関数がありますkebabCase。

同様の問題があり、次のように対処しました。

stringValue.replace(/([A-Z]+)*([A-Z][a-z])/g, "$1 $2")

より堅牢なソリューションの場合：

stringValue.replace(/([A-Z]+)/g, " $1").replace(/([A-Z][a-z])/g, " $1")

http://jsfiddle.net/PeYYQ/

入力：

 helloThere 
 HelloThere 
 ILoveTheUSA
 iLoveTheUSA

出力：

 hello There 
 Hello There 
 I Love The USA
 i Love The USA

副作用のない例。

function camel2title(camelCase) {
  // no side-effects
  return camelCase
    // inject space before the upper case letters
    .replace(/([A-Z])/g, function(match) {
       return " " + match;
    })
    // replace first char with upper case
    .replace(/^./, function(match) {
      return match.toUpperCase();
    });
}

ES6内

const camel2title = (camelCase) => camelCase
  .replace(/([A-Z])/g, (match) => ` ${match}`)
  .replace(/^./, (match) => match.toUpperCase());

camel-case-to-title-case関数をテストするために私が見つけた最良の文字列は、このばかげて無意味な例で、多くのエッジケースをテストしています。私の知る限りでは、以前に投稿された関数はこれを正しく処理していません：

ToGetYourGEDInTimeASongAboutThe26ABCsIsOfTheEssenceButAPersonalIDCardForUser456InRoom26AContainingABC26TimesIsNotAsEasyAs123ForC3POOrR2D2Or2R2D

これは次のように変換する必要があります：

ABCの26曲ほどの曲を時間内に入手することは本質ですが、ABCを含む26Aの部屋26Aのユーザー456の個人IDカードは、C3POまたはR2D2または2R2Dの123ほど簡単ではありません

上記のようなケース（および以前の多くの回答よりも多くのケース）を処理する単純な関数が必要な場合は、これが私が書いたものです。このコードは特にエレガントでも高速でもありませんが、シンプルで理解しやすく、機能します。

オンライン実行可能な例はjsfiddle上にある、またはあなたのコンソールで以下のスニペットの出力を表示することができます。

// Take a single camel case string and convert it to a string of separate words (with spaces) at the camel-case boundaries.
// 
// E.g.:
var examples = [
    'ToGetYourGEDInTimeASongAboutThe26ABCsIsOfTheEssenceButAPersonalIDCardForUser456InRoom26AContainingABC26TimesIsNotAsEasyAs123ForC3POOrR2D2Or2R2D',
    //                                          --> To Get Your GED In Time A Song About The 26 ABCs Is Of The Essence But A Personal ID Card For User 456 In Room 26A Containing ABC 26 Times Is Not As Easy As 123 For C3PO Or R2D2 Or 2R2D
    'helloThere', //                              --> Hello There
    'HelloThere', //                              --> Hello There
    'ILoveTheUSA', //                             --> I Love The USA
    'iLoveTheUSA', //                             --> I Love The USA
    'DBHostCountry', //                           --> DB Host Country
    'SetSlot123ToInput456', //                    --> Set Slot 123 To Input 456
    'ILoveTheUSANetworkInTheUSA', //              --> I Love The USA Network In The USA
    'Limit_IOC_Duration', //                      --> Limit IOC Duration
    'This_is_a_Test_of_Network123_in_12_days', // --> This Is A Test Of Network 123 In 12 Days
    'ASongAboutTheABCsIsFunToSing', //            --> A Song About The ABCs Is Fun To Sing
    'CFDs', //                                    --> CFDs
    'DBSettings', //                              --> DB Settings
    'IWouldLove1Apple', //                        --> 1 Would Love 1 Apple
    'Employee22IsCool', //                        --> Employee 22 Is Cool
    'SubIDIn', //                                 --> Sub ID In
    'ConfigureCFDsImmediately', //                --> Configure CFDs Immediately
    'UseTakerLoginForOnBehalfOfSubIDInOrders', // --> Use Taker Login For On Behalf Of Sub ID In Orders
]

function camelCaseToTitleCase(in_camelCaseString) {
        var result = in_camelCaseString                         // "ToGetYourGEDInTimeASongAboutThe26ABCsIsOfTheEssenceButAPersonalIDCardForUser456InRoom26AContainingABC26TimesIsNotAsEasyAs123ForC3POOrR2D2Or2R2D"
            .replace(/([a-z])([A-Z][a-z])/g, "$1 $2")           // "To Get YourGEDIn TimeASong About The26ABCs IsOf The Essence ButAPersonalIDCard For User456In Room26AContainingABC26Times IsNot AsEasy As123ForC3POOrR2D2Or2R2D"
            .replace(/([A-Z][a-z])([A-Z])/g, "$1 $2")           // "To Get YourGEDIn TimeASong About The26ABCs Is Of The Essence ButAPersonalIDCard For User456In Room26AContainingABC26Times Is Not As Easy As123ForC3POOr R2D2Or2R2D"
            .replace(/([a-z])([A-Z]+[a-z])/g, "$1 $2")          // "To Get Your GEDIn Time ASong About The26ABCs Is Of The Essence But APersonal IDCard For User456In Room26AContainingABC26Times Is Not As Easy As123ForC3POOr R2D2Or2R2D"
            .replace(/([A-Z]+)([A-Z][a-z][a-z])/g, "$1 $2")     // "To Get Your GEDIn Time A Song About The26ABCs Is Of The Essence But A Personal ID Card For User456In Room26A ContainingABC26Times Is Not As Easy As123ForC3POOr R2D2Or2R2D"
            .replace(/([a-z]+)([A-Z0-9]+)/g, "$1 $2")           // "To Get Your GEDIn Time A Song About The 26ABCs Is Of The Essence But A Personal ID Card For User 456In Room 26A Containing ABC26Times Is Not As Easy As 123For C3POOr R2D2Or 2R2D"
            
            // Note: the next regex includes a special case to exclude plurals of acronyms, e.g. "ABCs"
            .replace(/([A-Z]+)([A-Z][a-rt-z][a-z]*)/g, "$1 $2") // "To Get Your GED In Time A Song About The 26ABCs Is Of The Essence But A Personal ID Card For User 456In Room 26A Containing ABC26Times Is Not As Easy As 123For C3PO Or R2D2Or 2R2D"
            .replace(/([0-9])([A-Z][a-z]+)/g, "$1 $2")          // "To Get Your GED In Time A Song About The 26ABCs Is Of The Essence But A Personal ID Card For User 456In Room 26A Containing ABC 26Times Is Not As Easy As 123For C3PO Or R2D2Or 2R2D"  

            // Note: the next two regexes use {2,} instead of + to add space on phrases like Room26A and 26ABCs but not on phrases like R2D2 and C3PO"
            .replace(/([A-Z]{2,})([0-9]{2,})/g, "$1 $2")        // "To Get Your GED In Time A Song About The 26ABCs Is Of The Essence But A Personal ID Card For User 456 In Room 26A Containing ABC 26 Times Is Not As Easy As 123 For C3PO Or R2D2 Or 2R2D"
            .replace(/([0-9]{2,})([A-Z]{2,})/g, "$1 $2")        // "To Get Your GED In Time A Song About The 26 ABCs Is Of The Essence But A Personal ID Card For User 456 In Room 26A Containing ABC 26 Times Is Not As Easy As 123 For C3PO Or R2D2 Or 2R2D"
            .trim();


  // capitalize the first letter
  return result.charAt(0).toUpperCase() + result.slice(1);
}

examples.forEach(str => console.log(str, ' --> \n', camelCaseToTitleCase(str)));

上記の例の1つに基づいて、私はこれを思い付きました：

const camelToTitle = (camelCase) => camelCase
  .replace(/([A-Z])/g, (match) => ` ${match}`)
  .replace(/^./, (match) => match.toUpperCase())
  .trim()

それは使用するので私にとってはうまくいきます .trim()最初の文字が大文字になっていて、余分な先行スペースが、大文字と小文字の区別を処理するするはうまくいきます。

リファレンス：https : //developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/Trim

わかりました、私はゲームに数年遅れていますが、同様の質問があり、可能なすべての入力に対して1つの置換ソリューションを作りたかったのです。私はこのスレッドで@ZenMasterと@Benjamin Udink 10ケイトへの信用のほとんどを与える必要があり、このスレッド。これがコードです：

var camelEdges = /([A-Z](?=[A-Z][a-z])|[^A-Z](?=[A-Z])|[a-zA-Z](?=[^a-zA-Z]))/g;
var textArray = ["lowercase",
                 "Class",
                 "MyClass",
                 "HTML",
                 "PDFLoader",
                 "AString",
                 "SimpleXMLParser",
                 "GL11Version",
                 "99Bottles",
                 "May5",
                 "BFG9000"];
var text;
var resultArray = [];
for (var i = 0; i < a.length; i++){
    text = a[i];
    text = text.replace(camelEdges,'$1 ');
    text = text.charAt(0).toUpperCase() + text.slice(1);
    resultArray.push(text);
}

これには3つの句があり、いずれも先読みを使用して正規表現エンジンが文字を使いすぎないようにします。

1. [A-Z](?=[A-Z][a-z])大文字の後に小文字が続く大文字を探します。これは米国のような頭字語を終わらせることです。
2. [^A-Z](?=[A-Z])大文字以外の大文字以外の文字を探します。これで、myWordのような単語と99Bottlesのような記号が終了します。
3. [a-zA-Z](?=[^a-zA-Z])文字の後に文字以外の文字を探します。これは、BFG9000のような記号の前の単語を終了します。

この質問は私の検索結果の一番上にあったので、うまくいけば私は他の人を少し時間を節約できます！

これが私のバージョンです。小文字の英字の後に続くすべての大文字の英字の前にスペースを追加し、必要に応じて最初の文字も大文字にします。

例：
thisIsCamelCase->これはキャメルケース
this IsCamelCase->これはキャメルケース
thisIsCamelCase123->これはキャメルCase123

  function camelCaseToTitleCase(camelCase){
    if (camelCase == null || camelCase == "") {
      return camelCase;
    }

    camelCase = camelCase.trim();
    var newText = "";
    for (var i = 0; i < camelCase.length; i++) {
      if (/[A-Z]/.test(camelCase[i])
          && i != 0
          && /[a-z]/.test(camelCase[i-1])) {
        newText += " ";
      }
      if (i == 0 && /[a-z]/.test(camelCase[i]))
      {
        newText += camelCase[i].toUpperCase();
      } else {
        newText += camelCase[i];
      }
    }

    return newText;
  }

この実装では、大文字と数字が連続して考慮されます。

function camelToTitleCase(str) {
  return str
    .replace(/[0-9]{2,}/g, match => ` ${match} `)
    .replace(/[^A-Z0-9][A-Z]/g, match => `${match[0]} ${match[1]}`)
    .replace(/[A-Z][A-Z][^A-Z0-9]/g, match => `${match[0]} ${match[1]}${match[2]}`)
    .replace(/[ ]{2,}/g, match => ' ')
    .replace(/\s./g, match => match.toUpperCase())
    .replace(/^./, match => match.toUpperCase())
    .trim();
}

// ----------------------------------------------------- //

var testSet = [
    'camelCase',
    'camelTOPCase',
    'aP2PConnection',
    'superSimpleExample',
    'aGoodIPAddress',
    'goodNumber90text',
    'bad132Number90text',
];

testSet.forEach(function(item) {
    console.log(item, '->', camelToTitleCase(item));
});

予想される出力：

camelCase -> Camel Case
camelTOPCase -> Camel TOP Case
aP2PConnection -> A P2P Connection
superSimpleExample -> Super Simple Example
aGoodIPAddress -> A Good IP Address
goodNumber90text -> Good Number 90 Text
bad132Number90text -> Bad 132 Number 90 Text

次のような関数を使用できます。

function fixStr(str) {
    var out = str.replace(/^\s*/, "");  // strip leading spaces
    out = out.replace(/^[a-z]|[^\s][A-Z]/g, function(str, offset) {
        if (offset == 0) {
            return(str.toUpperCase());
        } else {
            return(str.substr(0,1) + " " + str.substr(1).toUpperCase());
        }
    });
    return(out);
}

"hello World" ==> "Hello World"
"HelloWorld" ==> "Hello World"
"FunInTheSun" ==? "Fun In The Sun"

ここに一連のテスト文字列を記述したコード：http : //jsfiddle.net/jfriend00/FWLuV/。

ここに先行スペースを保持する代替バージョン：http : //jsfiddle.net/jfriend00/Uy2ac/。

このライブラリを試す

http://sugarjs.com/api/String/titleize

'man from the boondocks'.titleize()>"Man from the Boondocks"
'x-men: the last stand'.titleize()>"X Men: The Last Stand"
'TheManWithoutAPast'.titleize()>"The Man Without a Past"
'raiders_of_the_lost_ark'.titleize()>"Raiders of the Lost Ark"

上記の答えはどれも完璧に機能しなかったため、自転車を用意する必要がありました。

function camelCaseToTitle(camelCase) {
    if (!camelCase) {
        return '';
    }

    var pascalCase = camelCase.charAt(0).toUpperCase() + camelCase.substr(1);
    return pascalCase
        .replace(/([a-z])([A-Z])/g, '$1 $2')
        .replace(/([A-Z])([A-Z][a-z])/g, '$1 $2')
        .replace(/([a-z])([0-9])/gi, '$1 $2')
        .replace(/([0-9])([a-z])/gi, '$1 $2');
}

テストケース：

null => ''
'' => ''
'simpleString' => 'Simple String'
'stringWithABBREVIATIONInside => 'String With ABBREVIATION Inside'
'stringWithNumber123' => 'String With Number 123'
'complexExampleWith123ABBR890Etc' => 'Complex Example With 123 ABBR 890 Etc'

これは私にとってはうまくいきます

CamelcaseToWord（ "MyName"）; // My Nameを返します

    function CamelcaseToWord(string){
      return string.replace(/([A-Z]+)/g, " $1").replace(/([A-Z][a-z])/g, " $1");
    }

これは、正規表現/([a-z]|[A-Z]+)([A-Z])/gと置換だけで実行できると思います"$1 $2"。

ILoveTheUSADope-> I Love The USA Dope

Capital Camel Caseを処理する場合、このスニペットが役立ちます。また、いくつかの仕様が含まれているため、ケースに適切に一致することを確認できます。

export const fromCamelCaseToSentence = (word) =>
  word
    .replace(/([A-Z][a-z]+)/g, ' $1')
    .replace(/([A-Z]{2,})/g, ' $1')
    .replace(/\s{2,}/g, ' ')
    .trim();

そしてスペック：

describe('fromCamelCaseToSentence', () => {
 test('does not fall with a single word', () => {
   expect(fromCamelCaseToSentence('Approved')).toContain('Approved')
   expect(fromCamelCaseToSentence('MDA')).toContain('MDA')
 })

 test('does not fall with an empty string', () => {
   expect(fromCamelCaseToSentence('')).toContain('')
 })

 test('returns the separated by space words', () => {
   expect(fromCamelCaseToSentence('NotApprovedStatus')).toContain('Not Approved Status')
   expect(fromCamelCaseToSentence('GDBState')).toContain('GDB State')
   expect(fromCamelCaseToSentence('StatusDGG')).toContain('Status DGG')
 })
})

私は全員の答えを試したわけではありませんが、いじくり回したいくつかのソリューションは私の要件のすべてに一致しませんでした。

私は何かを思いつくことができました...

export const jsObjToCSSString = (o={}) =>
    Object.keys(o)
          .map(key => ({ key, value: o[key] }))
          .map(({key, value}) =>
              ({
                key: key.replace( /([A-Z])/g, "-$1").toLowerCase(),
                value
              })
          )
          .reduce(
              (css, {key, value}) => 
                  `${css} ${key}: ${value}; `.trim(), 
              '')

以下は、正規表現を使用してキャメルケース文字列を文文字列に示すリンクです。

入力

myCamelCaseSTRINGToSPLITDemo

出力

my Camel Case STRING To SPLIT Demo

これは、キャメルケースを文章テキストに変換するための正規表現です

(?=[A-Z][a-z])|([A-Z]+)([A-Z][a-rt-z][a-z]\*)

と $1 $2subsitutionとして。

クリックして正規表現の変換を表示します

入力 javascript

出力 Javaスクリプト

   var text = 'javaScript';
    text.replace(/([a-z])([A-Z][a-z])/g, "$1 $2").charAt(0).toUpperCase()+text.slice(1).replace(/([a-z])([A-Z][a-z])/g, "$1 $2");

RegExに基づくもう1つのソリューション。

respace(str) {
  const regex = /([A-Z])(?=[A-Z][a-z])|([a-z])(?=[A-Z])/g;
  return str.replace(regex, '$& ');
}

説明

上記のRegExは、OR演算子で区切られた2つの類似した部分で構成されています。前半：

1. ([A-Z]) -大文字に一致します...
2. (?=[A-Z][a-z]) -大文字と小文字のシーケンスが続きます。

これをシーケンスFOoに適用すると、F文字と実質的に一致します。

または2番目のシナリオ：

1. ([a-z]) -小文字に一致します...
2. (?=[A-Z]) -大文字が続きます。

シーケンスbarFooに適用すると、これは実質的にそのrに一致します文字とます。

すべての置換候補が見つかった場合、最後に行うことは、それらを同じ文字で追加のスペース文字に置き換えることです。このため'$& '、置換として使用でき、一致した部分文字列とそれに続くスペース文字に解決されます。

例

const regex = /([A-Z])(?=[A-Z][a-z])|([a-z])(?=[A-Z])/g
const testWords = ['ACoolExample', 'fooBar', 'INAndOUT', 'QWERTY', 'fooBBar']

testWords.map(w => w.replace(regex, '$& '))
->(5) ["A Cool Example", "foo Bar", "IN And OUT", "QWERTY", "foo B Bar"]

上記のいくつかの考えに満足できなかった後、私がさらに気に入った別のES6ソリューションを追加します。

https://codepen.io/902Labs/pen/mxdxRv?editors=0010#0

const camelize = (str) => str
    .split(' ')
    .map(([first, ...theRest]) => (
        `${first.toUpperCase()}${theRest.join('').toLowerCase()}`)
    )
    .join(' ');