Case Converter

Case Converter

Chuyển đổi mọi chuỗi sang 11 quy ước đặt tên cùng lúc — camelCase, PascalCase, snake_case, kebab-case và nhiều hơn nữa. Kèm chế độ hàng loạt JSON-keys ghi đệ quy mọi khóa. Tất cả ngay trong trình duyệt của bạn.

Case Converter — TL;DR

Chuyển đổi mọi chuỗi sang 11 quy ước đặt tên cùng lúc — camelCase, PascalCase, snake_case, kebab-case và nhiều hơn nữa. Kèm chế độ hàng loạt JSON-keys ghi đệ quy mọi khóa. Tất cả ngay trong trình duyệt của bạn.

Tất cả đều là cách viết định danh nhiều từ (hoặc tên tệp, URL, lớp CSS) không có dấu cách. camelCase viết hoa mỗi từ sau từ đầu tiên (`userFirstName`), dùng trong JavaScript, Java, Swift. snake_case viết thường mọi thứ và nối bằng dấu gạch dưới (`user_first_name`), dùng trong Python, Ruby, SQL. kebab-case dùng dấu gạch ngang (`user-first-name`), dùng trong CSS, HTML, slug URL, cờ dòng lệnh. PascalCase là camelCase với chữ cái đầu cũng được viết hoa (`UserFirstName`), dùng cho tên lớp / kiểu trong nhiều ngôn ngữ.

Bộ phân tách dùng hai quy tắc ranh giới: thường-sang-hoa (`a` theo sau là `B` = tách) và chuỗi-hoa-rồi-Title (một dãy chữ hoa theo sau là chữ thường sẽ tách trước chữ hoa cuối cùng). Vì vậy `XMLHttpRequest` trở thành `[XML, Http, Request]` → `xml_http_request` / `xmlHttpRequest` / `XmlHttpRequest`. `userIDToken` trở thành `[user, ID, Token]` → `user_id_token`. Điều này khớp với khuyến nghị của hầu hết các hướng dẫn phong cách ngôn ngữ.

Định danh và JSON không bao giờ rời khỏi thiết bị của bạn. Mở DevTools → Network và bạn sẽ thấy không có yêu cầu nào ra ngoài trong lúc chuyển đổi hoặc sao chép.

Mười một quy ước đặt tên, một lần dán

Từ camelCase / snake_case kinh điển đến dot.case / path/case — kèm chế độ hàng loạt JSON-keys để đổi tên mọi khóa trong một đối tượng lồng nhau.

11 kiểu case, tất cả cùng lúc

camelCase, PascalCase, snake_case, CONSTANT_CASE, kebab-case, COBOL-CASE, dot.case, path/case, Title Case, Sentence case, UPPERCASE, lowercase. Dán một lần, thấy mọi kết quả ngay lập tức.

Phân tách token thông minh

Tách định danh chính xác trên mọi kiểu đầu vào — `XMLHttpRequest` → `xml_http_request`, `userIDToken` → `user_id_token`. Xử lý chữ viết tắt, chữ số và các dấu phân tách hỗn hợp (_, -, ., /) không gây nhầm lẫn.

Chế độ hàng loạt JSON-keys

Dán một đối tượng JSON lồng nhau và ghi lại mọi khóa theo kiểu bạn chọn — đệ quy. Tùy chọn chuyển đổi cả giá trị chuỗi. Giữ nguyên mảng, kiểu dữ liệu và cấu trúc.

Sao chép một cú nhấp

Mỗi hàng kết quả có nút sao chép riêng — nhấp vào và giá trị nằm trong clipboard của bạn. Xác nhận trực quan; không spam toast.

Quyền riêng tư theo thiết kế

Mọi chuyển đổi chạy bằng JavaScript trên thiết bị của bạn. Không định danh, không JSON, không hoạt động clipboard nào được truyền đi. Mở DevTools → Network và xác minh không có yêu cầu nào ra ngoài.

Nhỏ gọn + nhanh

JavaScript thuần, không có runtime framework. Tải nguội dưới 25 KB sau khi gzip. Cả 11 chuyển đổi cho mọi chuỗi hoàn tất dưới 1 ms.

Cách sử dụng bộ chuyển đổi

Hai chế độ — chuỗi đơn và hàng loạt JSON-keys.

  1. 1

    Chọn chế độ

    Chuỗi đơn cho một định danh hoặc cụm từ — gõ / dán một lần, thấy cả 11 kết quả case. JSON keys (hàng loạt) khi bạn cần chuyển đổi mọi khóa trong một phản hồi API hoặc tệp cấu hình lồng nhau.

  2. 2

    Dán đầu vào của bạn

    Chế độ chuỗi đơn chấp nhận mọi đầu vào — `userFirstName`, `user_first_name`, `user-first-name`, `USER FIRST NAME`, kể cả `XMLHttpRequest`. Bộ phân tách tách chính xác và nối lại cho mọi kiểu đầu ra. Chế độ JSON chấp nhận mọi đối tượng JSON hợp lệ — độ sâu không quan trọng.

  3. 3

    Chọn kiểu mục tiêu

    Ở chế độ chuỗi đơn, cả 11 kết quả hiện ra cùng lúc — chọn cái bạn cần. Ở chế độ JSON, chọn một case mục tiêu từ menu thả xuống; mọi khóa trong đối tượng được ghi lại theo kiểu đó.

  4. 4

    Sao chép và dán

    Nhấp vào biểu tượng sao chép cạnh hàng kết quả bất kỳ để gửi vào clipboard. Với đầu ra JSON, sao chép cả khối kết quả — thả thẳng vào codebase hoặc API client của bạn.

Được xây dựng cho code review, refactor và đường ống API

Bốn kịch bản phổ biến mà việc dán một lần và nhận mọi kiểu vượt trội so với việc đổi tên thủ công.

Ranh giới Backend ↔ Frontend

Backend cho bạn `user_first_name`; frontend muốn `userFirstName`. Dán, sao chép, dán — xong. Dùng chế độ hàng loạt JSON để chuyển đổi mọi khóa trong một phản hồi API mẫu trong một bước (rồi viết mẫu codegen dựa trên kết quả).

Refactor giữa các ngôn ngữ

Đang chuyển một thư viện Python sang JavaScript? Lấy các định danh snake_case của nguồn Python và chạy qua đầu ra camelCase. Thả kết quả vào bản port JS của bạn. Bộ phân tách thông minh xử lý `__double_underscore` và chữ số ở cuối mà không bị lỗi.

Biến ENV ↔ cấu hình runtime

Chuyển một `MY_AWESOME_FEATURE_FLAG` (quy ước biến env) sang `myAwesomeFeatureFlag` (biến JS) hoặc `my_awesome_feature_flag` (Python). Vòng quay CONSTANT_CASE / camelCase / snake_case là chính xác.

Đặt tên CSS / tệp

BEM yêu cầu kebab-case: `.user-card__avatar--large`. Có một tên biến JS từ nhà thiết kế (`userCardAvatarLarge`)? Chuyển đổi trong một bước. Hữu ích cho tiện ích Tailwind, tên gói npm, slug URL và tên cờ CLI — tất cả đều ưa kebab-case.

100% riêng tư — chạy trong trình duyệt của bạn

Định danh và JSON không bao giờ rời khỏi thiết bị của bạn. Mở DevTools → Network và bạn sẽ thấy không có yêu cầu nào ra ngoài trong lúc chuyển đổi hoặc sao chép.

  • Mọi việc phân tách token, chuyển đổi case và duyệt JSON đều chạy dưới dạng JavaScript trên máy của bạn — hiển thị trong mã nguồn trang.
  • Việc ghi vào clipboard sử dụng API navigator.clipboard.writeText chuẩn; không có gì được ghi log.
  • Không đăng nhập, không telemetry trên giá trị định danh, không API bên thứ ba. Chúng tôi chỉ dùng một cookie cho trạng thái đồng ý cookie và một cho tùy chọn ngôn ngữ.

Hướng dẫn liên quan

Bài đọc được tuyển chọn về quy ước đặt tên, thiết kế API và refactor.

Câu hỏi thường gặp

Sự khác biệt giữa camelCase, snake_case và kebab-case là gì?

Tất cả đều là cách viết định danh nhiều từ (hoặc tên tệp, URL, lớp CSS) không có dấu cách. camelCase viết hoa mỗi từ sau từ đầu tiên (`userFirstName`), dùng trong JavaScript, Java, Swift. snake_case viết thường mọi thứ và nối bằng dấu gạch dưới (`user_first_name`), dùng trong Python, Ruby, SQL. kebab-case dùng dấu gạch ngang (`user-first-name`), dùng trong CSS, HTML, slug URL, cờ dòng lệnh. PascalCase là camelCase với chữ cái đầu cũng được viết hoa (`UserFirstName`), dùng cho tên lớp / kiểu trong nhiều ngôn ngữ.

Bộ phân tách thông minh xử lý chữ viết tắt như thế nào?

Bộ phân tách dùng hai quy tắc ranh giới: thường-sang-hoa (`a` theo sau là `B` = tách) và chuỗi-hoa-rồi-Title (một dãy chữ hoa theo sau là chữ thường sẽ tách trước chữ hoa cuối cùng). Vì vậy `XMLHttpRequest` trở thành `[XML, Http, Request]` → `xml_http_request` / `xmlHttpRequest` / `XmlHttpRequest`. `userIDToken` trở thành `[user, ID, Token]` → `user_id_token`. Điều này khớp với khuyến nghị của hầu hết các hướng dẫn phong cách ngôn ngữ.

Chế độ hàng loạt JSON-keys làm gì?

Dán một đối tượng JSON — kể cả lồng sâu — và chọn kiểu case mục tiêu. Công cụ duyệt toàn bộ cây theo chiều sâu, chuyển đổi mọi khóa (kể cả khóa trong mảng) và xuất ra JSON đã được dựng lại. Mảng, kiểu dữ liệu (number / boolean / null) và cấu trúc được giữ nguyên chính xác. Bật "Đồng thời chuyển đổi giá trị chuỗi" để bổ sung ghi lại nội dung của mọi trường có giá trị là chuỗi qua cùng bộ phân tách.

Tôi nên dùng quy ước nào cho dự án của mình?

Trước hết tuân theo quy ước chủ đạo của ngôn ngữ, sau đó là nhóm của bạn. Mặc định: camelCase cho JS / Java / Swift / Kotlin / Go (tên xuất khẩu dùng PascalCase), snake_case cho Python / Ruby / Rust / cột SQL, kebab-case cho lớp CSS / thuộc tính HTML / đường dẫn URL / gói npm / cờ CLI, SCREAMING_SNAKE_CASE cho biến môi trường và hằng số ngôn ngữ. Khi chuyển đổi giữa các tầng (snake_case API → camelCase frontend), chọn một ranh giới duy nhất và giữ phần còn lại của hệ thống nhất quán.

Có bất kỳ thứ gì được gửi đến máy chủ của bạn không?

Không. Phân tách token, mọi chuyển đổi và chế độ hàng loạt JSON-keys đều chạy dưới dạng JavaScript trong trình duyệt của bạn. Mở DevTools → Network và bạn sẽ thấy không có yêu cầu nào ra ngoài trong khi sử dụng. Chúng tôi dùng một cookie cho trạng thái đồng ý cookie và một cho tùy chọn ngôn ngữ, chỉ vậy thôi.