Computer >> कंप्यूटर ट्यूटोरियल >  >> प्रोग्रामिंग >> JavaScript

JavaScript में forEach() मेथड का उपयोग


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 लूप

विशेषताforEachfor...offor लूप
ब्रेक/कंटिन्यूनहीं (throw से बाहर)हाँहाँ
रिटर्न वैल्यूundefinedN/AN/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>
  1. JavaScript Pop मेथड: यह क्या है और इसका उपयोग कैसे करें JavaScript Pop मेथड: यह क्या है और इसका उपयोग कैसे करें

    JavaScript एरे pop मेथड कई एरे मेथड्स में से एक है जिसका उपयोग एरे में डेटा को मैनिपुलेट करने के लिए किया जा सकता है। वेब डेवलपर्स इसका उपयोग तब करते हैं जब उन्हें या तो छोटे एरे के साथ या पॉप्ड एलिमेंट के साथ कुछ करने की आवश्यकता होती है। आइए सीखें कि इसका उपयोग कैसे करें: सिंटैक्स इस मेथड का सिंट

  1. - JavaScript में test() मेथड का उपयोग

    test() मेथड एक रेगुलर एक्सप्रेशन मेथड है। यह एक स्ट्रिंग में पैटर्न की खोज करता है, और परिणाम के आधार पर true या false लौटाता है। यदि यह दिए गए पैटर्न का सामना करता है तो यह true लौटाता है, अन्यथा false लौटाता है। यह केस सेंसिटिव है। आइए इसे विस्तार से चर्चा करें। उदाहरण-1 निम्न उदाहरण में, एक टेक्

  1. - JavaScript WeakMap में .clear() मेथड का क्या उपयोग है?

    WeakMap पर clear मेथड WeakMap ऑब्जेक्ट से सभी की/वैल्यू पेयर्स को हटा देता है। इस मेथड को स्पेक से हटा दिया गया है और WeakMap ऑब्जेक्ट को क्लियर मेथड के लिए अतिरिक्त सपोर्ट के साथ लपेटकर वापस जोड़ा जा सकता है। उदाहरण class ClearableWeakMap { constructor(init) { this._wm = new WeakMap(init) } clear(