जावास्क्रिप्ट गाइड भाग 5: ऐरे और लूप्स

आज, जावास्क्रिप्ट पाठ्यक्रम अनुवाद के पांचवें भाग में, हम सरणियों और छोरों के बारे में बात करेंगे। कई समस्याओं को हल करने के लिए एरे का उपयोग किया जाता है। अक्सर लूप का उपयोग करके सरणियों के साथ काम करते हैं।

→ भाग 1: पहला कार्यक्रम, भाषा सुविधाएँ, मानक
→ भाग 2: कोड शैली और कार्यक्रम संरचना
→ भाग 3: चर, डेटा प्रकार, भाव, वस्तु
→ भाग 4: सुविधाएँ
→ भाग 5: सरणियाँ और लूप
→ भाग 6: अपवाद, अर्धविराम, वाइल्डकार्ड शाब्दिक
→ भाग 7: सख्त मोड, यह कीवर्ड, घटनाओं, मॉड्यूल, गणितीय गणना
→ भाग 8: ES6 सुविधाओं का अवलोकन
→ भाग 9: ES7, ES8 और ES9 मानकों का अवलोकन

सरणियों

Array , Array की वस्तुएं, भाषा के अन्य तंत्रों के साथ विकसित होती हैं। वे गिने-चुने मूल्यों की सूची हैं।

सरणी के पहले तत्व में 0 का एक इंडेक्स (कुंजी) है, इस दृष्टिकोण का उपयोग कई प्रोग्रामिंग भाषाओं में किया जाता है।

इस खंड में हम सरणियों के साथ काम करने के आधुनिक तरीकों पर विचार करेंगे।

▍आंतरिक सारणी

यहां सरणियों को आरंभ करने के कुछ तरीके दिए गए हैं।

 const a = [] const a = [1, 2, 3] const a = Array.of(1, 2, 3) const a = Array(6).fill(1) //   ,   6 ,  1 

सरणी के एक व्यक्तिगत तत्व तक पहुंचने के लिए, वर्ग ब्रैकेट से मिलकर एक निर्माण का उपयोग करें जिसमें सरणी तत्व का सूचकांक होता है। ऐरे तत्वों को या तो पढ़ा या लिखा जा सकता है।

 const a = [1, 2, 3] console.log(a) //[ 1, 2, 3 ] const first = a[0] console.log(first) //1 a[0] = 4 console.log(a) //[ 4, 2, 3 ] 

Array को घोषित करने के लिए Array कंस्ट्रक्टर की सिफारिश नहीं की जाती है।

 const a = new Array() //  const a = new Array(1, 2, 3) //  

इस पद्धति का उपयोग केवल टाइप किए गए सरणियों की घोषणा करते समय किया जाना चाहिए।

सरणी की लंबाई theGetting

किसी सरणी की लंबाई का पता लगाने के लिए, आपको उसकी length संपत्ति का संदर्भ देना होगा।

 const l = a.length 

▍ हर () विधि का उपयोग करके एक सरणी की जाँच करें

every() सरणी विधि का उपयोग एक निश्चित स्थिति का उपयोग करके उनके सभी तत्वों के सत्यापन को व्यवस्थित करने के लिए किया जा सकता है। यदि सरणी के सभी तत्व स्थिति को पूरा करते हैं, तो फ़ंक्शन true वापस आ जाएगा, अन्यथा यह false वापस आ जाएगा।

इस पद्धति को एक फ़ंक्शन पारित किया जाता है जो तर्कों को currentValue (वर्तमान सरणी तत्व), index (वर्तमान सरणी तत्व का सूचकांक) और array (सरणी स्वयं) लेता है। यह एक वैकल्पिक मान भी ले सकता है, इसका उपयोग तब किया जाता है जब फ़ंक्शन इसे निष्पादित करता है।
उदाहरण के लिए, जांचें कि क्या सरणी के सभी तत्वों का मान 10 से अधिक है।

 const a = [11, 12, 13] const b = [5, 6, 25] const test = el => el > 10 console.log(a.every(test)) //true console.log(b.every(test)) //false 

यहां, test() फ़ंक्शन में, हम केवल इसके लिए दिए गए पहले तर्क में रुचि रखते हैं, इसलिए हम इसे केवल el पैरामीटर को निर्दिष्ट करते हुए घोषित करते हैं, जिसमें संबंधित मूल्य गिर जाएगा।

▍ कुछ () विधि का उपयोग करके एक सरणी की जाँच करें

यह विधि every() विधि से बहुत मिलती-जुलती है, लेकिन यह true अगर सरणी के कम से कम एक तत्व इसके द्वारा दिए गए फ़ंक्शन द्वारा निर्दिष्ट स्थिति को संतुष्ट करता है।

▍ मानचित्र () विधि का उपयोग करके एक मौजूदा सरणी के आधार पर एक सरणी बनाएँ

सरणियों का map() विधि आपको सरणियों पर पुनरावृति करने की अनुमति देता है, इस विधि को पारित किए गए प्रत्येक तत्व पर लागू होता है जो तत्व को परिवर्तित करता है और प्राप्त मानों से नए सरणियों का निर्माण करता है। यहां, उदाहरण के लिए, एक नया सरणी कैसे प्राप्त करें, जो मूल सरणी के सभी तत्वों को 2 से गुणा करने का परिणाम है।

 const a = [1, 2, 3] const double = el => el * 2 const doubleA = a.map(double) console.log(a) //[ 1, 2, 3 ] console.log(doubleA) //[ 2, 4, 6 ] 

▍ फ़िल्टर () विधि का उपयोग करके एक सरणी फ़िल्टर करना

filter() विधि map() विधि के समान है, लेकिन यह आपको मूल सरणियों के केवल उन तत्वों से युक्त नए सरणियों को बनाने की अनुमति देता है जो फ़ंक्शन द्वारा निर्दिष्ट filter() विधि द्वारा निर्दिष्ट शर्त को पूरा करते हैं।

▍ कम () विधि

reduce() विधि आपको किसी दिए गए फ़ंक्शन को संचायक और सरणी के प्रत्येक मान पर लागू करने की अनुमति देती है, सरणी को एक एकल मान को कम करती है (यह मान या तो एक आदिम या ऑब्जेक्ट प्रकार हो सकता है)। यह विधि रूपांतरण फ़ंक्शन और वैकल्पिक प्रारंभिक बैटरी मान लेती है। एक उदाहरण पर विचार करें।

 const a = [1, 2, 3, 4].reduce((accumulator, currentValue, currentIndex, array) => { return accumulator * currentValue }, 1) console.log(a) //24 // 1: 1 * 1 = 1 // 2: 1 * 2 = 2 // 3: 2 * 3 = 6 // 4: 6 * 4 = 24 

यहां हम संचयक के प्रारंभिक मूल्य को निर्धारित करते हुए, शाब्दिक का उपयोग करके वर्णित सरणी के सभी तत्वों के उत्पाद की तलाश कर रहे हैं।

▍ forEach () मेथड का प्रयोग करके एरे को एन्यूमरेट करना

सरणियों के मूल्यों पर कार्य करने के लिए और उन पर कुछ क्रियाओं को करने के लिए forEach() तरीके की सरणियों का उपयोग विधि द्वारा दिए गए फ़ंक्शन द्वारा निर्दिष्ट किया जा सकता है। उदाहरण के लिए, हम एक समय में एक, कंसोल में सरणी के तत्वों को प्रदर्शित करते हैं।

 const a = [1, 2, 3] a.forEach(el => console.log(el)) //1 //2 //3 

यदि आपको किसी सरणी पर पुनरावृत्ति करते समय लूप को रोकना या बाधित करना है, तो forEach() का उपयोग करते समय forEach() एक अपवाद फेंकना होगा। इसलिए, यदि एक निश्चित समस्या को हल करने के लिए यह चक्र को बाधित करने के लिए आवश्यक हो सकता है, तो सरणी तत्वों पर पुनरावृति करने के लिए किसी अन्य तरीके को चुनना सबसे अच्छा है।

ऑपरेटर के लिए ... का उपयोग करके एक सरणी का चयन करना

ऑपरेटर का ES6 मानक दिखाई दिया। यह आपको पुनरावृत्त वस्तुओं (सरणियों सहित) पर पुनरावृति करने की अनुमति देता है। यहाँ इसका उपयोग कैसे करना है।

 const a = [1, 2, 3] for (let v of a) { console.log(v) } //1 //2 //3 

लूप के प्रत्येक पुनरावृत्ति पर, सरणी का अगला तत्व वेरिएबल v ।

▍ स्टेटमेंट के लिए किसी ऐरे को एन्यूमरेट करना

स्टेटमेंट के for , आप लूप को व्यवस्थित करने की अनुमति देते हैं, जो विशेष रूप से, इंडेक्स द्वारा उनके तत्वों को एक्सेस करके (या इनिशियलाइज़) सरणियों को पुनरावृत्त करने के लिए उपयोग किया जा सकता है। आमतौर पर, लूप काउंटर का उपयोग करके अगले तत्व का सूचकांक प्राप्त किया जाता है।

 const a = [1, 2, 3] for (let i = 0; i < a.length; i += 1) { console.log(a[i]) } //1 //2 //3 

यदि, लूप के निष्पादन के दौरान, आपको इसकी पुनरावृत्ति को छोड़ने की आवश्यकता है, तो आप continue कमांड का उपयोग कर सकते हैं। समय से पहले चक्र को समाप्त करने के लिए, आप break कमांड का उपयोग कर सकते हैं। यदि आप एक लूप में return कमांड का उपयोग करते return , उदाहरण के लिए, एक निश्चित फ़ंक्शन में स्थित, लूप और फ़ंक्शन समाप्त हो जाएगा, और return साथ लौटा मूल्य उस फ़ंक्शन return जाएगा जहां फ़ंक्शन को बुलाया गया था।

▍ विधि @@ पुनरावृत्त

यह विधि ES6 मानक में दिखाई दी। यह आपको तथाकथित "किसी वस्तु का पुनरावृत्त" प्राप्त करने की अनुमति देता है - एक वस्तु जो इस मामले में आपको सरणी तत्वों के पुनरावृत्ति को व्यवस्थित करने की अनुमति देती है। प्रतीक का उपयोग करके एक सरणी Symbol.iterator प्राप्त की जा सकती है (ऐसे प्रतीकों को "ज्ञात प्रतीक" कहा जाता है) Symbol.iterator । पुनरावृति प्राप्त करने के बाद, आप इसकी next() विधि का उपयोग कर सकते हैं, जो प्रत्येक कॉल के साथ, सरणी के अगले तत्व से युक्त डेटा संरचना लौटाता है।

 const a = [1, 2, 3] let it = a[Symbol.iterator]() console.log(it.next().value) //1 console.log(it.next().value) //2 console.log(it.next().value) //3 

यदि आप सरणी के अंतिम तत्व के पहुंचने के बाद next() विधि को कॉल करते हैं, तो यह undefined तत्व के मान के रूप में वापस आ जाएगी। next() विधि द्वारा लौटाए गए ऑब्जेक्ट में value और done गुण शामिल हैं। done गुण एरे के अंतिम तत्व तक पहुंचने तक false मूल्यांकन करता है। हमारे मामले में, यदि हम इसे चौथी बार कॉल करते हैं। it.next() चौथी बार, यह { value: undefined, done: true } ऑब्जेक्ट लौटाएगा, जबकि पिछली तीन कॉलों में यह ऑब्जेक्ट { value: , done: false } ।

entries() सरणी विधि एक पुनरावृत्ती लौटाती है जो आपको सरणी के कुंजी-मान युग्मों पर पुनरावृति करने की अनुमति देती है।

 const a = [1, 2, 3] let it = a.entries() console.log(it.next().value) //[0, 1] console.log(it.next().value) //[1, 2] console.log(it.next().value) //[2, 3] 

keys() विधि आपको किसी सरणी की कुंजियों पर पुनरावृति करने की अनुमति देती है।

 const a = [1, 2, 3] let it = a.keys() console.log(it.next().value) //0 console.log(it.next().value) //1 console.log(it.next().value) //2 

एक ऐरे के अंत के लिए toAdding तत्व

सरणी के अंत में तत्वों को जोड़ने के लिए, push() विधि का उपयोग करें।

 a.push(4) 

सरणी की शुरुआत के लिए dingAdding तत्व

सरणी की शुरुआत में तत्वों को जोड़ने के लिए, unshift() विधि का उपयोग करें।

 a.unshift(0) a.unshift(-2, -1) 

.Removing सरणी तत्व

pop() विधि का उपयोग करके इस तत्व को वापस करते हुए आप सरणी के अंत से एक तत्व निकाल सकते हैं।

 a.pop() 

इसी तरह, shift() विधि का उपयोग करके, आप सरणी की शुरुआत से एक तत्व निकाल सकते हैं।

 a.shift() 

एक ही बात है, लेकिन पहले से ही तत्वों और उनकी संख्या को हटाने की स्थिति का संकेत, splice() विधि का उपयोग करके किया जाता है।

 a.splice(0, 2) //    2     a.splice(3, 2) //    2 ,    3 

Elementsरिमोविंग ऐरे एलीमेंट्स और उसके बदले दूसरे एलिमेंट्स डालना

सरणी के कुछ तत्वों को हटाने और इसके बजाय अन्य तत्वों को सम्मिलित करने के लिए कुछ ऑपरेशन का उपयोग करने के लिए, परिचित splice() विधि का उपयोग किया जाता है।

उदाहरण के लिए, यहाँ हम इंडेक्स 2 पर शुरू होने वाले एरे के 3 तत्वों को हटाते हैं, जिसके बाद हम दो अन्य तत्वों को एक ही स्थान पर जोड़ते हैं:

 const a = [1, 2, 3, 4, 5, 6] a.splice(2, 3, 'a', 'b') console.log(a) //[ 1, 2, 'a', 'b', 6 ] 

▍कोम्बाइन कई सरणियाँ

कई सरणियों को संयोजित करने के लिए, आप concat() पद्धति का उपयोग कर सकते हैं, जो एक नया सरणी देता है।

 const a = [1, 2] const b = [3, 4] const c = a.concat(b) console.log(c) //[ 1, 2, 3, 4 ] 

एक सरणी में inFind आइटम

ईएस 5 मानक में, indexOf() विधि दिखाई दी है, जो वांछित सरणी तत्व की पहली घटना का सूचकांक लौटाती है। यदि तत्व एरे में नहीं पाया जा सकता है, तो -1 लौटा दिया जाता है।

 const a = [1, 2, 3, 4, 5, 6, 7, 5, 8] console.log(a.indexOf(5)) //4 console.log(a.indexOf(23)) //-1 

lastIndexOf() विधि एरे में तत्व की अंतिम घटना का इंडेक्स लौटाती है, या -1 तत्व नहीं मिलने पर।

 const a = [1, 2, 3, 4, 5, 6, 7, 5, 8] console.log(a.lastIndexOf(5)) //7 console.log(a.lastIndexOf(23)) //-1 

ईएस 6 में, सरणियों का find() विधि प्रकट हुई है, जो उस पर पारित फ़ंक्शन का उपयोग करके एक सरणी खोज करता है। यदि फ़ंक्शन true , तो विधि पहले मिले तत्व का मान लौटाती है। यदि आइटम नहीं मिल सकता है, तो फ़ंक्शन undefined वापस आ जाएगा।

इसका उपयोग निम्नानुसार हो सकता है।

 a.find(x => x.id === my_id) 

यहां, ऑब्जेक्ट युक्त सरणी में, एक तत्व खोजा जाता है, जिसकी id संपत्ति निर्दिष्ट के बराबर होती है।

findIndex() विधि find() समान है find() , लेकिन यह पाए गए या undefined तत्व के सूचकांक को लौटाता है।

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

 a.includes(value) 

इस पद्धति का उपयोग करते हुए, कुछ तत्व की उपस्थिति के लिए जांच करना संभव है न कि संपूर्ण सरणी, लेकिन इसका केवल कुछ भाग, इस पद्धति को निर्दिष्ट किए गए सूचकांक के साथ शुरू करना। इस विधि के दूसरे, वैकल्पिक, पैरामीटर का उपयोग करके सूचकांक निर्दिष्ट किया गया है।

 a.includes(value, i) 

एक सरणी का एक टुकड़ा

नए सरणी के रूप में सरणी के कुछ टुकड़े की एक प्रतिलिपि प्राप्त करने के लिए, आप slice() विधि का उपयोग कर सकते हैं। यदि इस पद्धति को बिना तर्कों के कहा जाता है, तो लौटा हुआ सरणी मूल की पूरी प्रतिलिपि होगी। यह दो वैकल्पिक पैरामीटर लेता है। पहला टुकड़ा के शुरुआती सूचकांक को सेट करता है, दूसरा अंत को सेट करता है। यदि अंत सूचकांक निर्दिष्ट नहीं है, तो सरणी को निर्दिष्ट प्रारंभ सूचकांक से अंत तक कॉपी किया जाता है।

 const a = [1, 2, 3, 4, 5, 6, 7, 8, 9] console.log(a.slice(4)) //[ 5, 6, 7, 8, 9 ] console.log(a.slice(3,7)) //[ 4, 5, 6, 7 ] 

▍Sort सरणी

वर्णानुक्रम क्रम ( 0-9A-Za-z ) में सरणी तत्वों की छंटनी को व्यवस्थित करने के लिए, तर्कों को पास किए बिना 0-9A-Za-z sort() विधि का उपयोग किया जाता है।

 const a = [1, 2, 3, 10, 11] a.sort() console.log(a) //[ 1, 10, 11, 2, 3 ] const b = [1, 'a', 'Z', 3, 2, 11] b.sort() console.log(b) //[ 1, 11, 2, 3, 'Z', 'a' ] 

आप इस विधि के लिए एक फ़ंक्शन पास कर सकते हैं जो सॉर्ट क्रम सेट करता है। फ़ंक्शन दो तत्वों, मापदंडों a और b तुलना के लिए स्वीकार करता है। यह एक ऋणात्मक संख्या देता है यदि a , किसी मानदंड से b से कम है, 0 यदि वे समान हैं, और एक धनात्मक संख्या यदि b से अधिक है। सांख्यिक सरणियों को क्रमबद्ध करने के लिए एक समान कार्य लिखते समय, यह a और b को घटाता a । इसलिए, अभिव्यक्ति का मूल्यांकन करने का परिणाम a - b अर्थ है आरोही क्रम में सरणी को छांटना, अभिव्यक्ति b - a के मूल्यांकन के परिणाम को वापस करना b - a सरणी को अवरोही क्रम में सॉर्ट करेगा।

 const a = [1, 10, 3, 2, 11] console.log(a.sort((a, b) => a - b)) //[ 1, 2, 3, 10, 11 ] console.log(a.sort((a, b) => b - a)) //[ 11, 10, 3, 2, 1 ] 

सरणी तत्वों के अनुक्रम को उलटने के लिए, आप reverse() विधि का उपयोग कर सकते हैं। यह, sort() की sort() , उस सरणी को संशोधित करता है जिसके लिए इसे कहा जाता है।

एक सरणी का एक स्ट्रिंग प्रतिनिधित्व ▍Getting

किसी सरणी का एक स्ट्रिंग प्रतिनिधित्व प्राप्त करने के लिए, आप इसकी toString() विधि का उपयोग कर सकते हैं।

 a.toString() 

एक समान परिणाम join() विधि द्वारा दिया जाता है, जिसे तर्कों के बिना कहा जाता है।

 a.join() 

इसके लिए, एक तर्क के रूप में, आप विभाजक तत्वों को पारित कर सकते हैं।

 const a = [1, 10, 3, 2, 11] console.log(a.toString()) //1,10,3,2,11 console.log(a.join()) //1,10,3,2,11 console.log(a.join(', ')) //1, 10, 3, 2, 11 

Arr सरणियों की प्रतिलिपि बनाना

मूल सरणी के मानों को नए सरणी में कॉपी करके सरणी की प्रतिलिपि बनाने के लिए, आप Array.from() विधि का उपयोग कर सकते हैं। यह सरणी जैसी वस्तुओं (उदाहरण के लिए, स्ट्रिंग) से सरणियों के निर्माण के लिए भी उपयुक्त है।

 const a = 'a string' const b = Array.from(a) console.log(b) //[ 'a', ' ', 's', 't', 'r', 'i', 'n', 'g' ] 

Array.of() विधि का उपयोग सरणियों की प्रतिलिपि बनाने के लिए भी किया जा सकता है, साथ ही विभिन्न तत्वों से "इकट्ठा" सरणियों के लिए भी किया जा सकता है। उदाहरण के लिए, एक सरणी के तत्वों को दूसरे में कॉपी करने के लिए, आप निम्न निर्माण का उपयोग कर सकते हैं।

 const a = [1, 10, 3, 2, 11] const b = Array.of(...a) console.log(b) // [ 1, 10, 3, 2, 11 ] 

copyWithin() विधि का उपयोग सरणी के तत्वों को इस सरणी के एक निश्चित स्थान पर कॉपी करने के लिए किया जाता है। इसका पहला तर्क लक्ष्य की स्थिति के प्रारंभिक सूचकांक को निर्दिष्ट करता है, तत्व स्रोत की स्थिति का दूसरा प्रारंभिक सूचकांक और तीसरा पैरामीटर, वैकल्पिक, तत्व स्रोत की स्थिति के अंतिम सूचकांक को इंगित करता है। यदि आप इसे निर्दिष्ट नहीं करते हैं, तो सब कुछ सरणी के निर्दिष्ट स्थान पर कॉपी किया जाएगा, जो स्रोत स्थिति के प्रारंभिक सूचकांक से सरणी के अंत तक शुरू होता है।

 const a = [1, 2, 3, 4, 5] a.copyWithin(0, 2) console.log(a) //[ 3, 4, 5, 4, 5 ] 

चक्र

उपरोक्त सरणियों के बारे में बोलते हुए, हम पहले से ही लूप के आयोजन के कुछ तरीकों के बारे में जान चुके हैं। हालांकि, जावास्क्रिप्ट में छोरों का उपयोग केवल सरणियों के साथ काम करने के लिए नहीं किया जाता है, और हमने उनके सभी प्रकारों से दूर माना है। इसलिए, अब हम जावास्क्रिप्ट में लूप के आयोजन के विभिन्न तरीकों पर चर्चा करने के लिए कुछ समय समर्पित करेंगे और उनकी विशेषताओं के बारे में बात करेंगे।

▍ लूप के लिए

इस चक्र को लागू करने के एक उदाहरण पर विचार करें।

 const list = ['a', 'b', 'c'] for (let i = 0; i < list.length; i++) { console.log(list[i]) //,     console.log(i) // } 

जैसा कि पहले ही उल्लेख किया गया है, आप break कमांड का उपयोग करके इस तरह के लूप के निष्पादन को बाधित कर सकते हैं, और आप वर्तमान पुनरावृत्ति को छोड़ सकते हैं और continue कमांड का उपयोग करके सीधे अगले पर जा सकते हैं।

▍ पूर्वचक्र

हमने इस चक्र पर भी चर्चा की। यहाँ एक सरणी का उपयोग करके इसे पुनरावृत्त करने का एक उदाहरण है।

 const list = ['a', 'b', 'c'] list.forEach((item, index) => { console.log(item) // console.log(index) // }) //     ,      list.forEach(item => console.log(item)) 

याद रखें कि इस तरह के चक्र को बाधित करने के लिए, अपवाद को फेंकना आवश्यक है, अर्थात, यदि आपको चक्र का उपयोग करते समय इसे बाधित करने की आवश्यकता हो सकती है, तो कुछ अन्य चक्र को चुनना बेहतर होता है।

▍ करो ... लूप करते समय

यह तथाकथित "पोस्टकंडिशन चक्र" है। लूप को समाप्त करने के लिए स्थिति की जांच करने से पहले कम से कम एक बार इस तरह के लूप को निष्पादित किया जाएगा।

 const list = ['a', 'b', 'c'] let i = 0 do { console.log(list[i]) // console.log(i) // i = i + 1 } while (i < list.length) 

break कमांड का उपयोग करके इसे बाधित किया जा सकता है, आप continue कमांड के साथ इसके अगले पुनरावृत्ति के लिए आगे बढ़ सकते हैं।

▍ जबकि लूप

यह तथाकथित "पूर्वनिर्मित चक्र" है। यदि, चक्र के प्रवेश द्वार पर, चक्र को जारी रखने की स्थिति झूठी है, तो इसे एक बार भी निष्पादित नहीं किया जाएगा।

 const list = ['a', 'b', 'c'] let i = 0 while (i < list.length) { console.log(list[i]) // console.log(i) // i = i + 1 } 

▍ के लिए ... लूप में

यह लूप आपको किसी ऑब्जेक्ट के एन्यूमरेटेड गुणों पर उनके नाम से पुनरावृति करने की अनुमति देता है।

 let object = {a: 1, b: 2, c: 'three'} for (let property in object) { console.log(property) //  console.log(object[property]) //  } 

▍ ... के लिए साइकिल

चक्र के for...of forEach चक्र की सुविधा और नियमित उपकरण का उपयोग करके इसके संचालन को बाधित करने की क्षमता को जोड़ती है।

 //  for (const value of ['a', 'b', 'c']) { console.log(value) // } //       `entries()` for (const [index, value] of ['a', 'b', 'c'].entries()) { console.log(index) // console.log(value) // } 

ध्यान दें कि यहाँ, लूप हैडर में, const कीवर्ड का उपयोग किया जाता है, और नहीं, जैसा कि आप उम्मीद कर सकते हैं, let । यदि लूप ब्लॉक के अंदर चर को पुन: असाइन करने की आवश्यकता नहीं है, तो const हमें पूरी तरह से सूट करता है।
अगर हम लूप्स के for...in और for...of तुलना करते हैं, तो यह पता चलता है कि for...in प्रॉपर्टीज के नामों के बारे for...in पुनरावृत्तियों for...in और प्रॉपर्टीज के मूल्यों के लिए।

लूप और स्कोप

लूप और चर स्कोप के साथ, एक जावास्क्रिप्ट सुविधा है जो डेवलपर को कुछ समस्याएं पैदा कर सकती है। इन समस्याओं से निपटने के लिए, let लूप्स के बारे में, var बारे में, और var बारे में और कीवर्ड्स के बारे में बात करते हैं।

एक उदाहरण पर विचार करें।

 const operations = [] for (var i = 0; i < 5; i++) { operations.push(() => {   console.log(i) }) } for (const operation of operations) { operation() } 

लूप 5 पुनरावृत्तियों को निष्पादित करता है, जिनमें से प्रत्येक में operations सरणी में एक नया फ़ंक्शन जोड़ा जाता है। यह फ़ंक्शन कंसोल में लूप काउंटर के मान को प्रदर्शित करता है - i । फ़ंक्शन को सरणी में जोड़ने के बाद, हम इस सरणी पर पुनरावृति करते हैं और उन फ़ंक्शन को कॉल करते हैं जो इसके तत्व हैं।

ऐसे कोड को निष्पादित करके, आप नीचे दिखाए गए परिणाम की अपेक्षा कर सकते हैं।

 0 1 2 3 4 

लेकिन वास्तव में, वह निम्नलिखित को प्रभावित करता है।

 5 5 5 5 5 

ऐसा क्यों है? बात यह है कि लूप काउंटर के रूप में हम एक चर का उपयोग करते हुए घोषित करते हैं।

चूँकि ऐसे चरों की घोषणाएँ गुंजाइश के शीर्ष तक जाती हैं, इसलिए उपरोक्त कोड निम्न के समान है।

 var i; const operations = [] for (i = 0; i < 5; i++) { operations.push(() => {   console.log(i) }) } for (const operation of operations) { operation() } 

नतीजतन, यह पता चला है कि for...of लूप के लिए, जिसमें हम सरणी पर पुनरावृति करते हैं, चर i अभी भी दिखाई दे रहा है, यह 5 है, परिणामस्वरूप, सभी कार्यों में i जिक्र करते हुए, हम संख्या 5 को प्रिंट करते हैं।

कार्यक्रम के व्यवहार को कैसे बदलना है ताकि वह वह कर सके जो उससे अपेक्षित है?

इस समस्या का सबसे सरल समाधान है कि let कीवर्ड का उपयोग करें। यह, जैसा कि हमने पहले ही कहा था, ईएस 6 में दिखाई दिया, इसका उपयोग आपको कुछ विषमताओं से छुटकारा var ।

विशेष रूप से, उपरोक्त उदाहरण में, यह let लिए var को बदलने के लिए पर्याप्त है और सब कुछ उसी तरह काम करेगा जैसे इसे करना चाहिए।

 const operations = [] for (let i = 0; i < 5; i++) { operations.push(() => {   console.log(i) }) } for (const operation of operations) { operation() } 

अब, लूप के प्रत्येक पुनरावृत्ति पर, operations सरणी में जोड़ा गया प्रत्येक फ़ंक्शन i की अपनी प्रति प्राप्त करता है। याद रखें कि इस स्थिति में आप const कीवर्ड का उपयोग नहीं कर सकते हैं, क्योंकि लूप में i का मान बदल जाता है।

इस समस्या को हल करने का एक और तरीका, जिसका उपयोग अक्सर ईएस 6 मानक से पहले किया जाता था, जब let कीवर्ड नहीं था, आईआईएफई का उपयोग करना है।

इस दृष्टिकोण के साथ, i मूल्य क्लोजर में संग्रहीत किया जाता है, और IIFE द्वारा लौटाए गए फ़ंक्शन और क्लोजर तक पहुंच होने से यह सरणी में हो जाता है। यह फ़ंक्शन आवश्यक होने पर किया जा सकता है। यहाँ है कि यह कैसा दिखता है।

 const operations = [] for (var i = 0; i < 5; i++) { operations.push(((j) => {   return () => console.log(j) })(i)) } for (const operation of operations) { operation() } 

परिणाम

आज हमने जावास्क्रिप्ट में सरणियों और छोरों के बारे में बात की। हमारे अगले लेख का विषय अपवाद हैंडलिंग, अर्धविराम उपयोग पैटर्न और टेम्पलेट शाब्दिक है।

प्रिय पाठकों! जावास्क्रिप्ट में सरणियों के साथ काम करने के लिए क्या तरीके आप सबसे अधिक बार उपयोग करते हैं?