जावास्क्रिप्ट में संख्याओं को मुद्रा में फ़ॉर्मेट करना: 3 सर्वश्रेष्ठ तरीके

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

पैसे को व्यवस्था पसंद है: जावास्क्रिप्ट में संख्या को सुंदर कीमत में कैसे बदलें?

\n\n

कल्पना करें: आप एक ऑनलाइन स्टोर लिख रहे हैं। सर्वर उत्पाद की कीमत देता है — बस एक संख्या 1999.5। उपयोगकर्ता को "कच्ची" संख्या दिखाना बुरा व्यवहार है। ग्राहक "$1,999.50" या, यदि आप रूस में हैं, "1 999,50 ₽" देखना चाहता है।

\n\n

यह प्रश्न Stack Overflow पर हज़ारों डेवलपर्स को परेशान करता है। आज हम एक बार और हमेशा के लिए समझेंगे कि जावास्क्रिप्ट में संख्याओं को मुद्रा स्ट्रिंग में सही तरीके से कैसे फ़ॉर्मेट किया जाए। आप बिल्ट-इन विधियों, उनकी विशेषताओं और कब कौन सा तरीका बेहतर उपयोग करना है, के बारे में जानेंगे।

\n\n

क्यों सिर्फ `.toFixed(2)` एक बुरा विचार है?

\n\n

कई शुरुआती ऐसा करते हैं:

\n\n

const price = 1999.5;\nconsole.log('$' + price.toFixed(2)); // "$1999.50"

\n\n

यह काम करता हुआ प्रतीत होता है। लेकिन यह एक टाइम बम है। क्यों?

कोई अंक विभाजक नहीं। $1999.50, $1,999.50 की तुलना में पढ़ने में कठिन है।
कोई स्थानीयकरण नहीं। यूरोप में, अल्पविराम दशमलव विभाजक है, बिंदु हजारों का विभाजक है। आपका कोड टूट जाएगा।
मुद्रा प्रतीक हार्डकोडेड है। $ को € में बदलने का मतलब कोड में बदलाव करना है।

\n\n

सौभाग्य से, आधुनिक जावास्क्रिप्ट हमें सुरुचिपूर्ण उपकरण प्रदान करता है। आइए उनका अध्ययन करें।

\n\n

विधि संख्या 1: `Intl.NumberFormat` — फ़ॉर्मेटिंग का राजा (अनुशंसित)

\n\n

यह ऑब्जेक्ट Internationalization API का हिस्सा है। यह विशेष रूप से लोकेल, मुद्राओं और संख्याओं के साथ काम करने के लिए बनाया गया है। यह सबसे सही और लचीला तरीका है।

\n\n

मूल उदाहरण

\n\n

const formatter = new Intl.NumberFormat('ru-RU', {\n    style: 'currency',\n    currency: 'RUB'\n});\n\nconsole.log(formatter.format(1999.5)); // "1 999,50 ₽"

\n\n

बस! जावास्क्रिप्ट ने स्वचालित रूप से रिक्त स्थान, अल्पविराम लगाए और रूबल का प्रतीक जोड़ा। जादू, है ना?

\n\n

यह कैसे काम करता है?

कंस्ट्रक्टर दो तर्क लेता है:

locales — लोकेल कोड वाली स्ट्रिंग (उदाहरण के लिए, 'en-US', 'de-DE', 'ru-RU')।
options — कॉन्फ़िगरेशन ऑब्जेक्ट। मुख्य: style: 'currency' और currency: 'USD'।

\n\n

किसी भी मुद्रा के लिए कॉन्फ़िगरेशन

अमेरिका के लिए डॉलर चाहिए?

const usFormatter = new Intl.NumberFormat('en-US', {\n    style: 'currency',\n    currency: 'USD'\n});\nconsole.log(usFormatter.format(2500)); // "$2,500.00"

\n\n

जर्मनी के लिए यूरो?

const deFormatter = new Intl.NumberFormat('de-DE', {\n    style: 'currency',\n    currency: 'EUR'\n});\nconsole.log(deFormatter.format(2500)); // "2.500,00 €"

\n\n

ध्यान दें: जर्मनी में, बिंदु हजारों का विभाजक है, और अल्पविराम दशमलव चिह्न है। Intl आपके लिए सब कुछ करता है।

\n\n

अतिरिक्त विकल्प

भिन्नात्मक भाग हटाना चाहते हैं (कोई सेंट नहीं)?

const formatter = new Intl.NumberFormat('en-US', {\n    style: 'currency',\n    currency: 'USD',\n    minimumFractionDigits: 0,\n    maximumFractionDigits: 0\n});\nconsole.log(formatter.format(1999.5)); // "$2,000" (गोल किया)

\n\n

हमेशा दशमलव के बाद 4 अंक दिखाने की आवश्यकता है? कृपया:

const preciseFormatter = new Intl.NumberFormat('en-US', {\n    style: 'currency',\n    currency: 'USD',\n    minimumFractionDigits: 4\n});\nconsole.log(preciseFormatter.format(1.2)); // "$1.2000"

\n\n

लाभ: मूल, तेज़, दुनिया की सभी मुद्राओं का समर्थन करता है, आसानी से लोकेल बदलता है।

नुकसान: बहुत पुराने ब्राउज़रों में काम नहीं करता (IE 10 और नीचे — लेकिन यह पहले से ही इतिहास है)।

\n\n