Array.forEach() मेथड
forEach() ऐरे के प्रत्येक एलिमेंट के लिए एक बार कॉलबैक फंक्शन एक्सेक्यूट करता है। यह नया ऐरे नहीं बनाता और undefined लौटाता है। साइड इफेक्ट्स (लॉगिंग, DOM मैनिपुलेशन) के लिए उपयोगी।
सिंटैक्स
array.forEach(callback(element, index, array), thisArg)
उदाहरण 1: प्रत्येक एलिमेंट प्रिंट करना
<html> <body> <p id="demo"></p> <script>
var output = "";
var values = [1, 2, 3, 4, 5];
values.forEach(function(value) {
output += value + "<br>";
});
document.getElementById("demo").innerHTML = output;
</script> </body> </html>
आउटपुट
1 2 3 4 5
उदाहरण 2: इंलाइन एरो फंक्शन
<html> <body> <script>
var names = ['राम', 'रहीम', 'रेमो'];
names.forEach(function(name) {
document.write(name + "<br>");
});
// या एरो फंक्शन
names.forEach(name => document.write(name + "<br>"));
</script> </body> </html>
आउटपुट
राम रहीम रेमो
कॉलबैक पैरामीटर्स
<script>
var arr = ['a', 'b', 'c'];
arr.forEach(function(element, index, array) {
console.log(`इंडेक्स ${index}: ${element}`, array);
});
// आउटपुट:
// इंडेक्स 0: a ["a", "b", "c"]
// इंडेक्स 1: b ["a", "b", "c"]
// इंडेक्स 2: c ["a", "b", "c"]
</script>
forEach vs for...of vs for लूप
| विशेषता | forEach | for...of | for लूप |
|---|---|---|---|
| ब्रेक/कंटिन्यू | नहीं (throw से बाहर) | हाँ | हाँ |
| रिटर्न वैल्यू | undefined | N/A | N/A |
| इंडेक्स एक्सेस | दूसरा पैरामीटर | entries() से | सीधा |
| पठनीयता | उच्च | उच्च | कम |
| async/await | काम नहीं करता | काम करता है | काम करता है |
महत्वपूर्ण सीमाएं
- ब्रेक नहीं कर सकते - पूरा ऐरे प्रोसेस होता है
- Async/await सपोर्ट नहीं - कॉलबैक में await अनदेखा होता है
- साइड इफेक्ट्स के लिए डिज़ाइन किया गया
- ट्रांसफॉर्मेशन के लिए
map(), फिल्टरिंग के लिएfilter()उपयोग करें
Async विकल्प
<script>
// forEach के साथ async काम नहीं करता
// await के लिए for...of उपयोग करें
async function processItems(items) {
for (const item of items) {
await processItem(item); // क्रमिक प्रोसेसिंग
}
}
// समानांतर के लिए
async function processParallel(items) {
await Promise.all(items.map(item => processItem(item)));
}
</script>