Перейти до основного вмісту

Як перетворити текст на camelCase, snake_case, kebab-case і PascalCase

Автор: Converty Team

Дізнайтеся, як перетворити текст на camelCase, snake_case, kebab-case і PascalCase, не перетворюючи очищення імен на переписування вручну.

Як перетворити текст на camelCase, snake_case, kebab-case і PascalCase

Очищення імен — одна з тих невеликих робіт, які з’являються в багатьох різних місцях. Назва продукту має стати URL-адресою slug. Заголовок електронної таблиці має стати назвою властивості. Маркеру CSS потрібен передбачуваний ідентифікатор. Примітка з файлу дизайну має стати чимось, що розробник зможе вставити в код, не переписуючи кожне слово вручну.

Важко не зрозуміти, що означає camelCase, snake_case, kebab-case або PascalCase. Складна частина полягає в послідовному застосуванні того самого правила, коли у вихідному тексті є пробіли, знаки пунктуації, великі літери та змішані роздільники. Саме тут допомагає зосереджений робочий процес Case / Slug / Escape. Вставте вихідний текст один раз, перегляньте разом варіанти регістру та скопіюйте результат, який відповідає наступній системі.

Чому перетворення регістру має значення в реальній роботі

Перетворення регістру знаходиться між написанням і впровадженням. Фраза, зрозуміла для людей, зазвичай не є зручною для машин.

Уявіть позначку функції під назвою «Новий банер оформлення замовлення». У примітці про продукт використовується регістр назви. Для коду може знадобитися newCheckoutBanner. Файл конфігурації може очікувати new_checkout_banner. Сегмент маршруту або клас CSS може віддати перевагу new-checkout-banner. Одна і та сама ідея проходить через кілька систем, і кожне ручне переписування є невеликою можливістю для дрейфу.

Така ж проблема виникає в операціях із вмістом. Заголовок стає slug. Назва кампанії стає ключем відстеження. Мітка підтримки стає внутрішнім ідентифікатором. Якщо кожна особа переписує ім’я по-різному, роботу стає важче шукати, порівнювати та підтримувати.

Як конвертувати текст у типові формати регістру

Найшвидший робочий процес полягає в тому, щоб зберегти вихідну фразу видимою та створити ймовірні результати поруч.

  1. Відкрийте інструмент Case / Slug / Escape.
  2. Вставте фразу, мітку, заголовок або ідентифікатор, які потрібно нормалізувати.
  3. Порівняйте згенеровані результати camelCase, PascalCase, snake_case і kebab-case.
  4. Скопіюйте форму, яка відповідає системі призначення.
  5. Тримайте вихідну фразу поблизу, якщо комусь знадобиться пізніше підтвердити зрозумілу людині назву.

Це краще, ніж редагувати роздільники вручну, оскільки правило застосовується один раз. Ви не здогадуєтеся, чи має слово залишатися великими, чи розділовий знак має стати роздільником. Ви перетворюєте фразу на передбачувані результати.

Який регістр слід використовувати?

Різні стилі регістру зазвичай відповідають різним адресатам.

ФорматЗагальне використанняПрактична причина
camelCaseЗмінні JavaScript, ключі об’єктів, імена станів інтерфейсу користувачаКомпактний і звичайний код інтерфейсу
PascalCaseІмена компонентів, імена класів, експортовані типиЗберігає іменовані кодові одиниці легкими для сканування
snake_caseПоля даних, заголовки, отримані з CSV, деякі APIПрозорі роздільники зі стабільністю в нижньому регістрі
kebab-caseURL slugs, сегменти маршруту, CSS-подібні міткиЧитається в контурах і контекстах із дефісами

Важлива частина полягає в тому, щоб не розглядати один стиль як універсально правильний. Правильний вивід — це той, який підходить до того місця, де далі йде текст.

Використовуйте той самий пароль для slugs і екранування

Очищення регістру часто з’являється поруч із іншим очищенням тексту. Після того, як заголовок стане kebab-case, можливо, він також повинен стати чистою URL-адресою slug. Після того, як фрагмент стане ідентифікатором, пов’язане значення може потребувати екранування URL-адреси, HTML або JSON, перш ніж його можна буде безпечно вставити в інше місце.

Ось чому Converty зберігає регістр, slug і вихідні сигнали разом. Інструмент не намагається стати системою керування вмістом або редактором коду. Це короткий оперативний крок для перетворення грубого тексту на форми, які очікують публікація, маршрутизація та впровадження.

Щоб отримати ширший робочий процес запуску, який поєднує slugs з Markdown і підготовкою піктограми, прочитайте Як команди контенту можуть підготувати Slugs, Markdown і Favicons для нового запуску. Якщо наступне запитання стосується кодування, а не найменування, перейдіть до Коли використовувати кодування URL-адреси, екранування HTML і екранування JSON.

Відкрийте інструмент Case / Slug / Escape, коли наступне завдання перетворює грубу фразу на передбачуваний ідентифікатор, slug або екранований рядок.

Вам також може сподобатися