javascript - first - Convertir guiones en camel case(camelCase)

javascript capitalize letter

Question

Con expresiones regulares (supongo) o algún otro método, ¿cómo puedo convertir cosas como:

marker-image o my-example-setting a markerImage o myExampleSetting .

Estaba pensando solo en dividirme - luego convierto el índice de ese hypen +1 a mayúscula. Pero parece bastante sucio y esperaba algo de ayuda con la expresión regular que podría hacer que el código sea más limpio.

No jQuery ...

Answer 1

Aquí está mi versión de la función 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);
    };
})();

Maneja todos los siguientes casos extremos:

• se encarga tanto de los guiones bajos como de los guiones por defecto (configurables con el segundo parámetro)
• cadena con caracteres Unicode
• cadena que termina con guiones o guiones bajos
• cadena que tiene guiones consecutivos o guiones bajos

Aquí hay un enlace a pruebas en vivo: http://jsfiddle.net/avKzf/2/

Aquí están los resultados de las pruebas:

• entrada: "ab-cd-ef", resultado: "abCdEf"
• entrada: "ab-cd-ef-", resultado: "abCdEf"
• entrada: "ab-cd-ef--", resultado: "abCdEf"
• entrada: "ab-cd - ef--", resultado: "abCdEf"
• entrada: "--ab-cd - ef--", resultado: "AbCdEf"
• entrada: "--ab-cd -__- ef--", resultado: "AbCdEf"

Observe que las cadenas que comienzan con delimitadores darán como resultado una letra mayúscula al principio. Si eso no es lo que esperaría, siempre puede usar lcfirst. Aquí está mi primer aviso si lo necesitas:

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

Answer 2

Aquí hay otra opción que combina un par de respuestas aquí y lo convierte en método en una cadena:

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

Usado así:

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

Answer 3

Esta es una de las grandes utilidades que Lodash ofrece si está iluminado y lo tiene incluido en su proyecto.

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

Answer 4

Esto no grita para un RegExp para mí. Personalmente trato de evitar las expresiones regulares cuando los métodos simples de cadena y matriz serán suficientes:

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

Answer 5

Otra toma.

Usado cuando ...

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

Answer 6

Prueba esto:

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

La expresión regular coincidirá con -i en marker-image y solo capturará el i . Esto se aplica en mayúscula en la función de devolución de llamada y se reemplaza.

Answer 7

Puedes obtener el hypen y el siguiente personaje y reemplazarlo con la versión en mayúsculas del personaje:

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

Answer 8

también es posible usar indexOf con recursión para esa tarea.

input some-foo_sd_dsd-weqe
output someFooSdDsdWeqe

comparison ::: measure tiempo de ejecución para dos scripts diferentes:

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

código:

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'');

Answer 9

# Turn the dash separated variable name into camelCase.
str = str.replace(//b-([a-z])/g, function(all, char) { return char.toUpperCase() });