DanLevy.net

הבנת מספרים ומטבעות בינלאומיים

הסבר על כסף מותאם מקומית!

כסף: לוקליזציה (L10n) ובין-לאומיות (i18n)

הן לא רק בשביל לנצח במשחק שבץ-נא, לוקליזציה ו_בין-לאומיות_ מתייחסות לתהליך של הפיכת מוצר לכזה שמרגיש ביתי במדינה אחרת.

הצגת מטבע בפורמט מקומי שגוי היא חותמת ברורה: לא השקעתם מאמץ.
אם אתם לא יודעים לעצב מחיר, איך תתמודדו עם משלוח?

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

בואו נבחן עיצוב בין 3 מדינות גוש האירו, ארה”ב והודו:

כאוס! נכון? יש סמלים, רווחים וסימני פיסוק שעפים לכל עבר! זה מדהים שהאיחוד האירופי מצליח להסכים על משהו! 😅

מושגי מפתח

לפני שנצלול לפתרונות, למה הכוונה ב”מספרים הם מקומיים”?

מספרים הם מקומיים 🏘️

כל לוקאל (מדינה לפי ISO 3166) מגדיר כללים לעיצוב מספרים.

כללי עיצוב מספרים כוללים:

מטבע הוא גלובלי 🌎

מטבע מתייחס ליחידת כסף ספציפית. (ראה ISO 4217 לרשימה.)

מתי הלוקאל חשוב

רוב ממשקי ה-API של מסחר אלקטרוני/תשלומים עוסקים ב-price + currencyCode. למה אין לוקאלים?

לוקאלים נקבעים (בדרך כלל) ברמת מערכת ההפעלה/המכשיר, ודפדפנים הופכים אותו לזמין דרך navigator.language. מכיוון שלכל אחד מהמשתמשים שלך יכול להיות לוקאל שונה, הגיוני לעצב מספרים ומטבעות בצד הלקוח.

פתרון

אוקיי, חדשות טובות! לשפות תכנות מודרניות יש תמיכה מובנית בזה. ב-JavaScript, יש לנו את המחלקה Intl ואת Intl.NumberFormat!

בואו נסתכל על קצת קוד:

const number = 1_234_567.89;
/**
* Format a number in local currency.
* @param {number} amount - The amount to format.
* @param {string} currency - The 3-letter currency code.
* @param {string} [locale] - The users locale string.
*/
const formatMoney = (amount, currency, locale = navigator.language) =>
new Intl.NumberFormat(locale, { currency, style: 'currency' })
.format(amount);
console.log('🇩🇪 ' + formatMoney(number, 'EUR', 'de-DE'));
console.log('🇮🇪 ' + formatMoney(number, 'EUR', 'ga-IE'));
console.log('🇫🇷 ' + formatMoney(number, 'EUR', 'fr-FR'));

אם צריך לעשות דברים מתוחכמים יותר, כמו חישוב מיסים, הפעלת הנחות או המרה בין מטבעות, כדאי להשתמש בספרייה כמו dinero.js.

צעדים הבאים

בהתאם לצרכים הספציפיים שלך, אולי תרצה לחקור מושגים קשורים:

תודיעו לי אם תרצו לראות מאמר עתידי בנושאים האלה!

JavaScript / TypeScript

Rust

Go