जावास्क्रिप्ट में Intl API का उपयोग कैसे करें

अंतर्राष्ट्रीय एपीआई अंतर्राष्ट्रीयकृत पाठ, संख्याओं, तिथियों और मुद्राओं के स्वरूपण और हेरफेर को सरल बनाता है। यह आपको लोकेल के अनुसार विभिन्न डेटा स्वरूपों को संभालने देता है।

यह एपीआई विभिन्न संस्कृतियों और भाषाओं के लिए डेटा को स्वरूपित करने की चुनौती को हल करता है। किसी विशिष्ट क्षेत्र के लिए उपयुक्त दिनांक प्रारूप का उपयोग करके उचित मुद्रा प्रतीक या तिथियों के साथ संख्याओं को प्रारूपित करना आसान बनाता है।

Intl API का उपयोग करके, आप ऐसे वेब एप्लिकेशन बना सकते हैं जो सभी क्षेत्रों और संस्कृतियों के दर्शकों के लिए सुलभ और उपयोग में आसान हों।

उपयोगकर्ता का लोकेल प्राप्त करना

जावास्क्रिप्ट कंस्ट्रक्टर्स Intl API द्वारा प्रदान किया गया लोकेल की पहचान करता है जिसका उपयोग वे एक परिचित पैटर्न का पालन करते हुए दिनांक, पाठ, संख्या आदि को प्रारूपित करने के लिए करेंगे। प्रत्येक कंस्ट्रक्टर एक लेता है स्थान और एक विकल्प तर्क के रूप में वस्तु। इन तर्कों का उपयोग करते हुए, निर्माता वर्तमान में समर्थित लोकेल के खिलाफ अनुरोधित लोकेल से मेल खाता है।

उपयोगकर्ता का लोकेल प्राप्त करने के लिए, आप इसका उपयोग कर सकते हैं navigator.language संपत्ति। यह संपत्ति ब्राउज़र के भाषा संस्करण का प्रतिनिधित्व करने वाली एक स्ट्रिंग लौटाती है।

का मूल्य navigator.language संपत्ति एक BCP 47 भाषा टैग है, जिसमें एक भाषा कोड और, वैकल्पिक रूप से, एक क्षेत्र कोड और अन्य उपटैग होते हैं। उदाहरण के लिए, "एन-यूएस" संयुक्त राज्य अमेरिका में बोली जाने वाली अंग्रेजी का प्रतिनिधित्व करता है।

आप भी इस्तेमाल कर सकते हैं navigator.languages संपत्ति उपयोगकर्ता की पसंदीदा भाषाओं की एक सरणी प्राप्त करने के लिए, प्राथमिकता के आधार पर क्रमबद्ध। सरणी में पहला आइटम उपयोगकर्ता की प्राथमिक भाषा वरीयता का प्रतिनिधित्व करता है।

एक बार जब आप उपयोगकर्ता का स्थान प्राप्त कर लेते हैं, तो आप उपयोग करके अपने एप्लिकेशन के दिनांक, समय, संख्या और मुद्राओं के प्रदर्शन को अनुकूलित कर सकते हैं अंतरराष्ट्रीय एपीआई।

आप एक साधारण बना सकते हैं जावास्क्रिप्ट समारोह उपयोगकर्ता का स्थान प्राप्त करने में आपकी सहायता करने के लिए। यहां एक कोड स्निपेट है जो मदद कर सकता है:

कॉन्स्ट getUserLocale = () => {
अगर (navigator.languages ​​&& navigator.languages.length) {
वापस करना नेविगेटर.भाषाएं [0];
 }
वापस करना नाविक.भाषा;
};
सांत्वना देनालॉग (getUserLocale ());

यह getUserLocale फ़ंक्शन उपलब्ध होने पर navigator.languages ​​गुण का पहला तत्व लौटाता है। अन्यथा, यह वापस navigator.language संपत्ति पर आ जाता है, जो पुराने ब्राउज़रों में उपयोगकर्ता की पसंदीदा भाषा का प्रतिनिधित्व करती है।

विभिन्न स्थानों के लिए स्वरूपण दिनांक

का उपयोग कर तिथियों को प्रारूपित करने के लिए अंतरराष्ट्रीय एपीआई, आप उपयोग कर सकते हैं अंतरराष्ट्रीय डेटटाइमफॉर्मैट () निर्माता। यह कंस्ट्रक्टर दो तर्क लेता है: एक लोकेल स्ट्रिंग और एक विकल्प ऑब्जेक्ट।

विकल्प ऑब्जेक्ट में वे गुण हो सकते हैं जो दिनांक के स्वरूपण को नियंत्रित करते हैं।

आमतौर पर उपयोग किए जाने वाले कुछ विकल्पों में शामिल हैं:

• काम करने के दिन: यह विकल्प सप्ताह के दिन के स्वरूप को निर्दिष्ट करता है। आप इसे या तो सेट कर सकते हैं लंबा (शुक्रवार), छोटा (शुक्र), या सँकरा (एफ)।
• वर्ष: यह विकल्प वर्ष के प्रारूप को निर्दिष्ट करता है। आप इसे या तो सेट कर सकते हैं संख्यात्मक (2023) या 2 अंकों (23).
• महीना: यह विकल्प माह के प्रारूप को निर्दिष्ट करता है। आप इसे या तो सेट कर सकते हैं संख्यात्मक (3), 2 अंकों (03), लंबा (मार्च), छोटा (मार्च), या सँकरा (एम)।
• दिन: यह विकल्प दिन के प्रारूप को निर्दिष्ट करता है। आप इसे या तो सेट कर सकते हैं संख्यात्मक (2) या 2 अंकों (02).

यहां एक उदाहरण दिया गया है जो दिखाता है कि का उपयोग करके दिनांक को कैसे प्रारूपित किया जाए अंतरराष्ट्रीय डेटटाइमफॉर्मैट () निर्माता:

कॉन्स्ट तारीख = तारीख।अब()
कॉन्स्ट स्थान = getUserLocale ();
कॉन्स्ट विकल्प = {
 कार्यदिवस: "लंबा",
 वर्ष: "संख्यात्मक",
 महीना: "लंबा",
 दिन: "संख्यात्मक",
};
कॉन्स्ट फ़ॉर्मेटर = नयाअंतरराष्ट्रीय.DateTimeFormat (लोकेल, विकल्प);
// कार्यदिवस, माह दिनांक, वर्ष (शुक्रवार, 24 मार्च, 2023)
सांत्वना देना.लॉग (फॉर्मेटर.फॉर्मेट (तारीख));

यह कोड उपयोगकर्ता के लोकेल को पास करके एक फॉर्मेटर ऑब्जेक्ट सेट करता है अंतरराष्ट्रीय डेटटाइमफॉर्मैट (), विकल्पों के एक सेट के साथ। यह वर्तमान दिनांक को एक स्ट्रिंग में बदलने के लिए फ़ॉर्मेटर का उपयोग करता है। विकल्प ऑब्जेक्ट में वे गुण होते हैं जो दिनांक के स्वरूपण को नियंत्रित करते हैं।

विभिन्न प्रकार की संख्याओं का प्रारूपण

आप उपयोग कर सकते हैं अंतरराष्ट्रीय एपीआई का उपयोग कर संख्याओं को प्रारूपित करने के लिए अंतरराष्ट्रीय संख्या स्वरूप() निर्माता। पसंद अंतरराष्ट्रीय डेटटाइमफॉर्मैट (), यह कंस्ट्रक्टर एक लोकेल स्ट्रिंग और एक विकल्प ऑब्जेक्ट को तर्क के रूप में लेता है।

विकल्प ऑब्जेक्ट में गुण होते हैं जो संख्या के स्वरूपण को नियंत्रित करते हैं। ये गुण निर्दिष्ट के आधार पर भिन्न होते हैं शैली संख्या का।

स्वरूपण दशमलव और प्रतिशत

आप उपयोग करके संख्याओं को दशमलव और प्रतिशत के रूप में स्वरूपित कर सकते हैं अंतरराष्ट्रीय संख्या स्वरूप() स्टाइल प्रॉपर्टी को सेट करके कंस्ट्रक्टर दशमलव दशमलव के लिए और प्रतिशत प्रतिशत के लिए।

यहां एक उदाहरण दिया गया है जो दिखाता है कि दशमलव को कैसे प्रारूपित किया जाए:

कॉन्स्ट संख्या = 123456;
कॉन्स्ट स्थान = getUserLocale (); // एन-यूएस
कॉन्स्ट विकल्प = {
 शैली: "दशमलव",
 न्यूनतम अंश अंक: 2,
 अधिकतमअंशअंक: 2,
 ग्रुपिंग का उपयोग करें: सत्य,
};
कॉन्स्ट फ़ॉर्मेटर = नयाअंतरराष्ट्रीय.नंबरफॉर्मेट (लोकेल, विकल्प);
सांत्वना देना.लॉग (फॉर्मेटर.फॉर्मेट (संख्या)); // 123,456.00

उपरोक्त कोड ब्लॉक 123,456 को समूह विभाजक के साथ दशमलव के रूप में प्रारूपित करता है (,) और दो दशमलव स्थान।

यहां एक उदाहरण दिया गया है जो दिखाता है कि प्रतिशत को कैसे प्रारूपित किया जाए:

कॉन्स्ट संख्या = 123456;
कॉन्स्ट स्थान = getUserLocale ();
कॉन्स्ट विकल्प = {
 शैली: "प्रतिशत",
 ग्रुपिंग का उपयोग करें: सत्य,
};
कॉन्स्ट फ़ॉर्मेटर = नयाअंतरराष्ट्रीय.नंबरफॉर्मेट (लोकेल, विकल्प);
सांत्वना देना.लॉग (फॉर्मेटर.फॉर्मेट (संख्या)); // 12,345,600%

उपरोक्त कोड ब्लॉक 123,456 को समूह विभाजक के साथ प्रतिशत के रूप में व्यक्त करता है।

स्वरूपण मुद्राएँ

आप शैली गुण को पर सेट करके संख्याओं को मुद्राओं के रूप में स्वरूपित कर सकते हैं मुद्रा. आपको इसके साथ अन्य विकल्प सेट करने चाहिए, जैसे:

• मुद्रा: स्वरूपण के लिए उपयोग करने के लिए ISO 4217 मुद्रा कोड (जैसे "USD", "EUR", या "JPY") का प्रतिनिधित्व करने वाली एक स्ट्रिंग। यदि आप यह विकल्प प्रदान नहीं करते हैं, तो फ़ॉर्मेटर उपयोगकर्ता के लोकेल के आधार पर मुद्रा कोड का चयन करेगा।
• CurrencyDisplay: यह गुण निर्दिष्ट करता है कि ब्राउज़र को मुद्रा कैसे प्रदर्शित करनी चाहिए। यह या तो हो सकता है प्रतीक (US$ 75), कोड (USD 75), या नाम (75 यूएस डॉलर)।

यहां एक उदाहरण दिखाया गया है कि आप मुद्रा को कैसे प्रारूपित कर सकते हैं:

कॉन्स्ट संख्या = 123456;
कॉन्स्ट स्थान = getUserLocale (); // एन-यूएस
कॉन्स्ट विकल्प = {
 शैली: "मुद्रा",
 मुद्रा: "USD",
 मुद्रा प्रदर्शन: "कोड",
};
कॉन्स्ट फ़ॉर्मेटर = नयाअंतरराष्ट्रीय.नंबरफॉर्मेट (लोकेल, विकल्प);
सांत्वना देना.लॉग (फॉर्मेटर.फॉर्मेट (संख्या)); // यूएसडी 123,456.00

उपरोक्त कोड ब्लॉक मुद्रा (यूएसडी) के रूप में 123,456 प्रारूपित करता है।

स्वरूपण इकाइयां

आप उपयोग कर सकते हैं अंतरराष्ट्रीय संख्या स्वरूप() लंबाई, आयतन और द्रव्यमान जैसी इकाइयों के साथ संख्याओं को प्रारूपित करने के लिए कंस्ट्रक्टर। आप इसे सेट करके कर सकते हैं शैली को इकाई. जब आप शैली को इकाई पर सेट करते हैं, तो आपको इन विकल्पों को निर्दिष्ट करना होगा:

• इकाई: यह गुण स्वरूपण के लिए उपयोग की जाने वाली इकाई को निर्दिष्ट करता है, जैसे "मीटर", "किलोग्राम", "लीटर", "दूसरा", और इसी तरह।
• unitdisplay: यह गुण निर्दिष्ट करता है कि ब्राउज़र को यूनिट को कैसे प्रदर्शित करना चाहिए। आप इसे या तो सेट कर सकते हैं लंबा (10 लीटर), छोटा (10 एल), या सँकरा (10 एल)।

यहां एक उदाहरण दिखाया गया है कि आप इकाइयों को कैसे प्रारूपित कर सकते हैं:

कॉन्स्ट संख्या = 123456;
कॉन्स्ट स्थान = getUserLocale ();
कॉन्स्ट विकल्प = {
 शैली: "इकाई",
 इकाई: "लीटर",
 इकाई प्रदर्शन: "लंबा",
};
कॉन्स्ट फ़ॉर्मेटर = नयाअंतरराष्ट्रीय.नंबरफॉर्मेट (लोकेल, विकल्प);
सांत्वना देना.लॉग (फॉर्मेटर.फॉर्मेट (संख्या)); // 123,456 लीटर

उपरोक्त कोड ब्लॉक लीटर में एक इकाई के रूप में संख्या 123,456 को स्वरूपित करता है।

Intl API के विकल्प

Intl API जावास्क्रिप्ट अनुप्रयोगों में दिनांक, संख्या, मुद्रा और इकाइयों को स्वरूपित करने के लिए उपकरणों का एक शक्तिशाली और लचीला सेट प्रदान करता है। यह कई स्थानों का समर्थन करता है और विभिन्न संस्कृतियों और भाषाओं में डेटा को प्रारूपित करने का एक सुसंगत तरीका प्रदान करता है।

Intl के लिए सीमित ब्राउज़र समर्थन के कारण आप लक्सन या Day.js जैसी वैकल्पिक लाइब्रेरी का उपयोग करना चाह सकते हैं। अंततः, Intl API या वैकल्पिक के बीच निर्णय लेना आपके प्रोजेक्ट की विशिष्ट आवश्यकताओं और बाधाओं पर निर्भर करता है।