Cách chuyển đổi chuỗi thành kiểu Camel Case bằng JavaScript

adminBạn nghĩ gì về bài viết này?

Đôi khi, bạn muốn chuyển đổi một chuỗi JavaScript thành kiểu Camel Case bằng JavaScript nhưng không biết cách nào.

Trong bài viết này, cùng mình xem cách chuyển đổi bất kỳ chuỗi nào thành kiểu Camel Case bằng JavaScript.

Kiểu Camel Case là gì?

CamelCase là kiểu viết code theo dạng lạc đà (u bướu) mà chắc ai cũng dễ dàng nhận ra khi mới bắt đầu học code. Các chữ cái đầu từ đều được viết hoa. Style này dùng đặt tên biến, tên function… thường sẽ xuất hiện ở những ngôn ngữ lập trình: java, javascript, php…

Ví dụ: 

var productItems;

function checkNumber() {};Code language: JavaScript (javascript)

Kiểu lạc đà kết hợp các từ bằng cách viết hoa tất cả các từ theo từ đầu tiên và xóa không gian, như sau:

Kiểu Gốc: user login count
Kiểu Camel Case: userLoginCount

Đây là một cách rất phổ biến để kết hợp các từ để tạo thành một tên biến. Nó thường được sử dụng như một quy ước trong khai báo biến trong nhiều ngôn ngữ.

Sử dụng phương thức String.prototype.replace

Bạn có thể sử dụng phương pháp replace của các phiên bản chuỗi để chuyển đổi từng từ trong chuỗi, và để chuyển đổi từ đầu tiên thành chữ thường, các từ còn lại thành chữ hoa, sau đó xóa khoảng trắng.

Để làm điều này, tôi viết:

const camelize = (str) => {
  return str.replace(/(?:^\w|[A-Z]|\b\w)/g, (word, index) => {
    return index === 0 ? word.toLowerCase() : word.toUpperCase();
  }).replace(/\s+/g, '');
}

console.log(camelize("EquipmentClass name"));Code language: JavaScript (javascript)

Tôi gọi replace với một regex tìm kiếm ranh giới từ với \b và \w.

\b phù hợp với một khoảng lùi.

\w khớp với bất kỳ ký tự chữ và số nào từ bảng chữ cái Latinh.

Tôi kiểm tra index để xác định xem đó có phải là từ đầu tiên hay không.

Nếu nó là 0, thì bạn quay lại word.toLowerCase() để chuyển đổi ký tự đầu tiên của từ thành chữ thường vì đó là từ đầu tiên.

Nếu không, bạn quay lại word.toUpperCase để chuyển đổi ký tự đầu tiên của từ thành chữ hoa.

Sau đó, chúng tôi gọi replace lần nữa với \s+/g và một chuỗi trống để thay thế các khoảng trắng bằng các chuỗi trống.

Do đó, camelize trả về kết quả 'equipmentClassName’.

Phương pháp lạc đà Lodash

Chúng ta có thể sử dụng phương thức Lodash camelCase để chuyển đổi bất kỳ chuỗi nào thành lạc đà giống như cách hàm camelize làm.

Ví dụ, chúng ta có thể viết:

console.log(_.camelCase("EquipmentClass name"));Code language: JavaScript (javascript)

Sau đó, tôi nhận được kết quả tương tự như ví dụ trước.

Kết thúc

Bạn có thể chuyển đổi bất kỳ chuỗi JavaScript nào thành kiểu Camel Case bằng phương thức String.prototype.replace hoặc phương thức camelCase.

Cảm ơn bạn đã theo dõi bài viết!

Các bạn có thể tham khảo các bài viết hay về JavaScript tại đây.

Hãy tham gia nhóm Học lập trình để thảo luận thêm về các vấn đề cùng quan tâm.

TỔNG HỢP TÀI LIỆU HỌC LẬP TRÌNH CƠ BẢN CHO NGƯỜI MỚI BẮT ĐẦU

KHOÁ HỌC BOOTCAMP JAVA/JAVASCRIPT/PHP TRỞ THÀNH LẬP TRÌNH VIÊN TRONG 5-6 THÁNG

Bình luận