Chuyển đổi bất kỳ chuỗi thành trường hợp lạc đà


170

Làm cách nào tôi có thể chuyển đổi một chuỗi thành trường hợp lạc đà bằng cách sử dụng regex javascript?

EquipmentClass namehoặc Equipment classNamehoặc equipment class namehoặcEquipment Class Name

tất cả nên trở thành : equipmentClassName.


1
Tôi đã thực hiện một thử nghiệm jsperf của các phương pháp khác nhau. kết quả hơi không kết luận. nó dường như phụ thuộc vào chuỗi đầu vào.
yincrash


Một thử nghiệm jsperf mới với một vài chuỗi khác nhau để thử nghiệm và nhiều cách triển khai khác nhau: jsperf.com/camel-casing-regapi-or-character-manipulation/1 - điều này dẫn tôi đến kết luận rằng đối với trường hợp trung bình, mặc dù câu hỏi của người hỏi về câu hỏi này, các biểu thức chính quy không phải là điều bạn muốn. Không chỉ khó hiểu hơn nhiều, chúng còn (ít nhất là đối với các phiên bản Chrome hiện tại) mất khoảng gấp đôi thời gian để chạy.
Jules

Câu trả lời:


237

Nhìn vào mã của bạn, bạn có thể đạt được nó chỉ với hai replacecuộc gọi:

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"

Chỉnh sửa: Hoặc trong một replacecuộc gọi duy nhất , chụp các khoảng trắng cũng trong 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
Mã tuyệt vời, và nó đã giành chiến thắng jsperf.com/js-camelcase/5 . Muốn đóng góp một phiên bản có thể xử lý (loại bỏ) ký tự không alpha? camelize("Let's Do It!") === "let'SDoIt!" mặt buồn . Tôi sẽ thử bản thân mình nhưng sợ tôi sẽ chỉ thay thế một cái khác.
Orwellophile

2
.. vì phi alpha không ảnh hưởng đến vụ án, tôi không chắc nó có thể được thực hiện tốt hơn return this.replace(/[^a-z ]/ig, '').replace(/(?:^\w|[A-Z]|\b\w|\s+)/g,...
Orwellophile

4
Đối với bạn bè ES2015 + của tôi: một lớp lót dựa trên mã trên. const toCamelCase = (str) => str.replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');
tabrindle

2
Mặc dù đây không phải là một trường hợp được hỏi bằng ví dụ, một đầu vào phổ biến khác mà bạn có thể thấy là "TÊN LỚP THIẾT BỊ", mà phương pháp này thất bại.
Alexander Tsepkov

1
@EdmundReed bạn chỉ có thể chuyển đổi toàn bộ chuỗi thành chữ thường trước khi chuyển đổi sang trường hợp lạc đà bằng cách xâu chuỗi .toLowerCase()phương thức trong. Ví dụ: sử dụng giải pháp của @ tabrindle ở trên:const toCamelCase = (str) => str.toLowerCase().replace(/(?:^\w|[A-Z]|\b\w)/g, (ltr, idx) => idx === 0 ? ltr.toLowerCase() : ltr.toUpperCase()).replace(/\s+/g, '');
bitfidget

102

Nếu bất cứ ai đang sử dụng lodash , có một _.camelCase()chức năng.

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

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

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

2
Câu trả lời này chắc chắn sẽ xuất hiện xa hơn. Lodash cung cấp một bộ hoàn chỉnh để chuyển đổi các chuỗi giữa các trường hợp khác nhau.
btx

55

Tôi vừa mới kết thúc việc này:

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

Tôi đã cố gắng tránh xâu chuỗi nhiều câu thay thế. Một cái gì đó mà tôi có $ 1, $ 2, $ 3 trong chức năng của mình. Nhưng kiểu nhóm này rất khó hiểu và việc bạn đề cập đến các vấn đề trên trình duyệt chéo là điều tôi chưa bao giờ nghĩ tới.


1
Điều đó có vẻ tốt đối với tôi, và không có gì đáng nghi về vấn đề trình duyệt chéo. (Không phải tôi là siêu chuyên gia hay gì cả.)
Pointy

47
Nếu bạn sẽ sử dụng String.prototype, tại sao không sử dụng 'this' thay vì gửi tham số 'str'?
yincrash

6
Để tương thích trình duyệt tốt hơn, vui lòng sử dụng tùy chọn này thay vì str (và xóa tham số khỏi lệnh gọi hàm)
João Paulo Motta

2
Bạn chỉ cần sử dụng this.valueOf()thay vì vượt qua str. Ngoài ra (như trong trường hợp của tôi) this.toLowerCase()vì các chuỗi đầu vào của tôi nằm trong TẤT CẢ CAPS không có các phần không bướu được hạ thấp đúng cách. Việc sử dụng chỉ thistrả về chính đối tượng chuỗi, thực sự là một mảng char, do đó TypeError đã đề cập ở trên.
Draco18 không còn tin tưởng SE

2
Điều này trả về chính xác ngược lại với những gì cần thiết. Điều này sẽ trở lại sTRING.
Awol

41

Bạn có thể sử dụng giải pháp này:

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

Đây là chữ hoa, không phải lạc đà.
nikk wong

2
Trường hợp lạc đà là ký tự đầu tiên của mỗi từ trong trường hợp viết hoa và toCamelCasechức năng chỉ thực hiện điều đó.
ismnoiet

2
Bạn đang nghĩ về PascalCase . CamelCase có thể là chữ hoa hoặc chữ thường. Trong bối cảnh này, thường là trường hợp thấp hơn để tránh nhầm lẫn.
Kody

1
Cảm ơn @Kody, @ cchamberlain vì nhận xét mang tính xây dựng của bạn, hãy kiểm tra phiên bản cập nhật.
ismnoiet

5
+1 vì không sử dụng biểu thức thông thường, ngay cả khi câu hỏi yêu cầu giải pháp sử dụng chúng. Đây là một giải pháp rõ ràng hơn và cũng là một chiến thắng rõ ràng cho hiệu suất (bởi vì xử lý các biểu thức chính quy phức tạp là một nhiệm vụ khó khăn hơn nhiều so với việc lặp qua một chuỗi các chuỗi và nối các bit của chúng lại với nhau). Xem jsperf.com/camel-casing-regapi-or-character-manipulation/1 trong đó tôi đã lấy một số ví dụ ở đây cùng với ví dụ này (và cũng là cải tiến khiêm tốn của riêng tôi về hiệu suất, mặc dù tôi có thể thích điều này hơn phiên bản cho sự rõ ràng trong hầu hết các trường hợp).
Jules

40

Để có được 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());
}


Để có được C amel S, hãy tham gia C ase hoặc P ascal C ase

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

Lưu ý:
Đối với những ngôn ngữ có dấu. Bao gồm À-ÖØ-öø-ÿvới regex như sau
.replace(/[^a-zA-ZÀ-ÖØ-öø-ÿ0-9]+(.)/g


3
Câu trả lời tốt nhất ở đây - sạch sẽ và súc tích.
codeepic

5
ES6 chỉ tạo ra mọi thứ chữ thường cho tôi
C Bauer

@Luis đã thêm https://stackoverflow.com/posts/52551910/revisionsES6, tôi chưa thử nó. Tôi sẽ kiểm tra và cập nhật.
smilyface

Không hoạt động cho các từ có dấu jsbin.com/zayafedubo/edit?js,console
Manuel Ortiz

1
nó sẽ không hoạt động nếu bạn vượt qua chuỗi camelized. Chúng ta cần kiểm tra xem chúng ta đã có chuỗi camalized chưa.
Sheikh Abdul Wahid

27

Trong trường hợp cụ thể của Scott, tôi sẽ sử dụng một cái gì đó như:

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

Regex sẽ khớp với ký tự đầu tiên nếu nó bắt đầu bằng chữ in hoa và bất kỳ ký tự chữ cái nào theo sau khoảng trắng, tức là 2 hoặc 3 lần trong các chuỗi được chỉ định.

Bằng cách thêm vào biểu thức chính quy, /^([A-Z])|[\s-_](\w)/gnó cũng sẽ hiển thị tên gạch nối và gạch dưới.

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

Điều gì xảy ra nếu có hơn 2,3 hypens hoặc dấu gạch dưới trong chuỗi như .data-tên-sản phẩm, .data-sản phẩm-mô tả, .product-container__ilities - price, .photo-placeholder__photo
Ashwani Shukla

1
@AshwaniShukla Để xử lý nhiều dấu gạch ngang và / hoặc dấu gạch dưới, bạn sẽ phải thêm một số nhân ( +) vào nhóm nhân vật, tức là:/^([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, '' );
}

Tôi đã cố gắng tìm một hàm JavaScript thành camelCasemột chuỗi và muốn đảm bảo các ký tự đặc biệt sẽ bị xóa (và tôi gặp khó khăn khi hiểu một số câu trả lời ở trên đang làm gì). Điều này dựa trên câu trả lời của cc young, với các bình luận bổ sung và loại bỏ các ký tự $ peci & l.


10

Ví dụ hoạt động đáng tin cậy mà tôi đã sử dụng trong nhiều năm:

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

Nhân vật thay đổi trường hợp:

  • gạch nối -
  • gạch dưới _
  • giai đoạn = Stage .
  • không gian

9

Nếu không yêu cầu regrec, bạn có thể muốn xem mã sau tôi đã tạo từ lâu cho 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 );
}

Tôi chưa thực hiện bất kỳ thử nghiệm hiệu suất nào và các phiên bản regrec có thể hoặc không thể nhanh hơn.


Trung bình nhanh hơn gấp 5 lần, nếu bạn chỉ cần 1 từ jsbin.com/wuvagenoka/edit?html,js,output
Omu

8

Cách tiếp cận ES6 của tôi :

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"

Còn những cái tên như Jean-Pierre thì sao?
Max Alexander Hanna

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

5

lodash có thể thực hiện các mẹo chắc chắn và tốt:

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

Mặc dù lodashcó thể là một thư viện "lớn" (~ 4kB), nhưng nó chứa rất nhiều chức năng mà bạn thường sử dụng một đoạn trích hoặc tự xây dựng.


có các mô-đun npm với mỗi chức năng phát hành riêng lẻ, vì vậy bạn không cần nhập tất cả thư viện "lớn": npmjs.com/package/lodash.camelcase
gion_13

5

Đây là một lớp lót làm việc:

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

Nó phân tách chuỗi ký tự thấp hơn dựa trên danh sách các ký tự được cung cấp trong RegExp [.\-_\s] (thêm nhiều hơn vào bên trong []!) Và trả về một mảng từ. Sau đó, nó giảm mảng các chuỗi thành một chuỗi các từ được ghép nối với các chữ cái đầu tiên được viết hoa. Bởi vì giảm không có giá trị ban đầu, nó sẽ bắt đầu viết hoa các chữ cái đầu tiên bắt đầu bằng từ thứ hai.

Nếu bạn muốn PascalCase, chỉ cần thêm một chuỗi trống ban đầu ,'')vào phương thức rút gọn.


3

theo cách tiếp cận dễ đọc của @ Scott, một chút tinh chỉnh

// chuyển đổi bất kỳ chuỗi nào sang camelCase
var toCamelCase = function (str) {
  trả về str.toLowerCase ()
    .replace (/ ['"] / g,' ')
    .replace (/ \ W + / g, '')
    .replace (/ (.) / g, hàm ($ 1) {return $ 1.toUpperCase ();})
    .replace (/ / g, '');
}

3

ít sửa đổi câu trả lời của Scott:

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

bây giờ nó cũng thay thế '-' và '_'.


3

Tất cả 14 hoán vị dưới đây tạo ra cùng một kết quả của "deviceClassName".

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


Vâng. Tôi thích việc sử dụng các phương thức nguyên mẫu với các chuỗi hơn là các hàm. Nó giúp với chuỗi.
russellmania

3

bạn có thể sử dụng giải pháp này:

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


Ví dụ này cho bạn thấy cách sử dụng hai hàm khác trong phương thức thay thế.
Chang Hoon Lee

3

Bởi vì câu hỏi này cần một câu trả lời khác ...

Tôi đã thử một vài giải pháp trước đây và tất cả chúng đều có một lỗi. Một số đã không xóa dấu câu; một số không xử lý các trường hợp với số; một số không xử lý nhiều dấu câu liên tiếp.

Không ai trong số họ xử lý một chuỗi như a1 2b. Không có quy ước được xác định rõ ràng cho trường hợp này, nhưng một số câu hỏi stackoverflow khác đề nghị tách các số bằng dấu gạch dưới.

Tôi nghi ngờ đây là câu trả lời hiệu quả nhất (ba regex đi qua chuỗi, thay vì một hoặc hai), nhưng nó vượt qua tất cả các bài kiểm tra tôi có thể nghĩ ra. Thành thật mà nói, tôi thực sự không thể tưởng tượng được một trường hợp bạn đang thực hiện quá nhiều chuyển đổi trường hợp lạc đà mà hiệu suất sẽ quan trọng.

(Tôi đã thêm gói này dưới dạng gói npm . Nó cũng bao gồm một tham số boolean tùy chọn để trả về Trường hợp Pascal thay vì Trường hợp lạc đà.)

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

Các trường hợp thử nghiệm (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`);
});

Tuyệt vời, cảm ơn bạn. Xử lý nhiều kịch bản hơn so với các câu trả lời cơ bản khác.
sean2078

2

Có giải pháp của tôi:

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

Phương pháp này dường như vượt trội hơn hầu hết các câu trả lời ở đây, tuy nhiên hơi khó hiểu, không thay thế, không regex, chỉ đơn giản là xây dựng một chuỗi mới đó là 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

Điều này được xây dựng dựa trên câu trả lời của CMS bằng cách loại bỏ bất kỳ ký tự không phải chữ cái nào bao gồm cả dấu gạch dưới, \wkhông xóa.

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

Vỏ lạc đà trên ("TestString") đến vỏ lạc đà thấp hơn ("testString") mà không sử dụng regex (hãy đối mặt với nó, regex là xấu xa):

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

2
Các tham số ký tự đơn vẫn hơi xấu về khả năng đọc
danwellman

1

Tôi đã kết thúc việc tạo ra một giải pháp tích cực hơn một chút:

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

Cái này, ở trên, sẽ loại bỏ tất cả các ký tự không phải là chữ và số và các phần chữ thường của các từ còn lại được viết hoa, ví dụ:

  • 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

Đây là gợi ý của tôi:

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

hoặc là

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

Các trường hợp thử nghiệm:

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

Tôi biết đây là một câu trả lời cũ, nhưng điều này xử lý cả khoảng trắng và _ (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"

Cảm ơn vì điều này, nhưng dường như có một sự đi lạc "trong .replace(/_/g", " ")đó gây ra lỗi biên dịch?
Crashalot

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

0

BIÊN TẬP : Hiện đang hoạt động trong IE8 mà không thay đổi.

EDIT : Tôi đã ở thiểu số về việc camelCase thực sự là gì (Chữ thường viết hoa so với chữ hoa.). Cộng đồng nói chung tin rằng một chữ thường hàng đầu là trường hợp lạc đà và một thủ đô hàng đầu là trường hợp pascal. Tôi đã tạo hai hàm chỉ sử dụng các mẫu regex. :) Vì vậy, chúng tôi sử dụng một từ vựng thống nhất tôi đã thay đổi lập trường của mình để phù hợp với đa số.


Tất cả tôi tin rằng bạn cần là một regex duy nhất trong cả hai trường hợp:

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"

hoặc là

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"

Trong các hàm: Bạn sẽ nhận thấy rằng trong các hàm này, sự thay thế đang hoán đổi bất kỳ non az nào bằng một khoảng trắng so với một chuỗi rỗng. Điều này là để tạo ranh giới từ cho viết hoa. "xin chào-thế giới # của tôi" -> "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
}

Ghi chú:

  • Tôi đã rời A-Za-z so với việc thêm cờ không nhạy cảm trường hợp (i) vào mẫu (/ [^ AZ] / ig) để dễ đọc.
  • Điều này hoạt động trong IE8 (srsly, người sử dụng IE8 nữa.) Sử dụng các công cụ dev (F12) mà tôi đã thử nghiệm trong IE11, IE10, IE9, IE8, IE7 và IE5. Hoạt động trong tất cả các chế độ tài liệu.
  • Điều này sẽ chính xác trường hợp chữ cái đầu tiên của chuỗi bắt đầu có hoặc không có khoảng trắng.

Thưởng thức


Chữ cái đầu tiên vẫn được viết hoa?
Dave Clarke

Đúng. Nó sẽ được viết hoa trong trường hợp thấp hơn hoặc cao hơn để bắt đầu.
Joe Johnston

2
Chà đó không phải là trường hợp lạc đà - và không khớp với những gì OP yêu cầu?
Dave Clarke

Cũng hy vọng bản chỉnh sửa này cung cấp kết quả mà OP đang tìm kiếm. Đối với cuộc sống của tôi, tôi không biết downvote là để làm gì. Không trả lời OP ... Điều đó sẽ làm điều đó. :)
Joe Johnston

1
Tôi tin rằng "PascalCase" là cái mà chúng ta gọi là camelCase với số vốn hàng đầu.
Ted Morin

0

Tôi nghĩ rằng điều này sẽ làm việc..

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

Không sử dụng String.prototype.toCamelCase () vì String.prototypes chỉ đọc, hầu hết các trình biên dịch js sẽ đưa ra cảnh báo này.

Giống như tôi, những người biết rằng chuỗi sẽ luôn chỉ chứa một khoảng trắng có thể sử dụng một cách tiếp cận đơn giản hơn:

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

Chúc bạn ngày mới tốt lành. :)

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.