如何使用 javascript 正则表达式将字符串转换为驼峰式大小写?
EquipmentClass name
或 Equipment className
或 equipment class name
或 Equipment Class Name
应该都变成:equipmentClassName
。
查看您的代码,您只需两个 replace
调用即可实现它:
function camelize(str) {
return str.replace(/(?:^\w|[A-Z]|\b\w)/g, function(word, index) {
return index === 0 ? word.toLowerCase() : word.toUpperCase();
}).replace(/\s+/g, '');
}
camelize("EquipmentClass name");
camelize("Equipment className");
camelize("equipment class name");
camelize("Equipment Class Name");
// all output "equipmentClassName"
编辑: 或通过单个 replace
调用,同时捕获 RegExp
中的空白。
function camelize(str) {
return str.replace(/(?:^\w|[A-Z]|\b\w|\s+)/g, function(match, index) {
if (+match === 0) return ""; // or if (/\s+/.test(match)) for white spaces
return index === 0 ? match.toLowerCase() : match.toUpperCase();
});
}
如果有人在使用 lodash,则有一个 _.camelCase()
函数。
_.camelCase('Foo Bar');
// → 'fooBar'
_.camelCase('--foo-bar--');
// → 'fooBar'
_.camelCase('__FOO_BAR__');
// → 'fooBar'
lodash.camelcase
之类的 per method packages 代替(此后已被弃用) 4)您可以通过实现摇树来缓解大型捆绑
获取camelCase
ES5
var camalize = function camalize(str) {
return str.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, function(match, chr)
{
return chr.toUpperCase();
});
}
ES6
var camalize = function camalize(str) {
return str.toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase());
}
var camelSentence = function camelSentence(str) {
return (" " + str).toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, function(match, chr)
{
return chr.toUpperCase();
});
}
注意:
对于那些带有口音的语言。请务必在正则表达式中包含 À-ÖØ-öø-ÿ
,如下所示
.replace(/[^a-zA-ZÀ-ÖØ-öø-ÿ0-9]+(.)/g
这仅适用于一种语言。对于另一种语言,您必须搜索并找到
https://stackoverflow.com/posts/52551910/revisions
ES6,我还没有测试过。我会检查并更新。
OneTwo
,应该是 oneTwo
。在我的回答中正常工作;)
我刚结束这样做:
String.prototype.toCamelCase = function(str) {
return str
.replace(/\s(.)/g, function($1) { return $1.toUpperCase(); })
.replace(/\s/g, '')
.replace(/^(.)/, function($1) { return $1.toLowerCase(); });
}
我试图避免将多个替换语句链接在一起。我的函数中有 1 美元、2 美元、3 美元的东西。但是这种类型的分组很难理解,你提到的跨浏览器问题也是我从未想过的。
this.valueOf()
而不是传递 str
。或者(在我的情况下)this.toLowerCase()
因为我的输入字符串全部大写,没有正确小写非驼峰部分。仅使用 this
返回字符串对象本身,它实际上是一个 char 数组,因此是上面提到的 TypeError。
您可以使用此解决方案:
function toCamelCase(str){
return str.split(' ').map(function(word,index){
// If it is the first word make sure to lowercase all the chars.
if(index == 0){
return word.toLowerCase();
}
// If it is not the first word only upper case the first char and lowercase the rest.
return word.charAt(0).toUpperCase() + word.slice(1).toLowerCase();
}).join('');
}
toCamelCase
函数就是这样做的。
在斯科特的具体情况下,我会选择类似的东西:
String.prototype.toCamelCase = function() {
return this.replace(/^([A-Z])|\s(\w)/g, function(match, p1, p2, offset) {
if (p2) return p2.toUpperCase();
return p1.toLowerCase();
});
};
'EquipmentClass name'.toCamelCase() // -> equipmentClassName
'Equipment className'.toCamelCase() // -> equipmentClassName
'equipment class name'.toCamelCase() // -> equipmentClassName
'Equipment Class Name'.toCamelCase() // -> equipmentClassName
正则表达式将匹配第一个字符,如果它以大写字母开头,并且任何字母字符后跟一个空格,即指定字符串中的 2 或 3 次。
通过将正则表达式添加到 /^([A-Z])|[\s-_](\w)/g
,它还将使连字符和下划线类型名称驼峰化。
'hyphen-name-format'.toCamelCase() // -> hyphenNameFormat
'underscore_name_format'.toCamelCase() // -> underscoreNameFormat
+
),即:/^([A-Z])|[\s-_]+(\w)/g
可靠的高性能示例:
function camelize(text) {
text = text.replace(/[-_\s.]+(.)?/g, (_, c) => c ? c.toUpperCase() : '');
return text.substring(0, 1).toLowerCase() + text.substring(1);
}
大小写转换字符:
连字符 -
下划线_
时期 。
空间
function toCamelCase(str) {
// Lower cases the string
return str.toLowerCase()
// Replaces any - or _ characters with a space
.replace( /[-_]+/g, ' ')
// Removes any non alphanumeric characters
.replace( /[^\w\s]/g, '')
// Uppercases the first character in each group immediately following a space
// (delimited by spaces)
.replace( / (.)/g, function($1) { return $1.toUpperCase(); })
// Removes spaces
.replace( / /g, '' );
}
我试图找到一个 camelCase
字符串的 JavaScript 函数,并想确保删除特殊字符(我无法理解上面的一些答案在做什么)。这是基于 cc young 的回答,添加了注释并删除了 $peci&l 字符。
如果不需要正则表达式,您可能需要查看我很久以前为 Twinkle 编写的以下代码:
String.prototype.toUpperCaseFirstChar = function() {
return this.substr( 0, 1 ).toUpperCase() + this.substr( 1 );
}
String.prototype.toLowerCaseFirstChar = function() {
return this.substr( 0, 1 ).toLowerCase() + this.substr( 1 );
}
String.prototype.toUpperCaseEachWord = function( delim ) {
delim = delim ? delim : ' ';
return this.split( delim ).map( function(v) { return v.toUpperCaseFirstChar() } ).join( delim );
}
String.prototype.toLowerCaseEachWord = function( delim ) {
delim = delim ? delim : ' ';
return this.split( delim ).map( function(v) { return v.toLowerCaseFirstChar() } ).join( delim );
}
我还没有进行任何性能测试,正则表达式版本可能会也可能不会更快。
我的 ES6 方法:
const camelCase = str => {
let string = str.toLowerCase().replace(/[^A-Za-z0-9]/g, ' ').split(' ')
.reduce((result, word) => result + capitalize(word.toLowerCase()))
return string.charAt(0).toLowerCase() + string.slice(1)
}
const capitalize = str => str.charAt(0).toUpperCase() + str.toLowerCase().slice(1)
let baz = 'foo bar'
let camel = camelCase(baz)
console.log(camel) // "fooBar"
camelCase('foo bar') // "fooBar"
camelCase('FOO BAR') // "fooBar"
camelCase('x nN foo bar') // "xNnFooBar"
camelCase('!--foo-¿?-bar--121-**%') // "fooBar121"
这是一个做这项工作的班轮:
const camelCaseIt = string => string.toLowerCase().trim().split(/[.\-_\s]/g).reduce((string, word) => string + word[0].toUpperCase() + word.slice(1));
它根据 RegExp [.\-_\s]
中提供的字符列表拆分小写字符串(在 [] 中添加更多字符!)并返回一个单词数组。然后,它将字符串数组减少为一个连接的单词字符串,其中首字母大写。因为reduce没有初始值,它会从第二个单词开始大写第一个字母。
如果你想要 PascalCase,只需在 reduce 方法中添加一个初始的空字符串 ,'')
。
这个函数通过cammelcase这样的测试
富吧
--foo-bar--
__FOO_BAR__-
foo123酒吧
foo_Bar
函数 toCamelCase(str) { var arr= str.match(/[az]+|\d+/gi); return arr.map((m,i)=>{ let low = m.toLowerCase(); if (i!=0){ low = low.split('').map((s,k)=>k ==0?s.toUpperCase():s).join`` } return low; }).join``; } console.log(toCamelCase('Foo Bar')); console.log(toCamelCase('--foo-bar--')); console.log(toCamelCase('__FOO_BAR__-')); console.log(toCamelCase('foo123Bar')); console.log(toCamelCase('foo_Bar')); console.log(toCamelCase('设备类名')); console.log(toCamelCase('设备类名')); console.log(toCamelCase('设备类名')); console.log(toCamelCase('设备类名'));
lodash 可以很好地做到这一点:
var _ = require('lodash');
var result = _.camelCase('toto-ce héros')
// result now contains "totoCeHeros"
尽管 lodash
可能是一个“大”库 (~4kB),但它包含许多您通常会使用代码片段或自己构建的函数。
最佳答案很简洁,但不能处理所有边缘情况。对于任何需要更强大的实用程序,没有任何外部依赖项的人:
function camelCase(str) {
return (str.slice(0, 1).toLowerCase() + str.slice(1))
.replace(/([-_ ]){1,}/g, ' ')
.split(/[-_ ]/)
.reduce((cur, acc) => {
return cur + acc[0].toUpperCase() + acc.substring(1);
});
}
function sepCase(str, sep = '-') {
return str
.replace(/[A-Z]/g, (letter, index) => {
const lcLet = letter.toLowerCase();
return index ? sep + lcLet : lcLet;
})
.replace(/([-_ ]){1,}/g, sep)
}
// All will return 'fooBarBaz'
console.log(camelCase('foo_bar_baz'))
console.log(camelCase('foo-bar-baz'))
console.log(camelCase('foo_bar--baz'))
console.log(camelCase('FooBar Baz'))
console.log(camelCase('FooBarBaz'))
console.log(camelCase('fooBarBaz'))
// All will return 'foo-bar-baz'
console.log(sepCase('fooBarBaz'));
console.log(sepCase('FooBarBaz'));
console.log(sepCase('foo-bar-baz'));
console.log(sepCase('foo_bar_baz'));
console.log(sepCase('foo___ bar -baz'));
console.log(sepCase('foo-bar-baz'));
// All will return 'foo__bar__baz'
console.log(sepCase('fooBarBaz', '__'));
console.log(sepCase('foo-bar-baz', '__'));
此处演示:https://codesandbox.io/embed/admiring-field-dnm4r?fontsize=14&hidenavigation=1&theme=dark
return "hello world".toLowerCase().replace(/(?:(^.)|(\s+.))/g, function(match) {
return match.charAt(match.length-1).toUpperCase();
}); // HelloWorld
因为这个问题还需要另一个答案……
我尝试了几种以前的解决方案,但它们都有一个或另一个缺陷。有些没有删除标点符号;有些不处理有数字的案件;有些没有连续处理多个标点符号。
他们都没有处理像 a1 2b
这样的字符串。对于这种情况,没有明确定义的约定,但其他一些 stackoverflow questions 建议使用下划线分隔数字。
我怀疑这是最高效的答案(三个正则表达式通过字符串,而不是一两个),但它通过了我能想到的所有测试。不过,老实说,我真的无法想象有这么多驼峰式转换会影响性能的情况。
(我将其添加为 npm package。它还包括一个可选的布尔参数以返回 Pascal Case 而不是 Camel Case。)
const underscoreRegex = /(?:[^\w\s]|_)+/g,
sandwichNumberRegex = /(\d)\s+(?=\d)/g,
camelCaseRegex = /(?:^\s*\w|\b\w|\W+)/g;
String.prototype.toCamelCase = function() {
if (/^\s*_[\s_]*$/g.test(this)) {
return '_';
}
return this.replace(underscoreRegex, ' ')
.replace(sandwichNumberRegex, '$1_')
.replace(camelCaseRegex, function(match, index) {
if (/^\W+$/.test(match)) {
return '';
}
return index == 0 ? match.trimLeft().toLowerCase() : match.toUpperCase();
});
}
测试用例(开玩笑)
test('Basic strings', () => {
expect(''.toCamelCase()).toBe('');
expect('A B C'.toCamelCase()).toBe('aBC');
expect('aB c'.toCamelCase()).toBe('aBC');
expect('abc def'.toCamelCase()).toBe('abcDef');
expect('abc__ _ _def'.toCamelCase()).toBe('abcDef');
expect('abc__ _ d_ e _ _fg'.toCamelCase()).toBe('abcDEFg');
});
test('Basic strings with punctuation', () => {
expect(`a'b--d -- f.h`.toCamelCase()).toBe('aBDFH');
expect(`...a...def`.toCamelCase()).toBe('aDef');
});
test('Strings with numbers', () => {
expect('12 3 4 5'.toCamelCase()).toBe('12_3_4_5');
expect('12 3 abc'.toCamelCase()).toBe('12_3Abc');
expect('ab2c'.toCamelCase()).toBe('ab2c');
expect('1abc'.toCamelCase()).toBe('1abc');
expect('1Abc'.toCamelCase()).toBe('1Abc');
expect('abc 2def'.toCamelCase()).toBe('abc2def');
expect('abc-2def'.toCamelCase()).toBe('abc2def');
expect('abc_2def'.toCamelCase()).toBe('abc2def');
expect('abc1_2def'.toCamelCase()).toBe('abc1_2def');
expect('abc1 2def'.toCamelCase()).toBe('abc1_2def');
expect('abc1 2 3def'.toCamelCase()).toBe('abc1_2_3def');
});
test('Oddball cases', () => {
expect('_'.toCamelCase()).toBe('_');
expect('__'.toCamelCase()).toBe('_');
expect('_ _'.toCamelCase()).toBe('_');
expect('\t_ _\n'.toCamelCase()).toBe('_');
expect('_a_'.toCamelCase()).toBe('a');
expect('\''.toCamelCase()).toBe('');
expect(`\tab\tcd`.toCamelCase()).toBe('abCd');
expect(`
ab\tcd\r
-_
|'ef`.toCamelCase()).toBe(`abCdEf`);
});
很少修改斯科特的答案:
toCamelCase = (string) ->
string
.replace /[\s|_|-](.)/g, ($1) -> $1.toUpperCase()
.replace /[\s|_|-]/g, ''
.replace /^(.)/, ($1) -> $1.toLowerCase()
现在它也替换了“-”和“_”。
以下所有 14 种排列产生相同的“设备类名称”结果。
String.prototype.toCamelCase = function() { return this.replace(/[^az ]/ig, '') // 替换除字母和空格之外的所有内容。 .replace(/(?:^\w|[AZ]|\b\w|\s+)/g, // 查找非单词、大写字母、前导字母和多个空格 function(match, index ) { return +match === 0 ? "" : match[index === 0 ? 'toLowerCase' : 'toUpperCase'](); }); } String.toCamelCase = function(str) { return str.toCamelCase(); } var testCases = [ "设备类名", "设备类名", "设备类名", "设备类名", "设备类名", "设备类名", "设备类名", "设备类Name”、“设备类名”、“设备类名”、“设备类名”、“设备类名”、“设备类名”、“设备类名”]; for (var i = 0; i < testCases.length; i++) { console.log(testCases[i].toCamelCase()); };
您可以使用此解决方案:
String.prototype.toCamelCase = function(){ return this.replace(/\s(\w)/ig, function(all, letter){return letter.toUpperCase();}) .replace(/(^\w) /, function($1){return $1.toLowerCase()}); }; console.log('设备类名'.toCamelCase());
这是我的建议:
function toCamelCase(string) {
return `${string}`
.replace(new RegExp(/[-_]+/, 'g'), ' ')
.replace(new RegExp(/[^\w\s]/, 'g'), '')
.replace(
new RegExp(/\s+(.)(\w+)/, 'g'),
($1, $2, $3) => `${$2.toUpperCase() + $3.toLowerCase()}`
)
.replace(new RegExp(/\s/, 'g'), '')
.replace(new RegExp(/\w/), s => s.toLowerCase());
}
或者
String.prototype.toCamelCase = function() {
return this
.replace(new RegExp(/[-_]+/, 'g'), ' ')
.replace(new RegExp(/[^\w\s]/, 'g'), '')
.replace(
new RegExp(/\s+(.)(\w+)/, 'g'),
($1, $2, $3) => `${$2.toUpperCase() + $3.toLowerCase()}`
)
.replace(new RegExp(/\s/, 'g'), '')
.replace(new RegExp(/\w/), s => s.toLowerCase());
};
测试用例:
describe('String to camel case', function() {
it('should return a camel cased string', function() {
chai.assert.equal(toCamelCase('foo bar'), 'fooBar');
chai.assert.equal(toCamelCase('Foo Bar'), 'fooBar');
chai.assert.equal(toCamelCase('fooBar'), 'fooBar');
chai.assert.equal(toCamelCase('FooBar'), 'fooBar');
chai.assert.equal(toCamelCase('--foo-bar--'), 'fooBar');
chai.assert.equal(toCamelCase('__FOO_BAR__'), 'fooBar');
chai.assert.equal(toCamelCase('!--foo-¿?-bar--121-**%'), 'fooBar121');
});
});
遵循@Scott 的可读方法,进行一些微调
// convert any string to camelCase
var toCamelCase = function(str) {
return str.toLowerCase()
.replace( /['"]/g, '' )
.replace( /\W+/g, ' ' )
.replace( / (.)/g, function($1) { return $1.toUpperCase(); })
.replace( / /g, '' );
}
replace
完成,而不是 4。
有我的解决方案:
const toCamelWord = (word, idx) => idx === 0 ? word.toLowerCase() : word.charAt(0).toUpperCase() + word.slice(1).toLowerCase(); const toCamelCase = text => text .split(/[_-\s]+/) .map(toCamelWord) .join(""); console.log(toCamelCase('用户 ID'))
为了有效地创建将字符串的大小写转换为驼峰式大小写的函数,该函数还需要先将每个字符串转换为小写,然后再将非第一个字符串的第一个字符的大小写转换为大写字母。
我的示例字符串是:
"text That I WaNt to make cAMEL case"
为这个问题提供的许多其他解决方案都返回了这个:
"textThatIWaNtToMakeCAMELCase"
我认为应该是预期的,期望的输出是这样的,其中所有中间字符串大写字符首先转换为小写:
"textThatIWanrtToMakeCamelCase"
这可以在不使用任何 replace()
方法调用的情况下通过使用 String.prototype.split()
、Array.prototype.map()
和 Array.prototype.join()
方法来完成:
≤ ES5 版本
function makeCamelCase(str) {
return str
.split(' ')
.map((e,i) => i
? e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()
: e.toLowerCase()
)
.join('')
}
makeCamelCase("text That I WaNt to make cAMEL case")
// -> "textThatIWanrtToMakeCamelCase" ✅
我将分解每一行的作用,然后以其他两种格式提供相同的解决方案 - ES6 和 String.prototype
方法,但我建议不要像这样直接扩展内置 JavaScript 原型。
解说员
function makeCamelCase(str) {
return str
// split string into array of different words by splitting at spaces
.split(' ')
// map array of words into two different cases, one for the first word (`i == false`) and one for all other words in the array (where `i == true`). `i` is a parameter that denotes the current index of the array item being evaluated. Because indexes start at `0` and `0` is a "falsy" value, we can use the false/else case of this ternary expression to match the first string where `i === 0`.
.map((e,i) => i
// for all non-first words, use a capitalized form of the first character + the lowercase version of the rest of the word (excluding the first character using the slice() method)
? e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()
// for the first word, we convert the entire word to lowercase
: e.toLowerCase()
)
// finally, we join the different strings back together into a single string without spaces, our camel-cased string
.join('')
}
makeCamelCase("text That I WaNt to make cAMEL case")
// -> "textThatIWanrtToMakeCamelCase" ✅
精简 ES6+(单行)版本
const makeCamelCase = str => str.split(' ').map((e,i) => i ? e.charAt(0).toUpperCase() + e.slice(1).toLowerCase() : e.toLowerCase()).join('')
makeCamelCase("text That I WaNt to make cAMEL case")
// -> "textThatIWanrtToMakeCamelCase" ✅
String.prototype 方法版本
String.prototype.toCamelCase = function() {
return this
.split(' ')
.map((e,i) => i
? e.charAt(0).toUpperCase() + e.slice(1).toLowerCase()
: e.toLowerCase()
)
.join('')
}
"text That I WaNt to make cAMEL case".toCamelCase()
// -> "textThatIWanrtToMakeCamelCase" ✅
这种方法似乎胜过这里的大多数答案,虽然它有点hacky,没有替换,没有正则表达式,只是建立一个新的字符串,即camelCase。
String.prototype.camelCase = function(){
var newString = '';
var lastEditedIndex;
for (var i = 0; i < this.length; i++){
if(this[i] == ' ' || this[i] == '-' || this[i] == '_'){
newString += this[i+1].toUpperCase();
lastEditedIndex = i+1;
}
else if(lastEditedIndex !== i) newString += this[i].toLowerCase();
}
return newString;
}
这以 CMS 的答案为基础,通过删除任何非字母字符包括下划线,\w
不会删除。
function toLowerCamelCase(str) {
return str.replace(/[^A-Za-z0-9]/g, ' ').replace(/^\w|[A-Z]|\b\w|\s+/g, function (match, index) {
if (+match === 0 || match === '-' || match === '.' ) {
return ""; // or if (/\s+/.test(match)) for white spaces
}
return index === 0 ? match.toLowerCase() : match.toUpperCase();
});
}
toLowerCamelCase("EquipmentClass name");
toLowerCamelCase("Equipment className");
toLowerCamelCase("equipment class name");
toLowerCamelCase("Equipment Class Name");
toLowerCamelCase("Equipment-Class-Name");
toLowerCamelCase("Equipment_Class_Name");
toLowerCamelCase("Equipment.Class.Name");
toLowerCamelCase("Equipment/Class/Name");
// All output e
在不使用正则表达式的情况下将大写驼峰式(“TestString”)转换为小写驼峰式(“testString”)(让我们面对现实吧,正则表达式是邪恶的):
'TestString'.split('').reduce((t, v, k) => t + (k === 0 ? v.toLowerCase() : v), '');
我最终制定了一个更具侵略性的解决方案:
function toCamelCase(str) {
const [first, ...acc] = str.replace(/[^\w\d]/g, ' ').split(/\s+/);
return first.toLowerCase() + acc.map(x => x.charAt(0).toUpperCase()
+ x.slice(1).toLowerCase()).join('');
}
上面的这个将删除所有非字母数字字符和单词的小写部分,否则它们会保持大写,例如
大小(比较)=> sizeComparative
GDP(官方汇率)=> gdpOfficialExchangeRate
你好 => 你好
function convertStringToCamelCase(str){
return str.split(' ').map(function(item, index){
return index !== 0
? item.charAt(0).toUpperCase() + item.substr(1)
: item.charAt(0).toLowerCase() + item.substr(1);
}).join('');
}
我知道这是一个旧答案,但这可以处理空格和 _ (lodash)
function toCamelCase(s){
return s
.replace(/_/g, " ")
.replace(/\s(.)/g, function($1) { return $1.toUpperCase(); })
.replace(/\s/g, '')
.replace(/^(.)/, function($1) { return $1.toLowerCase(); });
}
console.log(toCamelCase("Hello world");
console.log(toCamelCase("Hello_world");
// Both print "helloWorld"
.replace(/_/g", " ")
中似乎有一个杂散的 "
会导致编译错误?
const toCamelCase = str =>
str
.replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase())
.replace(/^\w/, c => c.toLowerCase());
camelize("Let's Do It!") === "let'SDoIt!"
悲伤的脸。我会尝试自己,但担心我会添加另一个替换。return this.replace(/[^a-z ]/ig, '').replace(/(?:^\w|[A-Z]|\b\w|\s+)/g,
做得更好...const toCamelCase = (str) => str.replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');
.toLowerCase()
方法将整个字符串简单地转换为小写,然后再转换为骆驼大小写。例如。使用上述@tabrindle 的解决方案:const toCamelCase = (str) => str.toLowerCase().replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');