将连字符转换为驼色(camelCase)

小开

最佳答案

试试这个:

var camelCased = myString.replace(/-([a-z])/g, function (g) { return g[1].toUpperCase(); });

正则表达式将匹配 marker-image中的 -i，并且只捕获 i。然后在回调函数中将其大写并替换。

小开

你可以得到连字符和下一个字符，然后用大写的字符替换它:

var str="marker-image-test";
str.replace(/-([a-z])/g, function (m, w) {
return w.toUpperCase();
});

小开

下面是我的 camelCase 函数版本:

var camelCase = (function () {
var DEFAULT_REGEX = /[-_]+(.)?/g;


function toUpper(match, group1) {
return group1 ? group1.toUpperCase() : '';
}
return function (str, delimiters) {
return str.replace(delimiters ? new RegExp('[' + delimiters + ']+(.)?', 'g') : DEFAULT_REGEX, toUpper);
};
})();

它处理以下所有边缘情况:

默认情况下同时处理下划线和连字符(可用第二个参数配置)
带有 Unicode 字符的字符串
以连字符或下划线结尾的字符串
具有连续的连字符或下划线的字符串

这里有一个实时测试的链接: http://jsfiddle.net/avKzf/2/

以下是测试结果:

输入: “ ab-cd-ef”，结果: “ abCdEf”
输入: “ ab-cd-ef-”，结果: “ abCdEf”
输入: “ ab-cd-ef ——”，结果: “ abCdEf”
输入: “ ab-cd —— ef ——”，结果: “ abCdEf”
输入: “—— ab-cd —— ef ——”，结果: “ AbCdEf”
Input: “—— ab-cd-_ _-ef ——”，result: “ AbCdEf”

注意，以分隔符开头的字符串将在开头处显示大写字母。如果这不是您所期望的，那么您总是可以使用 lcfirst。如果你需要，这是我的身份证:

function lcfirst(str) {
return str && str.charAt(0).toLowerCase() + str.substring(1);
}

小开

下面是另一个选项，它将两个答案组合在一起，使其成为字符串上的方法:

if (typeof String.prototype.toCamel !== 'function') {
String.prototype.toCamel = function(){
return this.replace(/[-_]([a-z])/g, function (g) { return g[1].toUpperCase(); })
};
}

用法如下:

'quick_brown'.toCamel(); // quickBrown
'quick-brown'.toCamel(); // quickBrown

小开

// Turn the dash separated variable name into camelCase.
str = str.replace(/\b-([a-z])/g, (_, char) => char.toUpperCase());

小开

再拍一次。

用于..。

var string = "hyphen-delimited-to-camel-case"
or
var string = "snake_case_to_camel_case"




function toCamelCase( string ){
return string.toLowerCase().replace(/(_|-)([a-z])/g, toUpperCase );
}


function toUpperCase( string ){
return string[1].toUpperCase();
}


Output: hyphenDelimitedToCamelCase

小开

这是一个伟大的实用程序，Lodash提供，如果你是开明的，并有它包括在您的项目。

var str = 'my-hyphen-string';
str = _.camelCase(str);
// results in 'myHyphenString'

小开

也可以将 indexOf 与递归一起用于该任务。

input some-foo_sd_dsd-weqe
output someFooSdDsdWeqe

* 测量两种不同脚本的执行时间:

$ node camelCased.js
someFooSdDsdWeqe
test1: 2.986ms
someFooSdDsdWeqe
test2: 0.231ms

密码:

console.time('test1');
function camelCased (str) {


function check(symb){


let idxOf = str.indexOf(symb);
if (idxOf === -1) {
return str;
}


let letter = str[idxOf+1].toUpperCase();
str = str.replace(str.substring(idxOf+1,idxOf+2), '');
str = str.split(symb).join(idxOf !== -1 ? letter : '');


return camelCased(str);
}


return check('_') && check('-');


}


console.log(camelCased ('some-foo_sd_dsd-weqe'));
console.timeEnd('test1');






console.time('test2');


function camelCased (myString){
return myString.replace(/(-|\_)([a-z])/g, function (g) { return  g[1].toUpperCase(); });
}




console.log(camelCased ('some-foo_sd_dsd-weqe'));
console.timeEnd('test2');

小开

这对我来说不是什么大事。就个人而言，当简单的字符串和数组方法就足够了时，我会尽量避免使用正则表达式:

let upFirst = word =>
word[0].toUpperCase() + word.toLowerCase().slice(1)


let camelize = text => {
let words = text.split(/[-_]/g) // ok one simple regexp.
return words[0].toLowerCase() + words.slice(1).map(upFirst)
}


camelize('marker-image') // markerImage

小开

只是一个带有标志、 for 循环和不带正则表达式的版本:

function camelCase(dash) {


var camel = false;
var str = dash;
var camelString = '';


for(var i = 0; i < str.length; i++){
if(str.charAt(i) === '-'){
camel = true;


} else if(camel) {
camelString += str.charAt(i).toUpperCase();
camel = false;
} else {
camelString += str.charAt(i);
}
}
return camelString;
}

小开

这里是我的实现(只是让手脏了)

/**
* kebab-case to UpperCamelCase
* @param {String} string
* @return {String}
*/
function toUpperCamelCase(string) {
return string
.toLowerCase()
.split('-')
.map(it => it.charAt(0).toUpperCase() + it.substring(1))
.join('');
}

小开

您可以从 NPM 使用骆驼箱。

npm install --save camelcase

const camelCase = require('camelcase');
camelCase('marker-image'); // => 'markerImage';
camelCase('my-example-setting'); // => 'myExampleSetting';

小开

如果在字符串中使用 允许数字，则使用此。

显然，以数字开头的部分不会被大写，但是这在某些情况下可能是有用的。

function fromHyphenToCamelCase(str) {
return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}

function fromHyphenToCamelCase(str) {
return str.replace(/-([a-z0-9])/g, (g) => g[1].toUpperCase())
}


const str1 = "category-123";
const str2 = "111-222";
const str3 = "a1a-b2b";
const str4 = "aaa-2bb";


console.log(`${str1} => ${fromHyphenToCamelCase(str1)}`);
console.log(`${str2} => ${fromHyphenToCamelCase(str2)}`);
console.log(`${str3} => ${fromHyphenToCamelCase(str3)}`);
console.log(`${str4} => ${fromHyphenToCamelCase(str4)}`);

小开

使用带有正则表达式文字和替换函数的 String的 replace()方法。

例如:

'uno-due-tre'.replace(/-./g, (m) => m[1].toUpperCase()) // --> 'unoDueTre'

说明:

'uno-due-tre'是要转换为驼峰大小写的(输入)字符串。
/-./g(传递给 replace()的第一个参数)是正则表达式文字。
- '-.'(斜线之间)是一种模式。它匹配后跟任何单个字符的单个 '-'字符。因此，对于字符串 'uno-due-tre'，模式 '-.'匹配 '-d'和 '-t'。
- 'g'(在结束斜杠之后)是一个标志。它代表“ global”，并告诉 replace()执行全局搜索和替换，即替换所有匹配项，而不仅仅是第一个匹配项。
(m) => m[1].toUpperCase()(传递给 replace()的第二个参数)是替换函数。每场比赛叫一次。每个匹配的子字符串被该函数返回的字符串替换。m(此函数的第一个参数)表示匹配的子字符串。此函数返回大写的 m的第二个字符。因此，当 m为 '-d'时，该函数返回 'D'。
'unoDueTre'是 replace()返回的新(输出)字符串。输入字符串保持不变。

小开

您也可以使用字符串和数组方法; 我使用修剪来避免任何空格。

const properCamel = (str) =>{


const lowerTrim = str.trim().toLowerCase();


const array = lowerTrim.split('-');


const firstWord = array.shift();


const caps = array.map(word=>{


return word[0].toUpperCase() + word.slice(1);


})


caps.unshift(firstWord)


return caps.join('');


}

小开

这个简单的解决方案考虑到了这些边缘情况。

一个字
一个字母
没有连字符
超过1个连字符

const toCamelCase = (text) => text.replace(/(.)([^-|$]*)[-]*/g, (_,letter,word) => `${letter.toUpperCase()}${word.toLowerCase()}`)