बाकी ऑपरेटर (...) हमें किसी भी संख्या में तर्कों के साथ एक फ़ंक्शन को कॉल करने की अनुमति देता है और फिर उन अतिरिक्त तर्कों को एक सरणी के रूप में एक्सेस करता है। बाकी ऑपरेटर भी हमें सरणी या वस्तुओं को नष्ट करने की अनुमति देता है।
स्प्रेड ऑपरेटर (...) हमें एक चलने योग्य सरणी को उसके अलग-अलग तत्वों में विस्तारित करने की अनुमति देता है।
उदाहरण
जावास्क्रिप्ट में बाकी और स्प्रेड ऑपरेटर को दिखाने वाला कोड निम्नलिखित है -
<!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;
}
.sample, .result {
font-size: 20px;
font-weight: 500;
}
</style>
</head>
<body>
<h1>JavaScript Rest and spread operator</h1>
<div class="sample"></div>
<div style="color: green;" class="result"></div&g;
<button class="btn">Spread Operator</button>
<h3>
Click on the above button to concatenate array using spread operator
</h3>
<button class="btn">Rest Operator</button>
<div style="color: green;" class="result"></div>
<h3>
Click on the above button to add some numbers using rest operator
</h3>
<script>
let sampleEle = document.querySelector(".sample");
let btnEle = document.querySelectorAll(".btn");
let resEle = document.querySelectorAll(".result");
let arr = [2, 3, 4, 5];
let arr1 = ["a", "b", "c", "d"];
sampleEle.innerHTML = "arr = " + arr + "<br> arr1 = " + arr1;
function addArr(num, ...ar) {
let sum = num;
ar.forEach((item) => {
sum += item;
});
resEle[1].innerHTML = "Sum of the elements = " + sum;
}
btnEle[0].addEventListener("click", () => {
resEle[0].innerHTML = "Concatenated array = " + [...arr, ...arr1];
});
btnEle[1].addEventListener("click", () => {
addArr(44, 11, 35, 44, 22, 99);
});
</script>
</body>
</html> आउटपुट
उपरोक्त कोड निम्न आउटपुट उत्पन्न करेगा -
"स्प्रेड ऑपरेटर" बटन पर क्लिक करने पर -
"रेस्ट ऑपरेटर" बटन पर क्लिक करने पर -
