ऐरे तरीके

docs.scrimba.com

आपके पास कीमतों की एक सूची है और आप दूसरी सूची चाहते हैं जिसमें प्रत्येक पर कर जोड़ा गया हो। आप एक for लूप लिख सकते हैं जो ऐरे को पार करता है, योग करता है, और प्रत्येक परिणाम को एक नई ऐरे में धकेलता है। यह काम करता है, लेकिन एक छोटे विचार के लिए बहुत सारी वायरिंग है: हर आइटम लें और इसे बदलें। ऐरे तरीके बिल्कुल इस तरह के काम के लिए बनाए गए उपकरण हैं। वे आपको लूप को विस्तार से बताए बिना कहने देते हैं कि एक सूची के साथ क्या करना है, और यह अध्याय वे कवर करता है जिन्हें आप रोज़ पहुंचेंगे। वे सीधे ऐरे और फ़ंक्शन पर बनाते हैं, इसलिए दोनों को पास रखें।

map: हर आइटम को बदलें

map एक विधि है: एक फ़ंक्शन जो एक ऐरे से संबंधित है और इस पर काम करता है। map एक नई ऐरे बनाता है जो हर आइटम को एक छोटे फ़ंक्शन के माध्यम से चलाता है जो आप इसे देते हैं, और परिणाम एकत्र करते हैं। आप इसे वह फ़ंक्शन पास करते हैं, और यह एक समय में हर आइटम को हाथ देता है।

मान लीजिए आपके पास कुछ कीमतें हैं और आप चाहते हैं कि हर एक दोगुनी हो:

const prices = [2, 4, 6];
const doubled = prices.map((price) => price * 2);
console.log(doubled); // [4, 8, 12]

(price) => price * 2 भाग एक तीर फ़ंक्शन है: एक छोटा फ़ंक्शन जो एक आइटम (price) लेता है और यह रिटर्न करता है कि यह क्या होना चाहिए (price * 2)। map इसे एक बार प्रति आइटम कॉल करता है और हर उत्तर को नई ऐरे में एक ही क्रम में रखता है।

map एक ऐरे विधि है जो एक सूची को समान लंबाई की नई सूची में रूपांतरित करता है। आप इसे एक कॉलबैक देते हैं, एक फ़ंक्शन जो map एक बार प्रति आइटम चलाता है, और जो भी वह कॉलबैक रिटर्न करता है वह परिणाम के समान स्थिति में आइटम बन जाता है।

const prices = [2, 4, 6];
const doubled = prices.map((price) => price * 2);
console.log(doubled); // [4, 8, 12]

इसकी तुलना मैनुअल संस्करण से करें, जो अधिक चलती भागों के साथ वही करता है:

const prices = [2, 4, 6];
const doubled = [];
for (let i = 0; i < prices.length; i += 1) {
  doubled.push(prices[i] * 2);
}
console.log(doubled); // [4, 8, 12]

लूप आपको एक इंडेक्स, एक ताज़ी ऐरे, और एक push का प्रबंधन करना पड़ता है। map इरादा बताता है, "हर कीमत को कीमत गुणा दो में बदलें", और आपके लिए बुकिपिंग को संभालता है।

map एक ऐरे को समान लंबाई की नई ऐरे में रूपांतरित करता है जो एक कॉलबैक (फ़ंक्शन जो आप इसे कॉल करने के लिए पास करते हैं) को प्रत्येक तत्व पर लागू करके। कॉलबैक का रिटर्न मान इंडेक्स i पर परिणाम के इंडेक्स i पर तत्व बन जाता है। कुछ भी छोड़ा नहीं जाता है और कुछ भी जोड़ा नहीं जाता है, इसलिए आकार संरक्षित है और केवल मान बदलते हैं।

const prices = [2, 4, 6];
const withTax = prices.map((price) => price * 1.2);
console.log(withTax); // [2.4, 4.8, 7.2]

कॉलबैक दूसरे और तीसरे तर्कों के रूप में इंडेक्स और पूरी ऐरे भी प्राप्त करता है, इसलिए array.map((value, index) => ...) उपलब्ध है जब स्थिति महत्वपूर्ण है। यह जो मूल्य है वह इरादा है: map कहता है "समान लंबाई, हर आइटम रूपांतरित" एक नज़र में, जहाँ एक लूप को पाठक इंडेक्स, काउंटर, और push से पुनर्निर्माण करता है।

Junomapmap एक सूची लेता है और आपको समान लंबाई की एक नई सूची देता है, हर आइटम अपने छोटे फ़ंक्शन के माध्यम से चलाया जाता है। तीर फ़ंक्शन कहता है कि प्रत्येक आइटम क्या बन जाता है, और map इसे क्रम में सभी के लिए करता है। इसे हर बार पहुंचें जब आप अपने आप को केवल दूसरी सूची बनाने के लिए एक लूप लिखते हुए पकड़ें।

Junomapmap है "हर आइटम को समान लंबाई की नई ऐरे में बदलें"। कॉलबैक एक बार प्रति आइटम चलाता है और इसका रिटर्न मान समान स्थिति में आता है। एक बार जब आप इसे लूप-प्लस-पुश पैटर्न के प्रतिस्थापन के रूप में देखते हैं, तो आपके आधे लूप एक ही पठनीय पंक्ति में बदल जाते हैं।

Junomapmap लंबाई और स्थिति को संरक्षित करता है: इंडेक्स i पर कॉलबैक का रिटर्न परिणाम का इंडेक्स i बन जाता है। कॉलबैक को इंडेक्स और ऐरे भी मिलता है, जब स्थिति महत्वपूर्ण है। यह इरादा के रूप में पढ़ा जाता है जहाँ एक लूप को आप काउंटर और push से पुनर्निर्माण करते हैं।

filter: आइटम रखें जो पास हों

जहाँ map हर आइटम को बदलता है, filter केवल कुछ को रखता है। आप इसे एक फ़ंक्शन देते हैं जो हर आइटम के लिए हाँ या नहीं का जवाब देता है, और filter केवल वे आइटम जो हाँ पाए गए से एक नई ऐरे बनाता है।

const scores = [40, 75, 90, 55, 88];
const passing = scores.filter((score) => score >= 60);
console.log(passing); // [75, 90, 88]

फ़ंक्शन (score) => score >= 60 हर स्कोर के लिए true या false रिटर्न करता है। filter उन्हें रखता है जहाँ यह true है और बाकी को छोड़ देता है। नई ऐरे मूल से छोटी हो सकती है, और यह कभी भी क्रम को नहीं बदलता है।

filter एक नई ऐरे देता है जिसमें केवल वे आइटम हैं जिनके कॉलबैक true रिटर्न करते हैं। कॉलबैक एक प्रेडिकेट है: एक फ़ंक्शन जिसका काम हर आइटम के बारे में हाँ-या-नहीं का सवाल का जवाब देना है।

const scores = [40, 75, 90, 55, 88];
const passing = scores.filter((score) => score >= 60);
console.log(passing); // [75, 90, 88]

परिणाम अक्सर इनपुट से छोटा होता है, और यह मूल क्रम को रखता है। एक लूप की तुलना में if इसके अंदर, filter परीक्षण को सामने और केंद्र रखता है और इसके चारों ओर औपचारिकता को छोड़ देता है। यदि कॉलबैक सबकुछ के लिए true रिटर्न करता है तो आप एक पूर्ण प्रति वापस पाते हैं; यदि यह सबकुछ के लिए false रिटर्न करता है तो आप एक खाली ऐरे पाते हैं।

filter उन तत्वों की एक नई ऐरे देता है जिनके लिए प्रेडिकेट (कॉलबैक जिसका काम सच्चा या झूठा उत्तर रिटर्न करना है) रखता है। लंबाई संरक्षित नहीं है: परिणाम खाली से पूर्ण प्रतिलिपि तक चलता है, और क्रम रखा जाता है।

const scores = [40, 75, 90, 55, 88];
const passing = scores.filter((score) => score >= 60);
console.log(passing); // [75, 90, 88]

दो चीजें रखने के लिए सीधी हैं। पहला, filter तय करता है कि क्या एक आइटम जीवित रहता है; यह कभी भी आइटम को नहीं बदलता है, इसलिए जब आप दोनों को चुनना और रूपांतरित करना चाहते हैं तो इसे map के साथ संयोजित करें। दूसरा, कॉलबैक का रिटर्न एक बूलियन में जबरदस्ती किया जाता है, इसलिए एक प्रेडिकेट जो गलती से 0 या undefined रिटर्न करता है वह आइटम को छोड़ देता है जिन्हें आप रखना चाहते थे। एक स्पष्ट तुलना रिटर्न करें और बग की वह पूरी कक्षा गायब हो जाती है।

Junofilterfilter उन आइटम को रखता है जो एक परीक्षण पास करते हैं और बाकी को छोड़ देता है, इसलिए नई ऐरे अक्सर छोटी होती है। आपका फ़ंक्शन हर आइटम के लिए हाँ या नहीं का जवाब देता है, और केवल हाँ आते हैं। यह कभी भी कुछ को पुनः क्रम में नहीं रखता है, इसलिए जो जीवित रहता है वह उसी क्रम में रहता है जिसमें यह शुरू हुआ था।

Junofilterfilter उन आइटम को रखता है जिनके कॉलबैक true रिटर्न करते हैं, आपको एक नई ऐरे देते हैं जो समान लंबाई या छोटी है। कॉलबैक एक प्रेडिकेट है: एक हाँ-या-नहीं परीक्षण, एक रूपांतरक नहीं। सभी true एक पूर्ण प्रति देते हैं, सभी false एक खाली ऐरे देते हैं, और क्रम हमेशा संरक्षित होता है।

Junofilterfilter चुनता है, map रूपांतरित करता है, और यह विभाजन को स्वच्छ रखना यही है कि वे इतनी अच्छी तरह से क्यों जंजीर बनाते हैं। कॉलबैक का रिटर्न एक बूलियन में जबरदस्ती किया जाता है, इसलिए एक प्रेडिकेट जो 0 या undefined को चुपचाप छोड़ देता है वह आइटम को छोड़ देता है जिन्हें आप चाहते थे। एक स्पष्ट तुलना रिटर्न करें और बग की वह पूरी कक्षा चली जाती है।

reduce: इसे एक मान तक पकाएं

map और filter दोनों आपको एक ऐरे वापस देते हैं। reduce वह है जो एक ऐरे को एक एकल मान तक संक्षिप्त करता है: एक कुल, एक अधिकतम, एक जुड़ी हुई स्ट्रिंग। यह दूसरों की तुलना में लोगों को अधिक चिंता में डालता है, इसलिए धीरे-धीरे जाने के लायक है।

reduce ऐरे को चलाता है जबकि इसके साथ एक चलता हुआ परिणाम ले जाता है। हर आइटम पर यह पूछता है: अब तक का परिणाम दिया, और यह आइटम, नया परिणाम क्या है?

const prices = [10, 20, 30];
const total = prices.reduce((sum, price) => sum + price, 0);
console.log(total); // 60

फ़ंक्शन को दो चीजें मिलती हैं: sum, अब तक का चलता हुआ कुल, और price, वर्तमान आइटम। यह sum + price रिटर्न करता है, जो अगले आइटम के लिए नया चलता हुआ कुल बन जाता है। अंत में 0 यह है जहाँ कुल शुरू होता है। तो यह 0 + 10 जाता है, फिर 10 + 20, फिर 30 + 30, 60 पर उतरता है।

reduce पूरी ऐरे को एक मान में बदल देता है एक अकुमुलेटर ले जा कर: एक चलता हुआ परिणाम जो हर चरण अपडेट करता है और आगे बढ़ाता है। कॉलबैक अकुमुलेटर और वर्तमान आइटम प्राप्त करता है, और अगले चरण के लिए अकुमुलेटर रिटर्न करता है।

const prices = [10, 20, 30];
const total = prices.reduce((sum, price) => sum + price, 0);
console.log(total); // 60

दो तर्कों को स्पष्ट रखना है: sum अकुमुलेटर है (अब तक बनाया गया मान), price वर्तमान आइटम है। reduce के लिए दूसरा तर्क, 0, अकुमुलेटर का प्रारंभिक मान है। चरण दर चरण: 0 पर शुरू करें, 10 जोड़ें 10 पाने के लिए, 20 जोड़ें 30 पाने के लिए, 30 जोड़ें 60 पाने के लिए। यहाँ sum नाम केवल एक लेबल है; अकुमुलेटर किसी भी प्रकार का हो सकता है, एक स्ट्रिंग सहित जिसे आप जोड़ते रहते हैं या एक चलता हुआ अधिकतम।

reduce एक ऐरे को एक एकल मान में मोड़ता है एक अकुमुलेटर (चलता हुआ परिणाम) को ऐरे के माध्यम से थ्रेड करके। कॉलबैक (accumulator, currentItem) => nextAccumulator है, और इसका रिटर्न अगले चरण को हाथ दिया गया अकुमुलेटर बन जाता है। reduce के लिए दूसरा तर्क प्रारंभिक अकुमुलेटर है।

const prices = [10, 20, 30];
const total = prices.reduce((sum, price) => sum + price, 0);
console.log(total); // 60

दो व्यावहारिक नियम अधिकांश reduce बग बचाते हैं। हमेशा प्रारंभिक मान पास करें: इसके बिना, reduce पहले तत्व को बीज के रूप में उपयोग करता है और दूसरे पर शुरू करता है, जो एक खाली ऐरे पर फेंकता है और शांति से व्यवहार बदलता है जब आपका अकुमुलेटर प्रकार तत्व प्रकार से अलग होता है। और कॉलबैक के माध्यम से हर पथ अकुमुलेटर को रिटर्न करना चाहिए; एक बहु-पंक्ति बॉडी में return को भूलना अगले चरण के लिए अकुमुलेटर के रूप में undefined छोड़ देता है। reduce इन तरीकों में सबसे सामान्य है, map और filter दोनों को एक reduce के रूप में लिखा जा सकता है, जो बिल्कुल यही है कि यह भी सबसे आसान है अपठनीय बनाने के लिए। इसका उपयोग करें जब आप एक मान तक संक्षिप्त कर रहे हों, और कुछ सादा तक पहुंचें जब आप ऐसा नहीं कर रहे हों।

Junoreducereduce सूची के माध्यम से एक चलता हुआ परिणाम ले जाता है और हर आइटम पर इसे अपडेट करता है। कॉलबैक को अब तक का परिणाम प्लस वर्तमान आइटम मिलता है, और नया परिणाम रिटर्न करता है। अंतिम तर्क यह है जहाँ आप शुरू करते हैं, आमतौर पर कुल के लिए 0, और जब मैंने इसे जोर से पढ़ा तो यह मेरे लिए क्लिक हो गया।

Junoreducereduce एक अकुमुलेटर का उपयोग करके एक ऐरे को एक मान तक पकाता है: एक चलता हुआ परिणाम हर चरण अपडेट करता है और आगे बढ़ाता है। कॉलबैक (accumulator, item) है और अंतिम तर्क अकुमुलेटर को बीज देता है। यह एक संख्या नहीं है; अकुमुलेटर एक स्ट्रिंग हो सकता है जो आप बनाते हैं या एक चलता हुआ अधिकतम।

Junoreduce हमेशा प्रारंभिक मान पास करें, या reduce पहले तत्व से बीज देता है और एक खाली ऐरे पर फेंकता है। कॉलबैक के माध्यम से हर पथ अकुमुलेटर को रिटर्न करना चाहिए, या अगला चरण undefined पाता है। यह इन तरीकों में सबसे सामान्य है और अपठनीय बनाने के लिए सबसे आसान है, इसलिए इसका उपयोग एक मान तक संक्षिप्त करने के लिए करें और कुछ सादा तक पहुंचें जब आप ऐसा नहीं कर रहे हों।

find, some, और every

ये तीन filter के करीबी रिश्तेदार हैं: वे ऐरे पर एक परीक्षण चलाते हैं, लेकिन एक नई ऐरे के बजाय वे एक संकीर्ण सवाल का जवाब देते हैं।

find आपको परीक्षण पास करने वाली पहली आइटम देता है, न कि सभी की एक सूची। some और every पूरी ऐरे के बारे में सत्य-या-असत्य प्रश्नों के उत्तर देते हैं।

const scores = [40, 75, 90, 55];

const firstPass = scores.find((score) => score >= 60);
console.log(firstPass); // 75

const anyPass = scores.some((score) => score >= 60);
console.log(anyPass); // true

const allPass = scores.every((score) => score >= 60);
console.log(allPass); // false

find पहली मिलाई गई आइटम रिटर्न करता है (75)। some पूछता है "क्या कोई आइटम पास हुआ?" और true रिटर्न करता है क्योंकि कम से कम एक ने। every पूछता है "क्या वे सभी पास हुए?" और false रिटर्न करता है क्योंकि 40 और 55 नहीं हुए।

filter के समान प्रेडिकेट शैली, तीन अलग उत्तर। find पहली मिलाई गई आइटम रिटर्न करता है (या undefined यदि कोई मेल नहीं खाते)। some true रिटर्न करता है यदि कम से कम एक आइटम पास हो। every केवल true रिटर्न करता है यदि सभी पास हों।

const scores = [40, 75, 90, 55];

console.log(scores.find((score) => score >= 60)); // 75
console.log(scores.some((score) => score >= 60)); // true
console.log(scores.every((score) => score >= 60)); // false

find के लिए पहुंचें जब आप फ़िल्टर की गई सूची के बजाय एक आइटम चाहते हैं, और some या every जब आप केवल संग्रह के बारे में एक हाँ-या-नहीं उत्तर चाहते हैं। filter(...).length > 0 का उपयोग करना जहाँ some काम करेगा, लेकिन यह हर आइटम की जाँच करता है और some सीधे जवाब देने के लिए एक फेंक दी गई ऐरे बनाता है।

तीन प्रेडिकेट-चालित क्वेरी जो एक नई ऐरे बनाने के बजाय जल्दी बंद होती हैं। find पहली मिलाई गई तत्व रिटर्न करता है या undefined। some पहली पास करने वाली तत्व पर true रिटर्न करता है। every पहली विफल तत्व पर false रिटर्न करता है।

const scores = [40, 75, 90, 55];

console.log(scores.find((score) => score >= 60)); // 75
console.log(scores.some((score) => score >= 60)); // true
console.log(scores.every((score) => score >= 60)); // false

शॉर्ट-सर्किटिंग बात है: some और every उस पल बंद होते हैं जब उत्तर तय हो जाता है, इसलिए जब आप केवल एक बूलियन चाहते हैं तो वे पूरी ऐरे पर filter से सस्ते होते हैं। दो किनारे के मामलों को जानना है: find undefined रिटर्न करना एक वास्तविक undefined को खोजने से अप्रभेद्य है, इसलिए रिटर्न मान के बजाय प्रेडिकेट परीक्षा करें जब संभव हो। और एक खाली ऐरे पर some हमेशा false है और every हमेशा true है (खाली तरीके से, क्योंकि कोई आइटम विफल नहीं होने के लिए है), जो सही है लेकिन लोगों को पहली बार आश्चर्य करता है।

Junofind, some, और everyfind आपको पहली आइटम देता है जो पास हो, पूरी सूची नहीं। some पूछता है "क्या कोई पास हुआ?" और every पूछता है "क्या सभी पास हुए?", और दोनों true या false के साथ उत्तर देते हैं। जब आप एक आइटम या एक हाँ-या-नहीं उत्तर चाहते हैं, फ़िल्टर की गई ऐरे नहीं तो इनका उपयोग करें।

Junofind, some, और everyfilter के समान प्रेडिकेट, तीन संकीर्ण उत्तर: find पहली मिलान या undefined देता है, some सच है यदि कोई पास हो, every केवल सच है यदि सभी पास हों। जब आप एक आइटम या बूलियन चाहते हैं तो इन तक पहुंचें filter(...).length के बजाय, क्योंकि वे इरादा कहते हैं और फेंक दी गई ऐरे बनाने को छोड़ देते हैं।

Junofind, some, और everysome और every शॉर्ट-सर्किट करते हैं, उस पल बंद होते हैं जब उत्तर तय हो जाता है, इसलिए वे बूलियन के लिए पूरी ऐरे को फ़िल्टर करने को हराते हैं। दो किनारों को देखें: find undefined रिटर्न करना एक वास्तविक undefined को खोजने जैसा दिखता है, और एक खाली ऐरे पर some हमेशा झूठ है जबकि every हमेशा सच है। दोनों सही हैं, दोनों एक बार लोगों को आश्चर्य करते हैं।

चेनिंग और पठनीय रहना

ऊपर के तरीकों में एक डिजाइन है जो एक बार जब आप उन्हें संयोजित करते हैं तो भुगतान करता है: प्रत्येक एक नया मान देता है और मूल ऐरे को अकेला छोड़ देता है।

map, filter, और बाकी सब कभी भी आप जिस ऐरे के साथ शुरू करते हैं उसे नहीं बदलते। वे आपको एक नई ऐरे (या एक मान) देते हैं और मूल को अकेला रखते हैं।

const prices = [10, 20, 30];
const doubled = prices.map((price) => price * 2);
console.log(doubled); // [20, 40, 60]
console.log(prices); // [10, 20, 30]

क्योंकि map और filter दोनों एक ऐरे वापस देते हैं, आप उन्हें पंक्तिबद्ध कर सकते हैं: पहले फ़िल्टर करें, फिर बचे हुओं को मैप करें।

const prices = [10, 20, 30, 40];
const bigDoubled = prices.filter((price) => price >= 20).map((price) => price * 2);
console.log(bigDoubled); // [40, 60, 80]

ये तरीके नई ऐरे और मान रिटर्न करते हैं मूल को बदले बिना, एक संपत्ति जिसे अपरिवर्तनीयता कहा जाता है: आपका स्रोत डेटा जैसा था वैसा ही रहता है। यही है जो चेनिंग को सुरक्षित बनाता है। क्योंकि filter एक ऐरे रिटर्न करता है, आप अपने परिणाम पर सीधे map कॉल कर सकते हैं:

const prices = [10, 20, 30, 40];
const bigDoubled = prices.filter((price) => price >= 20).map((price) => price * 2);
console.log(bigDoubled); // [40, 60, 80]

एक पाइपलाइन के रूप में एक चेन को ऊपर से नीचे पढ़ें: 20 या अधिक की कीमतें रखें, फिर हर बचे हुए को दोगुना करें। क्रम महत्वपूर्ण है, क्योंकि पहले filter का मतलब है map कम आइटम पर चलाता है। चेनिंग दो या तीन चरणों तक अच्छी तरह से पढ़ता है; उसके आगे, एक नाम दी गई मध्यवर्ती चर या एक सादा लूप अक्सर एक लंबी चेन की तुलना में स्पष्ट होता है।

ये तरीके गैर-परिवर्तनशील हैं: वे नई ऐरे और मान रिटर्न करते हैं, स्रोत को अकेला छोड़ते हैं। वह अपरिवर्तनीयता यही है जो एक filter(...).map(...) चेन को एक पाइपलाइन के रूप में सुरक्षित रूप से पढ़ने योग्य बनाता है, क्योंकि कोई भी चरण वापस नहीं जाता है और आपके नीचे एक साझा ऐरे को संपादित करता है।

const prices = [10, 20, 30, 40];
const bigDoubled = prices.filter((price) => price >= 20).map((price) => price * 2);
console.log(bigDoubled); // [40, 60, 80]

दो निर्णय आहार तय करते हैं कि क्या एक चेन मदद करता है या चोट करता है। पहला, लागत: हर चरण ऐरे को चलाता है और एक नई आवंटित करता है, इसलिए तीन-चरण की चेन तीन पास और दो मध्यवर्ती ऐरे बनाता है। आकारों पर जो आप दिन-प्रतिदिन मिलते हैं वह अप्रासंगिक है और पठनीयता जीतता है; एक गर्म पथ पर बड़ी ऐरे पर यह महत्वपूर्ण हो सकता है, और एक एकल लूप या reduce जो काम को एक पास में करता है उत्तर है। दूसरा, स्पष्टता: एक चेन अपनी जगह अर्जित करता है जब हर चरण एक स्पष्ट विचार हो। जिस पल कॉलबैक शाखाओं के साथ एक बॉडी बढ़ता है, या चेन तीन चरणों के पास चलता है, एक सादा for लूप एक अच्छी तरह से नाम दिए गए चर के साथ आमतौर पर बेहतर पढ़ता है। वह संस्करण लिखना पसंद करें जो एक सहकर्मी सबसे तेज़ी से समझता है, न कि वह जो एक पंक्ति पर फिट बैठता है।

JunoChaining and staying readable ये तरीके कभी भी आप जिस ऐरे के साथ शुरू करते हैं उसे नहीं बदलते, वे आपको एक नई ऐरे देते हैं, इसलिए मूल हमेशा सुरक्षित है। क्योंकि filter और map दोनों ऐरे रिटर्न करते हैं, आप उन्हें चेन कर सकते हैं: पहले फ़िल्टर करें, फिर जो बचा है उसे मैप करें। चेन को ऊपर से नीचे, एक बार में एक चरण पढ़ें।

JunoChaining and staying readable अपरिवर्तनीयता, मूल ऐरे को अकेला रखना, यही है जो चेनिंग को सुरक्षित बनाता है। filter(...).map(...) को एक पाइपलाइन ऊपर से नीचे के रूप में पढ़ें, और याद रखें कि क्रम महत्वपूर्ण है क्योंकि पहले फ़िल्टर करने का मतलब कम आइटम को मैप करना है। दो या तीन चरणों के पास, एक नाम दी गई चर या एक सादा लूप आमतौर पर एक लंबी चेन की तुलना में स्पष्ट रूप से पढ़ता है।

JunoChaining and staying readable प्रत्येक चरण एक पास और एक आवंटन है, इसलिए एक चेन रोज़मर्रा के आकारों पर ठीक है और बड़े डेटा पर एक गर्म पथ पर एक लूप या reduce में संक्षिप्त करने के लायक है। स्पष्टता दूसरी कॉल है: एक चेन अपनी जगह अर्जित करता है जब हर चरण एक स्पष्ट विचार हो, और एक सादा लूप एक बार जीतता है कॉलबैक शाखाओं के साथ बढ़ता है। वह संस्करण लिखें जो एक सहकर्मी सबसे तेज़ी से पढ़ता है, न कि सबसे छोटा।

यहाँ से कहाँ जाएं

map, filter, और reduce अधिकांश को कवर करते हैं जो आप एक सूची के साथ करेंगे: इसे रूपांतरित करें, इसे संकीर्ण करें, या इसे संक्षिप्त करें। find, some, और every संकीर्ण सवालों के उत्तर देते हैं। एक बार जब ये प्राकृतिक महसूस करते हैं, तो आपके अधिकांश for लूप एक ऐरे पर एक या दो पंक्तियों में बदल जाते हैं जो कहता है कि आपका मतलब क्या था।

प्राकृतिक अगला चरण objects है, जहाँ ऐरे साधारण संख्या और स्ट्रिंग की तुलना में समृद्ध आइटम रखना शुरू करते हैं, और ये समान तरीके उन पर काम करते रहते हैं। यदि यहाँ कोई भी कॉलबैक सिंटैक्स अस्थिर महसूस करता था, तो functions के माध्यम से एक पास बाकी को जगह देता है।