वैकल्पिक चेनिंग ऑपरेटर को ES2020 में पेश किया गया है और हमें स्पष्ट रूप से जाँच किए बिना एक नेस्टेड संपत्ति तक पहुँचने की अनुमति देता है कि क्या श्रृंखला में प्रत्येक संदर्भ शून्य या अपरिभाषित है। पहले, हम &&ऑपरेटर का उपयोग यह जांचने के लिए करते थे कि क्या मूल वस्तु शून्य या अपरिभाषित नहीं है, लेकिन अब हम '?.' वैकल्पिक चेनिंग ऑपरेटर का उपयोग कर सकते हैं।
जावास्क्रिप्ट में वैकल्पिक चेनिंग ऑपरेटर के लिए कोड निम्नलिखित है -
उदाहरण
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
.result {
font-size: 20px;
font-weight: 500;
color: blueviolet;
}
</style>
</head>
<body>
<h1>Optional Chaining operator in JavaScript</h1>
<div class="result"></div>
<br />
<button class="Btn">CLICK HERE</button>
<h3>Click on the above button to use optional chaining operator to access person object properties</h3>
<script>
let resEle = document.querySelector(".result");
let BtnEle = document.querySelector(".Btn");
let person = {
name: "Rohan",
location: {
state: "Delhi",
country: "India",
},
};
BtnEle.addEventListener("click", () => {
resEle.innerHTML =
"person ?. location ?. state = " + person?.location?.state + "<br>";
resEle.innerHTML +="person ?. location ?. country = " +person?.location?.country +"<br>";
resEle.innerHTML +="person ?. personalDetails ?. birthDate = " +
person?.personalDetails?.birthDate +"<br>";
});
</script>
</body>
</html> आउटपुट
'यहां क्लिक करें' बटन पर क्लिक करने पर -
