जावास्क्रिप्टच्या नलीश कोलेसिंग ऑपरेटर (??) चा वापर करून स्वच्छ आणि अधिक कार्यक्षम डीफॉल्ट व्हॅल्यू असाइनमेंट शिका. हे OR ऑपरेटर (||) पेक्षा कसे वेगळे आहे ते जाणून घ्या आणि व्यावहारिक उदाहरणे पहा.
जावास्क्रिप्ट नलीश कोलेसिंग: डीफॉल्ट व्हॅल्यू असाइनमेंटसाठी एक सर्वसमावेशक मार्गदर्शक
जावास्क्रिप्टमध्ये, डीफॉल्ट व्हॅल्यू देणे हे एक सामान्य काम आहे. पारंपरिकरित्या, डेव्हलपर्स या कामासाठी OR ऑपरेटर (||
) वापरत आले आहेत. तथापि, ECMAScript 2020 मध्ये सादर केलेला नलीश कोलेसिंग ऑपरेटर (??
), डीफॉल्ट व्हॅल्यू असाइनमेंट हाताळण्यासाठी, विशेषतः null
किंवा undefined
व्हॅल्यूजसोबत काम करताना, अधिक अचूक आणि विश्वासार्ह मार्ग प्रदान करतो. हे मार्गदर्शक नलीश कोलेसिंग ऑपरेटरबद्दल सखोल माहिती देते, ज्यात त्याचे सिंटॅक्स, वर्तन, OR ऑपरेटरमधील फरक आणि व्यावहारिक उपयोग यांचा समावेश आहे.
नलीश कोलेसिंग म्हणजे काय?
नलीश कोलेसिंग ऑपरेटर (??
) हा एक लॉजिकल ऑपरेटर आहे जो त्याचा डावीकडील ऑपरेंड null
किंवा undefined
असल्यास उजवीकडील ऑपरेंड परत करतो. अन्यथा, तो डावीकडील ऑपरेंड परत करतो. सोप्या भाषेत सांगायचे झाल्यास, जेव्हा एखादे व्हेरिएबल केवळ null
किंवा undefined
असते, तेव्हाच तो डीफॉल्ट व्हॅल्यू देतो.
सिंटॅक्स
नलीश कोलेसिंग ऑपरेटरचा सिंटॅक्स अगदी सरळ आहे:
leftOperand ?? rightOperand
येथे, leftOperand
हे व्हेरिएबल किंवा एक्सप्रेशन आहे ज्याला तुम्ही null
किंवा undefined
साठी तपासू इच्छिता, आणि rightOperand
ही डीफॉल्ट व्हॅल्यू आहे जी तुम्ही leftOperand
खरोखर null
किंवा undefined
असल्यास देऊ इच्छिता.
उदाहरण
खालील उदाहरण विचारात घ्या:
const username = null ?? "Guest";
console.log(username); // आउटपुट: Guest
const age = undefined ?? 25;
console.log(age); // आउटपुट: 25
const city = "London" ?? "Unknown";
console.log(city); // आउटपुट: London
या उदाहरणात, username
ला डीफॉल्ट व्हॅल्यू "Guest" दिली आहे कारण ती सुरुवातीला null
आहे. त्याचप्रमाणे, age
ला 25 दिले आहे कारण ते undefined
म्हणून सुरू होते. तथापि, city
तिची मूळ व्हॅल्यू, "London", कायम ठेवते, कारण ती null
किंवा undefined
नाही.
नलीश विरुद्ध फॉल्सी व्हॅल्यूज
जावास्क्रिप्टमध्ये नलीश आणि फॉल्सी व्हॅल्यूमधील फरक समजून घेणे महत्त्वाचे आहे. नलीश व्हॅल्यू एकतर null
किंवा undefined
असते. फॉल्सी व्हॅल्यू ही अशी व्हॅल्यू आहे जी बुलियन संदर्भात false मानली जाते. फॉल्सी व्हॅल्यूमध्ये खालील गोष्टींचा समावेश होतो:
null
undefined
0
(शून्य)NaN
(संख्या नाही)''
(रिकामी स्ट्रिंग)false
मुख्य फरक हा आहे की नलीश कोलेसिंग ऑपरेटर केवळ null
किंवा undefined
साठी तपासतो, तर OR ऑपरेटर (||
) कोणत्याही फॉल्सी व्हॅल्यूसाठी तपासतो.
??
आणि ||
मधील फरक
OR ऑपरेटर (||
) हा एक लॉजिकल OR ऑपरेटर आहे जो डावीकडील ऑपरेंड फॉल्सी असल्यास उजवीकडील ऑपरेंड परत करतो. डीफॉल्ट व्हॅल्यू देण्यासाठी याचा वापर केला जाऊ शकतो, परंतु 0
किंवा रिकाम्या स्ट्रिंगसारख्या व्हॅल्यूजसोबत काम करताना यामुळे अनपेक्षित परिणाम मिळू शकतात.
उदाहरण: ||
चे तोटे
const quantity = 0 || 10; // quantity गहाळ असल्यास १० चा डीफॉल्ट देण्याचा आमचा हेतू आहे
console.log(quantity); // आउटपुट: 10 (अनपेक्षित!) कारण 0 फॉल्सी आहे
const text = '' || 'Default Text'; // text गहाळ असल्यास डीफॉल्ट मजकूर देण्याचा आमचा हेतू आहे
console.log(text); // आउटपुट: Default Text (अनपेक्षित!) कारण '' फॉल्सी आहे
पहिल्या उदाहरणात, आमचा उद्देश फक्त quantity
गहाळ (null
किंवा undefined
) असेल तरच 10 ची डीफॉल्ट संख्या देण्याचा होता. तथापि, 0
ही एक फॉल्सी व्हॅल्यू असल्यामुळे, OR ऑपरेटरने चुकीच्या पद्धतीने डीफॉल्ट व्हॅल्यू दिली. त्याचप्रमाणे, रिकामी स्ट्रिंग अस्तित्वात असूनही (पण रिकामी) डीफॉल्ट मजकूर दर्शविण्यास कारणीभूत ठरते.
अचूकतेसाठी ??
चा वापर
चला, मागील उदाहरण नलीश कोलेसिंग ऑपरेटर वापरून पुन्हा लिहूया:
const quantity = 0 ?? 10;
console.log(quantity); // आउटपुट: 0 (बरोबर!)
const text = '' ?? 'Default Text';
console.log(text); // आउटपुट: '' (बरोबर!)
आता, आउटपुट अपेक्षेप्रमाणे आहे. नलीश कोलेसिंग ऑपरेटर केवळ null
किंवा undefined
साठी तपासतो, त्यामुळे 0
आणि ''
या व्हॅल्यूज वैध मानल्या जातात आणि त्यांच्या मूळ व्हॅल्यूज जपल्या जातात.
नलीश कोलेसिंगचे उपयोग
जेव्हा तुम्हाला केवळ व्हेरिएबल null
किंवा undefined
असतानाच डीफॉल्ट व्हॅल्यू देण्याची आवश्यकता असते, तेव्हा विविध परिस्थितीत नलीश कोलेसिंग ऑपरेटर उपयुक्त ठरतो. येथे काही सामान्य उपयोग दिले आहेत:
१. ऑप्शनल फंक्शन पॅरामीटर्स हाताळणे
ऑप्शनल पॅरामीटर्ससह फंक्शन परिभाषित करताना, पॅरामीटर्स न दिल्यास डीफॉल्ट व्हॅल्यू देण्यासाठी तुम्ही नलीश कोलेसिंग ऑपरेटरचा वापर करू शकता.
function greet(name, greeting) {
const userName = name ?? "User";
const userGreeting = greeting ?? "Hello";
console.log(`${userGreeting}, ${userName}!`);
}
greet(); // आउटपुट: Hello, User!
greet("Alice"); // आउटपुट: Hello, Alice!
greet("Bob", "Greetings"); // आउटपुट: Greetings, Bob!
२. डीफॉल्ट कॉन्फिगरेशन ऑप्शन्स सेट करणे
कॉन्फिगरेशन ऑब्जेक्ट्ससोबत काम करताना, विशिष्ट कॉन्फिगरेशन ऑप्शन्स निर्दिष्ट न केल्यास डीफॉल्ट व्हॅल्यूज वापरल्या जातील याची खात्री करण्यासाठी तुम्ही नलीश कोलेसिंग ऑपरेटरचा वापर करू शकता.
const config = {
timeout: 5000,
retries: 3
};
function fetchData(options) {
const timeout = options.timeout ?? 10000; // १० सेकंदांचा डीफॉल्ट टाइमआउट
const retries = options.retries ?? 5; // डीफॉल्ट ५ रिट्राइज
console.log(`Timeout: ${timeout}, Retries: ${retries}`);
}
fetchData(config); // आउटपुट: Timeout: 5000, Retries: 3
fetchData({}); // आउटपुट: Timeout: 10000, Retries: 5
fetchData({timeout:null, retries: undefined}); // आउटपुट: Timeout: 10000, Retries: 5
३. नेस्टेड ऑब्जेक्ट प्रॉपर्टीज ऍक्सेस करणे
नेस्टेड ऑब्जेक्ट्सच्या प्रॉपर्टीज ऍक्सेस करताना, मधल्या कोणत्याही प्रॉपर्टीज null
किंवा undefined
असल्यास डीफॉल्ट व्हॅल्यू देण्यासाठी नलीश कोलेसिंग ऑपरेटरला ऑप्शनल चेनिंग (?.
) सोबत एकत्र वापरले जाऊ शकते.
const user = {
profile: {
address: {
city: "New York"
}
}
};
const cityName = user?.profile?.address?.city ?? "Unknown";
console.log(cityName); // आउटपुट: New York
const unknownUser = {};
const unknownCityName = unknownUser?.profile?.address?.city ?? "Unknown";
console.log(unknownCityName); // आउटपुट: Unknown
४. APIs आणि बाह्य डेटासोबत काम करणे
APIs किंवा बाह्य स्त्रोतांकडून डेटा मिळवताना, विशिष्ट डेटा फील्ड गहाळ असल्यास किंवा त्यांची व्हॅल्यू null
किंवा undefined
असल्यास डीफॉल्ट व्हॅल्यू देण्यासाठी नलीश कोलेसिंग ऑपरेटरचा वापर केला जाऊ शकतो. वेगवेगळ्या प्रदेशांमधून वापरकर्त्याचा डेटा मिळवण्याचा विचार करा. समजा काही प्रदेश त्यांच्या वापरकर्त्याच्या डेटामध्ये `country` फील्ड समाविष्ट करत नाहीत.
async function getUserData(userId) {
try {
const response = await fetch(`https://api.example.com/users/${userId}`);
const data = await response.json();
const country = data.country ?? "Unknown Country";
const timezone = data.timezone ?? "UTC";
console.log(`User is from: ${country}, Timezone: ${timezone}`);
} catch (error) {
console.error("Error fetching user data:", error);
}
}
// वेगवेगळ्या API प्रतिसादांचे सिम्युलेशन:
const userWithCountry = { name: "John", country: "USA", timezone: "EST" };
const userWithoutCountry = { name: "Jane", timezone: "GMT" };
// हे तपासण्यासाठी, तुम्हाला प्रत्यक्ष API किंवा मॉक फेचची आवश्यकता असेल.
// प्रात्यक्षिकासाठी, चला प्रतिसादांचे सिम्युलेशन करूया:
global.fetch = async (url) => {
if (url.includes("123")) {
return { json: async () => userWithCountry };
} else if (url.includes("456")) {
return { json: async () => userWithoutCountry };
}
throw new Error("Unexpected URL");
};
getUserData(123); // आउटपुट: User is from: USA, Timezone: EST
getUserData(456); // आउटपुट: User is from: Unknown Country, Timezone: GMT
ऑपरेटर प्रेसिडेंस (अग्रक्रम)
नलीश कोलेसिंग ऑपरेटरचा प्रेसिडेंस (अग्रक्रम) तुलनेने कमी आहे. तो OR (||
) आणि AND (&&
) ऑपरेटरपेक्षा कमी आहे. म्हणून, नलीश कोलेसिंग ऑपरेटरला इतर लॉजिकल ऑपरेटरसोबत एकत्र वापरताना, ऑपरेशन्सचा क्रम स्पष्टपणे परिभाषित करण्यासाठी कंस (parentheses) वापरणे आवश्यक आहे. असे न केल्यास सिंटॅक्स एरर किंवा अनपेक्षित परिणाम येऊ शकतात.
उदाहरण: स्पष्टतेसाठी कंसाचा वापर
// कंसाशिवाय (सिंटॅक्स एरर)
// const result = false || null ?? "Default"; // SyntaxError: Unexpected token '??'
// कंसासह (बरोबर)
const result = false || (null ?? "Default");
console.log(result); // आउटपुट: Default
const anotherResult = (false || null) ?? "Default";
console.log(anotherResult); // आउटपुट: null
पहिल्या उदाहरणात, कंस नसल्यामुळे SyntaxError
येतो कारण जावास्क्रिप्ट इंजिन ऑपरेशन्सचा हेतू असलेला क्रम ठरवू शकत नाही. कंस टाकून, आपण इंजिनला स्पष्टपणे सांगतो की आधी नलीश कोलेसिंग ऑपरेटरचे मूल्यांकन करावे. दुसरे उदाहरण वैध आहे; तथापि, आउटपुट वेगळा आहे कारण `||` एक्सप्रेशनचे मूल्यांकन आधी केले जाते.
ब्राउझर कंपॅटिबिलिटी
नलीश कोलेसिंग ऑपरेटर (??
) हे तुलनेने नवीन वैशिष्ट्य आहे, त्यामुळे ब्राउझर कंपॅटिबिलिटी विचारात घेणे महत्त्वाचे आहे, विशेषतः जर तुम्ही जुन्या ब्राउझरला लक्ष्य करत असाल. बहुतेक आधुनिक ब्राउझर नलीश कोलेसिंग ऑपरेटरला सपोर्ट करतात, ज्यात खालील गोष्टींचा समावेश आहे:
- Chrome 80+
- Firefox 72+
- Safari 13.1+
- Edge 80+
- Node.js 14+
तुम्हाला जुन्या ब्राउझरला सपोर्ट करायचा असल्यास, तुम्ही तुमचा कोड जावास्क्रिप्टच्या कंपॅटिबल आवृत्तीमध्ये रूपांतरित करण्यासाठी Babel सारखा ट्रान्सपाइलर वापरू शकता. Babel ??
ऑपरेटरला समकक्ष जावास्क्रिप्ट कोडमध्ये रूपांतरित करेल जो जुन्या वातावरणात काम करतो.
सर्वोत्तम पद्धती
नलीश कोलेसिंग ऑपरेटर प्रभावीपणे वापरण्यासाठी येथे काही सर्वोत्तम पद्धती आहेत:
- नलीश तपासणीसाठी
??
वापरा: जेव्हा तुम्हाला केवळ व्हेरिएबलnull
किंवाundefined
असतानाच डीफॉल्ट व्हॅल्यू द्यायची असेल, तेव्हा नलीश कोलेसिंग ऑपरेटर (??
) वापरा. - जटिल एक्सप्रेशन्ससाठी कंस वापरा: नलीश कोलेसिंग ऑपरेटरला इतर लॉजिकल ऑपरेटरसोबत एकत्र वापरताना, ऑपरेशन्सचा क्रम स्पष्टपणे परिभाषित करण्यासाठी कंस वापरा.
- ब्राउझर कंपॅटिबिलिटी विचारात घ्या: ब्राउझर कंपॅटिबिलिटी तपासा आणि आवश्यक असल्यास जुन्या ब्राउझरला सपोर्ट करण्यासाठी ट्रान्सपाइलर वापरा.
- सातत्यपूर्ण वापर करा: प्रोजेक्टमध्ये अधिक अंदाजे कोडिंग शैलीसाठी योग्य ठिकाणी
??
चा अवलंब करा. - ऑप्शनल चेनिंगसोबत एकत्र करा: ऑब्जेक्ट्सच्या नेस्टेड प्रॉपर्टीजमध्ये सुरक्षितपणे ऍक्सेस करण्यासाठी आणि डीफॉल्ट व्हॅल्यू देण्यासाठी
??
चा वापर ऑप्शनल चेनिंग?.
सोबत करा.
जागतिक विचार
जागतिक प्रेक्षकांसाठी डेव्हलपमेंट करताना, डीफॉल्ट व्हॅल्यू असाइनमेंटशी संबंधित खालील मुद्दे विचारात घ्या:
- लोकलायझेशन: वापरकर्त्याची भाषा किंवा प्रदेश यावर आधारित डीफॉल्ट व्हॅल्यूज लोकलाइज करण्याची आवश्यकता असू शकते. उदाहरणार्थ, डीफॉल्ट चलन चिन्ह किंवा तारीख स्वरूप.
- सांस्कृतिक नियम: काही डीफॉल्ट व्हॅल्यूज सांस्कृतिक नियमांनुसार समायोजित करण्याची आवश्यकता असू शकते. उदाहरणार्थ, डीफॉल्ट शुभेच्छा संदेश वेगवेगळ्या संस्कृतींमध्ये वेगळा असू शकतो.
- ऍक्सेसिबिलिटी: डीफॉल्ट व्हॅल्यूज अपंग वापरकर्त्यांसाठी ऍक्सेसिबल आणि समजण्यायोग्य असल्याची खात्री करा. यूजर इंटरफेसमध्ये डीफॉल्ट व्हॅल्यूजसाठी स्पष्ट आणि वर्णनात्मक लेबल द्या.
- टाइमझोन आणि तारखा: तारखा आणि वेळेसोबत काम करताना, वेगवेगळ्या प्रदेशातील वापरकर्त्यांना डीफॉल्ट व्हॅल्यूज योग्यरित्या दिसतील याची खात्री करण्यासाठी योग्य टाइमझोन आणि तारीख स्वरूप वापरा.
उदाहरण: नलीश कोलेसिंगसह लोकलायझेशन
समजा तुम्हाला वापरकर्त्याच्या लोकॅलनुसार वेगवेगळ्या भाषांमध्ये डीफॉल्ट स्वागत संदेश दाखवायचा आहे. लोकलाइज्ड संदेश उपलब्ध नसल्यास डीफॉल्ट संदेश देण्यासाठी तुम्ही नलीश कोलेसिंग ऑपरेटरचा वापर करू शकता.
function getWelcomeMessage(locale) {
const localizedMessages = {
en: "Welcome!",
fr: "Bienvenue !",
de: "Willkommen!"
};
const message = localizedMessages[locale] ?? "Welcome!"; // लोकॅल न सापडल्यास इंग्रजीमध्ये डीफॉल्ट करा
return message;
}
console.log(getWelcomeMessage("fr")); // आउटपुट: Bienvenue !
console.log(getWelcomeMessage("es")); // आउटपुट: Welcome! (इंग्रजीमध्ये डीफॉल्ट होत आहे)
निष्कर्ष
नलीश कोलेसिंग ऑपरेटर (??
) ही जावास्क्रिप्ट भाषेतील एक मौल्यवान भर आहे. हे OR ऑपरेटर (||
) च्या तुलनेत डीफॉल्ट व्हॅल्यूज देण्यासाठी अधिक अचूक आणि विश्वासार्ह मार्ग प्रदान करते, विशेषतः 0
किंवा रिकाम्या स्ट्रिंगसारख्या व्हॅल्यूजसोबत काम करताना. त्याचे सिंटॅक्स, वर्तन आणि उपयोग समजून घेऊन, तुम्ही स्वच्छ, अधिक देखरेख करण्यायोग्य कोड लिहू शकता जो डीफॉल्ट व्हॅल्यू असाइनमेंट अचूकपणे हाताळतो. तुमच्या प्रोजेक्ट्समध्ये नलीश कोलेसिंग ऑपरेटर वापरताना ब्राउझर कंपॅटिबिलिटी, ऑपरेटर प्रेसिडेंस आणि जागतिक विचार लक्षात ठेवा.
या मार्गदर्शिकेत वर्णन केलेल्या सर्वोत्तम पद्धतींचे पालन करून, तुम्ही तुमच्या जावास्क्रिप्ट कोडची गुणवत्ता आणि विश्वासार्हता सुधारण्यासाठी नलीश कोलेसिंग ऑपरेटरचा प्रभावीपणे फायदा घेऊ शकता, ज्यामुळे तो अधिक मजबूत आणि समजण्यास सोपा होईल. तुमच्या कोडमध्ये नेहमी स्पष्टता आणि देखरेखक्षमतेला प्राधान्य द्या, आणि ही उद्दिष्ट्ये साध्य करण्यासाठी नलीश कोलेसिंग ऑपरेटर एक शक्तिशाली साधन असू शकते.