webentwicklung-frage-antwort-db.com.de

Strichseparierte Zeichenfolge in camelCase konvertieren?

Angenommen, ich habe immer eine Zeichenfolge, die durch "-" begrenzt wird. Gibt es eine Möglichkeit zur Transformation?

es ist heute ein großer Tag

zu

itIsAGreatDayToday

RegEx verwenden?

37
Hoa

Ja (bearbeitet zur Unterstützung der Eingabe in Kleinbuchstaben und Unicode):

function camelCase(input) { 
    return input.toLowerCase().replace(/-(.)/g, function(match, group1) {
        return group1.toUpperCase();
    });
}

Weitere Informationen zu "Callbacks ersetzen" finden Sie unter MDNs "Festlegen einer Funktion als Parameter" Dokumentation.

Das erste Argument für die Rückruffunktion ist die vollständige Übereinstimmung. Nachfolgende Argumente sind die in Klammern stehenden Gruppen in der Regex (in diesem Fall das Zeichen nach dem Bindestrich).

70
apsillers

Sie können das Word-Zeichen nach jedem Bindestrich (-) oder dem Anfang der Zeichenfolge abgleichen, oder Sie können es vereinfachen, indem Sie das Word-Zeichen nach jeder Wortgrenze (\b) abgleichen.

function camelCase(s) {
  return (s||'').toLowerCase().replace(/(\b|-)\w/g, function(m) {
    return m.toUpperCase().replace(/-/,'');
  });
}
camelCase('foo-bar'); // => 'FooBar'
camelCase('FOo-BaR-gAH'); // => 'FooBarGah'
5
maerics

Hier ist eine Demo

var test = 'It-is-a-great-day-today';

function camelize(str) {
    return str[0].toLowerCase() + str.replace(/-([a-z])/g, function(a, b) {
        return b.toUpperCase();
    }).slice(1);
}

console.log(camelize(test));
3
Joseph

Das sollte auch funktionieren:

function camelCase(str) {
  return str.replace(/^.|-./g, function(letter, index) {
    return index == 0 ? letter.toLowerCase() : letter.substr(1).toUpperCase();
  });
}

Und meiner Meinung nach ist es etwas effizienter, da wir nicht die gesamte Eingabezeichenfolge zuerst in Kleinbuchstaben und dann in Großbuchstaben konvertieren, wenn dies erforderlich ist. Diese Funktion konvertiert nur den ersten Buchstaben in Kleinbuchstaben und dann jedes Zeichen nach dem Bindestrich - in Großbuchstaben.

3
anubhava

Das funktioniert großartig, aber jemand kann es bereinigen.

var toCamelCase = function(str) {
        // Replace special characters with a space
        str = str.replace(/[^a-zA-Z0-9 ]/g, " ");
        // put a space before an uppercase letter
        str = str.replace(/([a-z](?=[A-Z]))/g, '$1 ');
        // Lower case first character and some other stuff that I don't understand
        str = str.replace(/([^a-zA-Z0-9 ])|^[0-9]+/g, '').trim().toLowerCase();
        // uppercase characters preceded by a space or number
        str = str.replace(/([ 0-9]+)([a-zA-Z])/g, function(a,b,c) {
            return b.trim() + c.toUpperCase();
        });
        return str;
};

console.log(toCamelCase('hyphen~name~ format'));
console.log(toCamelCase('hyphen.name.format'));
console.log(toCamelCase('hyphen-name-format'));
console.log(toCamelCase('Hyphen-Dame-Gormat'));
console.log(toCamelCase('EquipmentClass name'));
console.log(toCamelCase('Equipment className'));
console.log(toCamelCase('equipment class name'));
console.log(toCamelCase(' e    Equipment Class Name'));
console.log(toCamelCase('under9score_name_format'));
console.log(toCamelCase('Enderscore_name_format'));
console.log(toCamelCase('EnderscoreBameFormat'));
console.log(toCamelCase('_EnderscoreBameFormat'));

http://jsbin.com/yageqi/1/edit?js,console

2
codeBelt

Ich weiß, dass diese Frage ein bisschen alt ist, aber

Hier ist meine Version der camelCase-Funktion:

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);
    };
})();

Es behandelt alle folgenden Edge-Fälle:

  • übernimmt standardmäßig sowohl Unterstriche als auch Bindestriche (konfigurierbar mit zweitem Parameter)
  • zeichenfolge mit Unicode-Zeichen
  • zeichenfolge, die mit Bindestrichen oder Unterstrich endet
  • zeichenfolge mit aufeinander folgenden Bindestrichen oder Unterstrichen

Hier ist ein Link zu Live-Tests: http://jsfiddle.net/avKzf/2/

Hier sind Ergebnisse aus Tests:

  • eingabe: "ab-cd-ef", Ergebnis: "abCdEf"
  • eingabe: "ab-cd-ef-", Ergebnis: "abCdEf"
  • eingabe: "ab-cd-ef--", Ergebnis: "abCdEf"
  • eingabe: "ab-cd - ef--", Ergebnis: "abCdEf"
  • eingabe: "--ab-cd - ef--", Ergebnis: "AbCdEf"
  • eingabe: "--ab-cd -__- ef--", Ergebnis: "AbCdEf"

Beachten Sie, dass Zeichenfolgen, die mit Trennzeichen beginnen, am Anfang zu einem Großbuchstaben führen. Wenn dies nicht der Fall ist, können Sie lcfirst verwenden.

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

Eine andere Methode mit verkleinern :

function camelCase(str) {
  return str
    .split('-')
    .reduce((a, b) => a + b.charAt(0).toUpperCase() + b.slice(1));
}
2
Lior Erez

Siehe http://jsfiddle.net/54ZcM/

function camelCase(string) {
    return string.toLowerCase().replace(/(\-[a-zA-Z])/g, function($1) {
        return $1.toUpperCase().replace('-','');
    })
}

alert(camelCase('fOo-BarBA-fo'));
1
Gabriel Santos
var string = "it-is-a-great-day-today";
or
var string = "it_is_a_great_day_today";

var regex = /(_|-)([a-z])/g;

string.toLowerCase().replace(regex, toCamelCase );

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

Output: "itIsAGreatDayToday";
1
SoEzPz

hier ist das jsfiddle, mit dem Sie das testen können http://jsfiddle.net/5n84w/2/

`` `

/**
 * Function to convert any string to camelCase
 * var regex = 'chetan-Ankola###.com---m13ok#-#alo(*finding!R%S#%-GFF'; 
 * Where [-_ .] is the seperator, you can add eg: '@' too
 * + is to handle repetition of seperator           
 * ? is to take care of preceeding token 
 * match nov(ember)? matches nov and november
 */
var camelCaser = function (str) {
    var camelCased = str.replace(/[-_ .]+(.)?/g, function (match, p) {
        if (p) {
            return p.toUpperCase();
        }
        return '';
    }).replace(/[^\w]/gi, '');
    return camelCased;
};

`` `

0
Chetan Ankola
'it-is-a-great-day-today'.split('-').map(function(x,i){
    return (i?x[0].toUpperCase():x[0]) + x.slice(1).toLowerCase()
}).join('')

Ergebnis:

'itIsAGreatDayToday'

Alternativ dazu ist .match(/\w+/g) und nicht .split('-') - abhängig davon, was Sie in Edge-Fällen wie "this - is-a-test" tun möchten.

0
ninjagecko