camelCase מול snake_case מול kebab-case: מה לבחור

camelCase מול snake_case מול kebab-case היא בעיקר שאלה של המקום שבו השם חי. JavaScript ו-Java משתמשים ב-camelCase (firstName), Python, Ruby ו-SQL משתמשים ב-snake_case (first_name), ו-CSS, מאפייני HTML וכתובות URL משתמשים ב-kebab-case (first-name). פעלו לפי המוסכמה של השפה ולפי מדריך הסגנון של הצוות. כדי להחליף טקסט בין אותיות גדולות לקטנות, ממיר האותיות החינמי ומחולל הסלאג החינמי לכתובות מכסים את רוב העבודה בדפדפן.

camelCase מול snake_case מול kebab-case במבט מהיר

סגנון	דוגמה	איפה רואים אותו
camelCase	userFirstName	משתנים ופונקציות ב-JavaScript וב-TypeScript, מתודות ב-Java, JSON מ-APIs רבים באינטרנט
PascalCase	UserFirstName	שמות מחלקות ברוב השפות, רכיבי React, מתודות ב-C#
snake_case	user_first_name	משתנים ופונקציות ב-Python, ב-Ruby, שמות עמודות ב-SQL, JSON של APIs רבים
SCREAMING_SNAKE_CASE	USER_FIRST_NAME	קבועים בשפות רבות, משתני סביבה
kebab-case	user-first-name	מאפייני ומחלקות CSS, מאפייני HTML, כתובות URL, שמות קבצים, דגלים של CLI

השמות נובעים מהצורה שלהם: ב-camelCase יש "גבנונים" של אותיות גדולות, snake_case שטוח על קווים תחתונים, ומילים ב-kebab-case נשזרות על מקפים כמו על שפוד.

שפה אחרי שפה

JavaScript ו-TypeScript. משתנים ופונקציות הם camelCase (getUserName), מחלקות ורכיבי React הם PascalCase (UserCard), וקבועים הם לעיתים SCREAMING_SNAKE_CASE (MAX_RETRIES). גם הפונקציות המובנות של השפה עוקבות אחרי הכלל הזה, כמו getElementById ו-toLowerCase.

Python. PEP 8, מדריך הסגנון של Python, משתמש ב-snake_case לפונקציות, למשתנים ולשמות מודולים, ב-CapWords (PascalCase) למחלקות, ובאותיות גדולות עם קווים תחתונים לקבועים. כתיבת getUserName ב-Python עובדת, אבל תיראה לא במקומה לכל מפתח Python שיקרא אותה.

CSS ו-HTML. מאפייני CSS הם kebab-case (background-color, font-size), ורוב מערכות שמות המחלקות עוקבות אחריהם (.nav-item, .card-title). מאפייני data- ב-HTML הם גם kebab-case, והדפדפנים ממירים אותם עבור JavaScript: data-user-id הופך ל-element.dataset.userId. השורה הזו מסכמת היטב מדוע שתי המוסכמות קיימות.

SQL ומסדי נתונים. שמות עמודות וטבלאות הם בדרך כלל snake_case (created_at, order_items). במסדי נתונים רבים שמות לא מצוטטים מומרים לאותיות גדולות או קטנות אחידות, כך ש-createdAt עלול להפוך בשקט ל-createdat אלא אם מצטטים אותו בכל פעם. snake_case נמנע מכך.

כתובות URL ושמות קבצים. השתמשו ב-kebab-case. ההנחיות של Google למבנה כתובות URL ממליצות על מקפים ולא על קווים תחתונים להפרדה בין מילים, כי מקפים מסמנים בבירור את גבולות המילים. אותיות קטנות גם מונעות קישורים שבורים בשרתים שמתייחסים אל About.html ואל about.html כאל קבצים שונים. ראו מהו סלאג בכתובת ואת השיטות המומלצות לסלאג בכתובת שלנו.

JSON ו-APIs. אין כלל אחד. APIs רבים שמבוססים על JavaScript משתמשים ב-camelCase, ושרתי Python או Ruby רבים מחזירים snake_case. בחרו סגנון אחד לכל API ואל תערבבו אותם באותה תשובה.

איזה סגנון קל יותר לקריאה?

שלושתם קריאים אחרי שמתרגלים אליהם. כמה הבדלים מעשיים:

• snake_case ו-kebab-case שומרים על רווח ברור בין המילים, וזה עוזר בשמות ארוכים ובראשי תיבות (html_parser מול htmlParser מול HTMLParser).
• camelCase קצר יותר ואינו דורש תווים נוספים.
• kebab-case לא יכול לשמש כשמות משתנים ברוב השפות, כי user-name נקרא כ-"user מינוס name".
• לחיצה כפולה בוחרת שם שלם ב-snake_case או ב-camelCase ברוב העורכים, אבל בדרך כלל נעצרת במקפים ב-kebab-case.

הכלל האמיתי הוא עקביות. קובץ שמערבב userName, user_name ו-UserName קשה יותר לקריאה מכל סגנון יחיד שמשתמשים בו בכל מקום.

המרה בין סגנונות

תצטרכו להמיר כשמעבירים נתונים בין שכבות: created_at של API ב-Python שהופך ל-createdAt ב-JavaScript, כותרת דף שהופכת לכתובת URL, או שם הגדרה שהופך למשתנה סביבה.

ל-kebab-case או ל-snake_case: השתמשו במחולל הסלאג. הדביקו את המילים, שם אחד בכל שורה, ובחרו מקפים (-) ל-kebab-case או קווים תחתונים (_) ל-snake_case. הכלי הופך הכול לאותיות קטנות, ממיר תווים מוטעמים לאותיות פשוטות ומסיר סמלים. הוא מתייחס לכל סמל כאל גבול מילה, כך ש-user_first_name הופך ל-user-first-name וחוזר לאחור. עם זאת, הוא לא מפצל camelCase: userFirstName יוצא כ-userfirstname. הוסיפו רווחים בין המילים קודם.

לאותיות גדולות עם קווים תחתונים (SCREAMING_SNAKE_CASE). הכינו קודם את גרסת snake_case במחולל הסלאג, ואז הדביקו אותה בממיר האותיות החינמי ולחצו על אותיות גדולות. בכיוון ההפוך, אותיות קטנות הופך את MAX_RETRIES ל-max_retries.

ל-camelCase או ל-PascalCase. אין כפתור אחד. הדרך המהירה: כתבו את המילים עם רווחים, לחצו על אות גדולה בכל מילה בממיר האותיות (user first name הופך ל-User First Name), ואז מחקו את הרווחים ל-PascalCase, או הפכו את האות הראשונה לקטנה ל-camelCase.

שמות רבים בבת אחת, בתוך קוד. לשינוי שם גדול, השתמשו בחיפוש והחלפה של העורך עם ביטוי רגולרי. בדקו קודם את התבנית בבודק הביטויים הרגולריים החינמי: למשל, _([a-z]) מוצא כל קו תחתון שאחריו אות, המקום שבו snake_case צריך אות גדולה ב-camelCase. בעורכים רבים אפשר להפוך את האות שנתפסה לגדולה בתוך ההחלפה; בדקו בתיעוד של העורך את התחביר.

דברים לשים לב אליהם בזמן המרה

• ראשי תיבות. החליטו אם זה userId או userID, HtmlParser או HTMLParser, והישארו עם הבחירה.
• מספרים. address_line_2 מתחלף נקי; גם addressLine2 תקין. רק אל תשמיטו את הספרה.
• שמות ציבוריים. שינוי שם של שדה JSON או של כתובת URL שובר את מי שמשתמש בהם. הוסיפו הפניה מחדש לכתובות, ושמרו על שמות שדות ישנים ב-APIs לתקופה מסוימת.

המירו את הטקסט שלכם

השתמשו בממיר האותיות החינמי לאותיות גדולות, לאותיות קטנות ולאות גדולה בכל מילה, ובמחולל הסלאג ל-kebab-case ול-snake_case. שני הכלים פועלים בדפדפן, ושום טקסט שאתם מדביקים לא יוצא מהמכשיר שלכם.