-
-
Save youssman/745578062609e8acac9f to your computer and use it in GitHub Desktop.
function camelCaseToDash( myStr ) { | |
return myStr.replace( /([a-z])([A-Z])/g, '$1-$2' ).toLowerCase(); | |
} | |
var myStr = camelCaseToDash( 'thisString' ); | |
alert( myStr ); // => this-string |
@canvaspixels Unexpected token {
@luckylooke -- I think @canvaspixels' example was corrupted by the markdown rendering. I expect he meant this:
myStr.replace(/([A-Z])/g, (g) => `-${g[0].toLowerCase()}`);
Great help. thanks
For javascript I recommend this way:
return !myStr ? null : myStr.replace(/([A-Z])/g, function (g) { return '-' + g[0].toLowerCase() });
I tried the solutions proposed here, but they didn't work for strings that start with an upper case letter.
Here's my improved version:
const camelToDash = str => str
.replace(/(^[A-Z])/, ([first]) => first.toLowerCase())
.replace(/([A-Z])/g, ([letter]) => `-${letter.toLowerCase()}`)
_.kebabCase( 'fontSize' )
// font-size
/**
* camelCaseToDash('userId') => "user-id"
* camelCaseToDash('waitAMoment') => "wait-a-moment"
* camelCaseToDash('TurboPascal') => "turbo-pascal"
*/
function camelCaseToDash (str) {
return str.replace(/([a-zA-Z])(?=[A-Z])/g, '$1-').toLowerCase()
}
This version will handle imperfect camel case/pascal case with multiple capital letters in a row
function camelCaseToDash(str) {
return str
.replace(/[^a-zA-Z0-9]+/g, '-')
.replace(/([A-Z]+)([A-Z][a-z])/g, '$1-$2')
.replace(/([a-z])([A-Z])/g, '$1-$2')
.replace(/([0-9])([^0-9])/g, '$1-$2')
.replace(/([^0-9])([0-9])/g, '$1-$2')
.replace(/-+/g, '-')
.toLowerCase();
}
this might be simpler:
const camel2Dash = (v: string): string => {
let ret = '', prevLowercase = false;
for(let s of v){
const isUppercase = s.toUpperCase() === s;
if(isUppercase && prevLowercase){
ret += '-';
}
ret += s;
prevLowercase = !isUppercase;
}
return ret.replace(/-+/g, '-').toLowerCase();
};
it just checks to see if the previous was lowercase and current is uppercase, and in that case adds a hyphen. at the end replaces more than one consecutive hyphen with just one hyphen.
For emdash/endash, will have to do more.
I tried the solutions proposed here, but they didn't work for strings that start with an upper case letter.
That's not camel case.
I tried the solutions proposed here, but they didn't work for strings that start with an upper case letter.
That's not camel case.
That is PascalCase
str.split(/(?=[A-Z])/).join('-').toLowerCase()
str.split(/(?=[A-Z])/).join('-').toLowerCase()
'propName1'.split(/(?=[A-Z])/).join('-').toLowerCase() -> "prop-name1"
I extended https://gist.github.com/youssman/745578062609e8acac9f#gistcomment-2698925 with numbers:
const camelCaseToDash = (v) => {
let ret = '', prevLowercase = false, prevIsNumber = false
for (let s of v) {
const isUppercase = s.toUpperCase() === s
const isNumber = !isNaN(s)
if (isNumber) {
if (prevLowercase) {
ret += '-'
}
} else {
if (isUppercase && (prevLowercase || prevIsNumber)) {
ret += '-'
}
}
ret += s
prevLowercase = !isUppercase
prevIsNumber = isNumber
}
return ret.replace(/-+/g, '-').toLowerCase()
}
// mdiDiceD10Outline => mdi-dice-d10-outline
// mdiKeyboardF10 mdi-keyboard-f10
// mdiNumeric1 mdi-numeric-1
"use strict";
/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2021-02-04
*
* @description camelCaseFormatter 驼峰命名转换器
* @augments
* @example
* @link https://www.cnblogs.com/xgqfrms/p/14366997.html
* @link https://vscode.xgqfrms.xyz/
*
*/
const log = console.log;
const camelCaseFormatter = (str = ``, debug = false) => {
let result = '';
for(let item of [...str]) {
if(item.charCodeAt() > 'a'.charCodeAt() || !Number.isNaN(+item)) {
result += item;
} else {
result += `-${item.toLocaleLowerCase()}`;
}
}
if(debug) {
log(`✅ result = `, result);
}
return result;
}
const str = 'costInV2';
// "costInV2"
camelCaseFormatter(str, true);
// node ./camelCase.js
// result = cost-in-v2
is there one that deals with paths? /CamelCase/Path/Here
to /camel-case/path/here
This doesn't cover single chars e.g. thisIsAString.
This will :)
return myStr.replace(/([A-Z])/g, (g) =>
-${g[0].toLowerCase()}
);