Conversion de n'importe quelle corde en étui camel


171

Comment puis-je convertir une chaîne en cas de camel en utilisant javascript regex?

EquipmentClass nameou Equipment classNameou equipment class nameouEquipment Class Name

devraient tous devenir: equipmentClassName.


1
J'ai fait un test jsperf des différentes méthodes. les résultats étaient légèrement peu concluants. cela semble dépendre de la chaîne d'entrée.
yincrash du


Un nouveau test jsperf avec quelques chaînes différentes à tester et une plus grande variété d'implémentations: jsperf.com/camel-casing-regexp-or-character-manipulation/1 - cela me conduit à la conclusion que pour le cas moyen, malgré la formulation de cette question par le demandeur, les expressions régulières ne sont pas ce que vous voulez. Non seulement ils sont beaucoup plus difficiles à comprendre, mais ils prennent également (du moins pour les versions actuelles de Chrome) environ deux fois plus de temps à fonctionner.
Jules

Réponses:


237

En regardant votre code, vous pouvez y parvenir avec seulement deux replaceappels:

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"

Edit: Ou avec un seul replaceappel, en capturant les espaces blancs également dans le 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();
  });
}

4
Excellent code, et il a fini par gagner jsperf.com/js-camelcase/5 . Voulez-vous contribuer à une version capable de gérer (supprimer) les caractères non alpha? camelize("Let's Do It!") === "let'SDoIt!" visage triste . Je vais essayer moi-même mais je crains d'ajouter un autre remplacement.
Orwellophile

2
.. puisque le non-alpha ne devrait pas affecter le cas, je ne suis pas sûr que cela puisse être fait mieux que return this.replace(/[^a-z ]/ig, '').replace(/(?:^\w|[A-Z]|\b\w|\s+)/g,...
Orwellophile

4
Pour mes amis ES2015 +: une ligne unique basée sur le code ci-dessus. const toCamelCase = (str) => str.replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');
tabrindle

2
Bien que ce ne soit pas un cas demandé par exemple, une autre entrée courante que vous verrez probablement est "NOM DE LA CLASSE D'ÉQUIPEMENT", pour laquelle cette méthode échoue.
Alexander Tsepkov

1
@EdmundReed vous pouvez simplement convertir la chaîne entière en minuscules avant de la convertir en cas de chameau en enchaînant la .toLowerCase()méthode dans. Par exemple. en utilisant la solution de @ tabrindle ci-dessus:const toCamelCase = (str) => str.toLowerCase().replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');
bitfidget

103

Si quelqu'un utilise lodash , il y a un_.camelCase() fonction.

_.camelCase('Foo Bar');
// → 'fooBar'

_.camelCase('--foo-bar--');
// → 'fooBar'

_.camelCase('__FOO_BAR__');
// → 'fooBar'

2
Cette réponse devrait certainement apparaître plus haut. Lodash fournit un ensemble complet pour convertir des chaînes entre différents cas.
btx

55

J'ai juste fini par faire ça:

String.prototype.toCamelCase = function(str) {
    return str
        .replace(/\s(.)/g, function($1) { return $1.toUpperCase(); })
        .replace(/\s/g, '')
        .replace(/^(.)/, function($1) { return $1.toLowerCase(); });
}

J'essayais d'éviter d'enchaîner plusieurs instructions de remplacement. Quelque chose où j'aurais 1 $, 2 $, 3 $ dans ma fonction. Mais ce type de regroupement est difficile à comprendre, et votre mention des problèmes entre navigateurs est quelque chose auquel je n'ai jamais pensé non plus.


1
Cela me semble bien et rien ne semble suspect en ce qui concerne les problèmes entre navigateurs. (Non pas que je sois un super-expert ou quoi que ce soit.)
Pointy

47
Si vous allez utiliser le String.prototype, pourquoi ne pas simplement utiliser «this» au lieu d'envoyer un paramètre «str»?
yincrash du

6
Pour une meilleure compatibilité du navigateur, veuillez utiliser ceci à la place de str (et supprimer le paramètre de l'appel de fonction)
João Paulo Motta

2
Vous avez juste besoin d'utiliser this.valueOf()au lieu de passer str. Alternativement (comme dans mon cas) this.toLowerCase()car mes chaînes d'entrée étaient en MAJUSCULES qui n'avaient pas les parties non bosse correctement minuscules. L'utilisation thisrenvoie simplement l'objet string lui-même, qui est en fait un tableau de char, d'où le TypeError mentionné ci-dessus.
Draco18s ne fait plus confiance à SE

2
Cela renvoie exactement le contraire de ce qui est nécessaire. Cela retournera sTRING.
Awol

41

Vous pouvez utiliser cette solution:

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

Ceci est en majuscules, pas en chameau.
nikk wong

2
La casse de chameau est le premier caractère de chaque mot dans une majuscule, et la toCamelCasefonction fait juste cela.
ismnoiet

2
Vous pensez à PascalCase . CamelCase peut être en majuscules ou en minuscules. Dans ce contexte, il est souvent minuscule pour éviter toute confusion.
Kody

1
Merci @Kody, @ cchamberlain pour votre commentaire constructif, consultez la version mise à jour.
ismnoiet

5
+1 pour ne pas utiliser d'expressions régulières, même si la question demandait une solution en les utilisant. C'est une solution beaucoup plus claire, et aussi une victoire évidente pour les performances (car le traitement d'expressions régulières complexes est une tâche beaucoup plus difficile que de simplement itérer sur un tas de chaînes et d'en joindre des morceaux ensemble). Voir jsperf.com/camel-casing-regexp-or-character-manipulation/1 où j'ai pris certains des exemples ici avec celui-ci (et aussi ma propre amélioration modeste pour les performances, bien que je préfère probablement cela pour plus de clarté dans la plupart des cas).
Jules

41

Pour obtenir c amel C ase

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


Pour obtenir C amel S entence C ase ou P ascal C ase

var camelSentence = function camelSentence(str) {
    return  (" " + str).toLowerCase().replace(/[^a-zA-Z0-9]+(.)/g, function(match, chr)
    {
        return chr.toUpperCase();
    });
}

Remarque:
pour ces langues avec des accents. Inclure À-ÖØ-öø-ÿavec l'expression régulière comme suit
.replace(/[^a-zA-ZÀ-ÖØ-öø-ÿ0-9]+(.)/g


4
La meilleure réponse ici - propre et concise.
codeepic

5
ES6 vient de tout mettre en minuscules pour moi
C Bauer

@Luis a ajouté https://stackoverflow.com/posts/52551910/revisionsES6, je ne l'ai pas testé. Je vais vérifier et mettre à jour.
smilyface

Ne fonctionne pas pour les mots avec des accents jsbin.com/zayafedubo/edit?js,console
Manuel Ortiz

1
cela ne fonctionnera pas si vous passez une corde camélisée. Nous devons vérifier si nous avons déjà une chaîne camalisée.
Sheikh Abdul Wahid

27

Dans le cas spécifique de Scott, j'irais avec quelque chose comme:

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

L'expression régulière correspondra au premier caractère s'il commence par une majuscule, et tout caractère alphabétique après un espace, c'est-à-dire 2 ou 3 fois dans les chaînes spécifiées.

En piquant le regex, /^([A-Z])|[\s-_](\w)/gcela camélisera également les noms de type de trait d'union et de soulignement.

'hyphen-name-format'.toCamelCase()     // -> hyphenNameFormat
'underscore_name_format'.toCamelCase() // -> underscoreNameFormat

et s'il y avait plus de 2,3 hypens ou traits de soulignement dans la chaîne comme .data-product-name, .data-product-description, .product-container__actions - price, .photo-placeholder__photo
Ashwani Shukla

1
@AshwaniShukla Pour gérer plusieurs tirets et / ou traits de soulignement, vous devrez ajouter un multiplicateur ( +) au groupe de caractères, c'est-à-dire:/^([A-Z])|[\s-_]+(\w)/g
Fredric

21
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, '' );
}

J'essayais de trouver une fonction JavaScript dans camelCaseune chaîne et je voulais m'assurer que les caractères spéciaux seraient supprimés (et j'avais du mal à comprendre ce que faisaient certaines des réponses ci-dessus). Ceci est basé sur la réponse de cc young, avec des commentaires ajoutés et la suppression des caractères $ peci & l.


10

Exemple fiable et fonctionnel que j'utilise depuis des années:

function camelize(text) {
    text = text.replace(/[-_\s.]+(.)?/g, (_, c) => c ? c.toUpperCase() : '');
    return text.substr(0, 1).toLowerCase() + text.substr(1);
}

Caractères qui changent de casse:

  • trait d'union -
  • souligner _
  • période .
  • espace

9

Si l'expression régulière n'est pas requise, vous voudrez peut-être consulter le code suivant que j'ai créé il y a longtemps pour 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 );
}

Je n'ai fait aucun test de performance, et les versions de regexp pourraient ou non être plus rapides.


5 fois plus rapide en moyenne, si vous n'avez besoin que d'un mot jsbin.com/wuvagenoka/edit?html,js,output
Omu

8

Mon approche 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"

qu'en est-il des noms comme Jean-Pierre?
Max Alexander Hanna

5
return "hello world".toLowerCase().replace(/(?:(^.)|(\s+.))/g, function(match) {
    return match.charAt(match.length-1).toUpperCase();
}); // HelloWorld

5

lodash peut bien sûr faire l'affaire:

var _ = require('lodash');
var result = _.camelCase('toto-ce héros') 
// result now contains "totoCeHeros"

Bien qu'il lodashpuisse s'agir d'une "grande" bibliothèque (~ 4 Ko), elle contient de nombreuses fonctions pour lesquelles vous utiliseriez normalement un extrait de code ou que vous construirez vous-même.


il y a des modules npm avec chaque fonction lodash individuelle, vous n'avez donc pas besoin d'importer toute la "grande" bibliothèque: npmjs.com/package/lodash.camelcase
gion_13

5

Voici une seule ligne qui fait le travail:

const camelCaseIt = string => string.toLowerCase().trim().split(/[.\-_\s]/g).reduce((string, word) => string + word[0].toUpperCase() + word.slice(1));

Il divise la chaîne en minuscules en fonction de la liste de caractères fournie dans RegExp [.\-_\s] (ajoutez-en plus dans le []!) Et renvoie un tableau de mots. Ensuite, il réduit le tableau de chaînes à une chaîne de mots concaténée avec les premières lettres majuscules. Comme la réduction n'a pas de valeur initiale, elle commencera à mettre les premières lettres en majuscules en commençant par le deuxième mot.

Si vous voulez PascalCase, ajoutez simplement une chaîne vide initiale ,'')à la méthode de réduction.


3

en suivant l'approche lisible de @ Scott, un peu de réglage fin

// convertit n'importe quelle chaîne en camelCase
var toCamelCase = function (str) {
  retourne str.toLowerCase ()
    .replace (/ ['"] / g,' ')
    .replace (/ \ W + / g, '')
    .replace (/ (.) / g, function ($ 1) {return $ 1.toUpperCase ();})
    .replace (/ / g, '');
}

3

réponse peu modifiée de Scott:

toCamelCase = (string) ->
  string
    .replace /[\s|_|-](.)/g, ($1) -> $1.toUpperCase()
    .replace /[\s|_|-]/g, ''
    .replace /^(.)/, ($1) -> $1.toLowerCase()

maintenant, il remplace «-» et «_» aussi.


3

Les 14 permutations ci-dessous produisent le même résultat de "EquipmentClassName".

String.prototype.toCamelCase = function() {
  return this.replace(/[^a-z ]/ig, '')  // Replace everything but letters and spaces.
    .replace(/(?:^\w|[A-Z]|\b\w|\s+)/g, // Find non-words, uppercase letters, leading-word letters, and multiple spaces.
      function(match, index) {
        return +match === 0 ? "" : match[index === 0 ? 'toLowerCase' : 'toUpperCase']();
      });
}

String.toCamelCase = function(str) {
  return str.toCamelCase();
}

var testCases = [
  "equipment class name",
  "equipment class Name",
  "equipment Class name",
  "equipment Class Name",
  "Equipment class name",
  "Equipment class Name",
  "Equipment Class name",
  "Equipment Class Name",
  "equipment className",
  "equipment ClassName",
  "Equipment ClassName",
  "equipmentClass name",
  "equipmentClass Name",
  "EquipmentClass Name"
];

for (var i = 0; i < testCases.length; i++) {
  console.log(testCases[i].toCamelCase());
};


Ouais. J'aime l'utilisation de méthodes prototypes avec des chaînes plutôt que des fonctions. Cela aide au chaînage.
russellmania

3

vous pouvez utiliser cette solution:

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('Equipment className'.toCamelCase());


Cet exemple vous montre comment utiliser deux autres fonctions dans la méthode replace.
Chang Hoon Lee

3

Parce que cette question nécessitait encore une autre réponse ...

J'ai essayé plusieurs des solutions précédentes, et toutes avaient un défaut ou un autre. Certains n'ont pas supprimé la ponctuation; certains ne traitaient pas les cas avec des nombres; certains ne géraient pas plusieurs ponctuations d'affilée.

Aucun d'entre eux n'a géré une chaîne comme a1 2b. Il n'y a pas de convention explicitement définie pour ce cas, mais d'autres questions de stackoverflow suggéraient de séparer les nombres par un trait de soulignement.

Je doute que ce soit la réponse la plus performante (trois regex passent par la chaîne, plutôt qu'un ou deux), mais elle passe tous les tests auxquels je peux penser. Pour être honnête, cependant, je ne peux vraiment pas imaginer un cas où vous effectuez autant de conversions de cas de chameau que les performances seraient importantes.

(J'ai ajouté ceci en tant que package npm . Il comprend également un paramètre booléen facultatif pour renvoyer Pascal Case au lieu de 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();
        });
}

Cas de test (Jest)

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

Excellent travail, merci. Gère beaucoup plus de scénarios par rapport aux autres réponses élémentaires.
sean2078 le

2

Voici ma solution:

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('User ID'))


1

Cette méthode semble surpasser la plupart des réponses ici, c'est un peu hacky cependant, pas de remplacement, pas de regex, construisant simplement une nouvelle chaîne qui est 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;
}

1

Cela s'appuie sur la réponse du CMS en supprimant tous les caractères non alphabétiques, y compris les traits de soulignement, ce \wqui ne supprime pas.

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

1

Cas de chameau supérieur ("TestString") à cas de chameau inférieur ("testString") sans utiliser de regex (avouons-le, regex est mauvais):

'TestString'.split('').reduce((t, v, k) => t + (k === 0 ? v.toLowerCase() : v), '');

2
Les paramètres de caractère unique sont encore légèrement mauvais en termes de lisibilité
Danwellman

1

J'ai fini par créer une solution légèrement plus agressive:

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

Celui-ci, ci-dessus, supprimera tous les caractères non alphanumériques et les parties minuscules des mots qui autrement resteraient en majuscules, par exemple

  • Size (comparative) => sizeComparative
  • GDP (official exchange rate) => gdpOfficialExchangeRate
  • hello => hello

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

1

Voici ma suggestion:

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

ou

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

Cas de test:

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

1

Je sais que c'est une vieille réponse, mais cela gère à la fois les espaces et _ (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"

Merci pour cela, mais il semble y avoir un chien errant "en .replace(/_/g", " ")ce que provoque des erreurs de compilation?
Crashalot le

1
const toCamelCase = str =>
  str
    .replace(/[^a-zA-Z0-9]+(.)/g, (m, chr) => chr.toUpperCase())
    .replace(/^\w/, c => c.toLowerCase());

0

EDIT : fonctionne maintenant dans IE8 sans modifications.

EDIT : J'étais dans la minorité de ce qu'est réellement camelCase (caractère principal en minuscules vs majuscules.). La communauté dans son ensemble pense qu'une des majuscules est le cas du chameau et le cas du pascal. J'ai créé deux fonctions qui utilisent uniquement des modèles regex. :) Nous utilisons donc un vocabulaire unifié. J'ai changé ma position pour correspondre à la majorité.


Tout ce dont je pense avoir besoin, c'est d'une seule expression régulière dans les deux cas:

var camel = " THIS is camel case "
camel = $.trim(camel)
    .replace(/[^A-Za-z]/g,' ') /* clean up non-letter characters */
    .replace(/(.)/g, function(a, l) { return l.toLowerCase(); })
    .replace(/(\s.)/g, function(a, l) { return l.toUpperCase(); })
    .replace(/[^A-Za-z\u00C0-\u00ff]/g,'');
// Returns "thisIsCamelCase"

ou

var pascal = " this IS pascal case "
pascal = $.trim(pascal)
  .replace(/[^A-Za-z]/g,' ') /* clean up non-letter characters */
  .replace(/(.)/g, function(a, l) { return l.toLowerCase(); })
  .replace(/(^.|\s.)/g, function(a, l) { return l.toUpperCase(); })
  .replace(/[^A-Za-z\u00C0-\u00ff]/g,'');
// Returns "ThisIsPascalCase"

Dans les fonctions: Vous remarquerez que dans ces fonctions, le remplacement échange tout non az avec un espace contre une chaîne vide. Il s'agit de créer des limites de mots pour la capitalisation. "bonjour-MON # monde" -> "HelloMyWorld"

// remove \u00C0-\u00ff] if you do not want the extended letters like é
function toCamelCase(str) {
    var retVal = '';

    retVal = $.trim(str)
      .replace(/[^A-Za-z]/g, ' ') /* clean up non-letter characters */
      .replace(/(.)/g, function (a, l) { return l.toLowerCase(); })
      .replace(/(\s.)/g, function (a, l) { return l.toUpperCase(); })
      .replace(/[^A-Za-z\u00C0-\u00ff]/g, '');

    return retVal
}

function toPascalCase(str) {
    var retVal = '';

    retVal = $.trim(str)
      .replace(/[^A-Za-z]/g, ' ') /* clean up non-letter characters */
      .replace(/(.)/g, function (a, l) { return l.toLowerCase(); })
      .replace(/(^.|\s.)/g, function (a, l) { return l.toUpperCase(); })
      .replace(/[^A-Za-z\u00C0-\u00ff]/g, '');

    return retVal
}

Remarques:

  • J'ai laissé A-Za-z vs ajouter l'indicateur d'insensibilité à la casse (i) au motif (/ [^ AZ] / ig) pour plus de lisibilité.
  • Cela fonctionne dans IE8 (srsly, qui utilise plus IE8.) En utilisant les outils de développement (F12) que j'ai testés dans IE11, IE10, IE9, IE8, IE7 et IE5. Fonctionne dans tous les modes de document.
  • Cela mettra correctement la première lettre des chaînes commençant par ou sans espace.

Prendre plaisir


La première lettre est toujours en majuscule?
Dave Clarke

Oui. Il sera mis en majuscule dans le cas où il est inférieur ou supérieur pour commencer.
Joe Johnston

2
Eh bien, ce n'est pas le cas du chameau - et ne correspond pas à ce que l'OP a demandé?
Dave Clarke

Espérons que cette modification fournisse les résultats recherchés par l'OP. Pour la vie de moi, je n'avais aucune idée à quoi servait le vote défavorable. Ne pas répondre à l'OP ... Cela le fera. :)
Joe Johnston

1
Je crois que "PascalCase" est ce que nous appelons camelCase avec un capital de premier plan.
Ted Morin

0

Je pense que cela devrait fonctionner.

function cammelCase(str){
    let arr = str.split(' ');
    let words = arr.filter(v=>v!='');
    words.forEach((w, i)=>{
        words[i] = w.replace(/\w\S*/g, function(txt){
            return txt.charAt(0).toUpperCase() + txt.substr(1);
        });
    });
    return words.join('');
}

0

N'utilisez pas String.prototype.toCamelCase () car String.prototypes sont en lecture seule, la plupart des compilateurs js vous donneront cet avertissement.

Comme moi, ceux qui savent que la chaîne ne contiendra toujours qu'un seul espace peuvent utiliser une approche plus simple:

let name = 'test string';

let pieces = name.split(' ');

pieces = pieces.map((word, index) => word.charAt(0)[index===0 ? 'toLowerCase' :'toUpperCase']() + word.toLowerCase().slice(1));

return pieces.join('');

Bonne journée. :)

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.