ฉันจะแปลงสตริงเช่น 'helloThere' หรือ 'HelloThere' เป็น 'Hello There' ใน JavaScript ได้อย่างไร
ฉันจะแปลงสตริงเช่น 'helloThere' หรือ 'HelloThere' เป็น 'Hello There' ใน JavaScript ได้อย่างไร
คำตอบ:
var text = 'helloThereMister';
var result = text.replace( /([A-Z])/g, " $1" );
var finalResult = result.charAt(0).toUpperCase() + result.slice(1);
console.log(finalResult);
ใช้อักษรตัวแรกให้เป็นตัวพิมพ์ใหญ่ - เป็นตัวอย่าง
" $1"
หมายเหตุพื้นที่ใน
แก้ไข: เพิ่มตัวอย่างการใช้อักษรตัวพิมพ์ใหญ่ของตัวอักษรตัวแรก แน่นอนว่าในกรณีที่อักษรตัวแรกเป็นตัวพิมพ์ใหญ่ - คุณจะมีพื้นที่ว่างในการลบ
text.replace
ฉันได้รับการขยายฟังก์ชั่นการโทรด้วย 2 + ข้อโต้แย้งที่มีช่องว่างสำหรับการอ่านด้วย
Non-GoogleChrome
ล่ะ
อีกทางเลือกหนึ่งโดยใช้lodash :
lodash.startCase(str);
ตัวอย่าง:
_.startCase('helloThere');
// ➜ 'Hello There'
Lodash เป็นห้องสมุดที่ดีที่จะให้ทางลัดไปยังหลาย ๆ ในชีวิตประจำวัน js tasks.There กำลังฟังก์ชั่นอื่น ๆ อีกมากมายที่คล้ายกันสตริงการจัดการเช่นcamelCase
, kebabCase
ฯลฯ
hello world
แล้วเอาท์พุทควรจะเป็นHello There
ในกรณีนี้โหลดจะไม่เป็นประโยชน์
hello world
เป็นHello World
lodash.com/docs/4.17.15#upperFirst
hello there
hello world
ฉันมีปัญหาที่คล้ายกันและจัดการกับมันเช่นนี้:
stringValue.replace(/([A-Z]+)*([A-Z][a-z])/g, "$1 $2")
สำหรับโซลูชันที่แข็งแกร่งยิ่งขึ้น:
stringValue.replace(/([A-Z]+)/g, " $1").replace(/([A-Z][a-z])/g, " $1")
การป้อนข้อมูล:
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());
สตริงที่ดีที่สุดที่ฉันได้พบสำหรับการทดสอบฟังก์ชั่นอูฐกรณีเพื่อชื่อเรื่องเป็นตัวอย่างที่ไร้สาระนี้น่าขันที่ทดสอบกรณีขอบจำนวนมาก เพื่อความรู้ที่ดีที่สุดของฉันไม่มีฟังก์ชั่นที่โพสต์ก่อนหน้านี้จัดการอย่างถูกต้อง :
ToGetYourGEDInTimeASongAboutThe26ABCsIsOfTheEssenceButAPersonalIDCardForUser456InRoom26AContainingABC26TimesIsNotAsEasyAs123ForC3POOrR2D2Or2R2D
ควรแปลงเป็น:
เพื่อให้ได้ GED ของคุณทันเวลาเพลงเกี่ยวกับ 26 ABCs เป็นสิ่งสำคัญ แต่บัตรประจำตัวส่วนบุคคลสำหรับผู้ใช้ 456 ในห้อง 26A ที่มี ABC 26 ครั้งไม่ง่ายเหมือน 123 สำหรับ C3PO หรือ R2D2 หรือ 2R2D
หากคุณต้องการฟังก์ชั่นง่าย ๆ ที่จัดการเคสเช่นเดียวกับข้างบน (และอีกหลายกรณีมากกว่าคำตอบก่อนหน้านี้) นี่คือสิ่งที่ฉันเขียน รหัสนี้ไม่ได้สวยงามหรือเร็วนัก แต่มันเข้าใจง่ายและใช้งานได้ดี
ตัวอย่าง Runnable ออนไลน์อยู่ใน 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)));
จากหนึ่งในตัวอย่างข้างต้นฉันพบสิ่งนี้:
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
ตกลงฉันไปไม่กี่ปีที่ผ่านมากับเกม แต่ฉันมีคำถามที่คล้ายกันและฉันต้องการที่จะแก้ปัญหาหนึ่งแทนสำหรับทุกการป้อนข้อมูลที่เป็นไปได้ ฉันจะต้องให้มากที่สุดของการให้สินเชื่อกับ @ZenMaster ในหัวข้อนี้และ @Benjamin Udink สิบ Cate ในนี้ด้าย นี่คือรหัส:
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);
}
มันมีสามส่วนทั้งหมดที่ใช้lookaheadเพื่อป้องกันเอ็นจิน regex ไม่ให้ใช้อักขระมากเกินไป:
[A-Z](?=[A-Z][a-z])
มองหาอักษรตัวใหญ่ที่ตามด้วยตัวพิมพ์ใหญ่แล้วตัวพิมพ์เล็ก นี่คือการจบคำย่อเช่นสหรัฐอเมริกา[^A-Z](?=[A-Z])
ค้นหาตัวอักษรที่ไม่ใช่ตัวพิมพ์ใหญ่ตามด้วยตัวพิมพ์ใหญ่ คำนี้ลงท้ายด้วย myWord และสัญลักษณ์เช่น 99Bottles[a-zA-Z](?=[^a-zA-Z])
มองหาตัวอักษรตามด้วยตัวอักษรที่ไม่ใช่ นี่จบคำก่อนสัญลักษณ์เช่น BFG9000คำถามนี้อยู่ที่ด้านบนสุดของผลการค้นหาของฉันดังนั้นหวังว่าฉันจะประหยัดเวลาได้บ้าง
นี่คือเวอร์ชั่นของฉัน มันเพิ่มช่องว่างก่อนตัวอักษรภาษาอังกฤษ UpperCase ทุกตัวที่มาหลังตัวอักษรภาษาอังกฤษตัวพิมพ์เล็กและยังพิมพ์ตัวอักษรตัวใหญ่ถ้าจำเป็น:
ตัวอย่างเช่น:
thisIsCamelCase -> นี่คือกรณีอูฐ
IsCamelCase นี้ -> นี่คือกรณีอูฐ
thisIsCamelCase123 -> นี่คือกรณีอูฐ 123
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/
" helloWorld"
ตัวอย่างเช่น
ลองห้องสมุดนี้
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"); // ส่งคืนชื่อของฉัน
function CamelcaseToWord(string){
return string.replace(/([A-Z]+)/g, " $1").replace(/([A-Z][a-z])/g, " $1");
}
string.replace(/([A-Z]+)/g, " $1").replace(/([A-Z][a-z])/g, "$1");
ผมคิดว่านี้สามารถทำได้เพียงกับประสบการณ์ reg และการเปลี่ยน/([a-z]|[A-Z]+)([A-Z])/g
"$1 $2"
ILoveTheUSADope -> ฉันรักยาเสพติดของอเมริกา
QWERTY
QWERT Y
หากคุณจัดการกับ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(),
'')
ด้านล่างคือลิงค์ที่แสดงให้เห็นถึงสตริงตัวพิมพ์ใหญ่ - เล็กโดยใช้ regex
myCamelCaseSTRINGToSPLITDemo
my Camel Case STRING To SPLIT Demo
นี่คือ regex สำหรับการแปลงเคสอูฐเป็นข้อความประโยค
(?=[A-Z][a-z])|([A-Z]+)([A-Z][a-rt-z][a-z]\*)
ด้วย$1 $2
เป็น subsitution
อินพุต 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
respace(str) {
const regex = /([A-Z])(?=[A-Z][a-z])|([a-z])(?=[A-Z])/g;
return str.replace(regex, '$& ');
}
RegEx ด้านบนประกอบด้วยสองส่วนที่คล้ายกันคั่นด้วยตัวดำเนินการOR ครึ่งแรก:
([A-Z])
- จับคู่ตัวอักษรตัวพิมพ์ใหญ่ ...(?=[A-Z][a-z])
- ตามด้วยตัวอักษรตัวพิมพ์ใหญ่และตัวพิมพ์เล็กเมื่อนำไปใช้กับลำดับFOoสิ่งนี้ตรงกับตัวอักษรFของมันได้อย่างมีประสิทธิภาพ
หรือสถานการณ์ที่สอง:
([a-z])
- จับคู่ตัวอักษรพิมพ์เล็ก ...(?=[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(' ');