जावास्क्रिप्ट व्यंजनों का रहस्य: मसाले

निम्नलिखित कोड स्निपेट पर एक नज़र डालें जो एक ही समस्या को हल करते हैं, और सोचते हैं कि आपको कौन सा सबसे अच्छा लगता है।

यहाँ पहले एक है:	यहाँ दूसरा है:
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10] .filter(int => isEven(int)) .filter(int => isBiggerThan(3, int)) .map(int => int + 1) .map(int => toChar(int)) .filter(char => !isVowel(char)) .join('') // 'fhjl'	[1, 2, 3, 4, 5, 6, 7, 8, 9, 10] .filter(isEven) .filter(isBiggerThan(3)) .map(plus(1)) .map(toChar) .filter(not(isVowel)) .join('') // 'fhjl'

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



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

साधारण कार्य

एक साधारण sum() फ़ंक्शन पर विचार करें जो इसमें दिए गए नंबरों को जोड़ता है:

 const sum = (a, b) => a + b sum(1, 2) // 3 

हम इसे फिर से लिखेंगे, नए फंक्शन का नाम csum() :

 const csum = a => b => a + b csum(1)(2) // 3 

इसका नया संस्करण ठीक उसी तरह काम करता है जैसे मूल एक, केवल अंतर यह है कि इस नए फ़ंक्शन को कैसे कहा जाता है। अर्थात्, sum() फ़ंक्शन एक बार में दो पैरामीटर लेता है, और csum() एक समय में एक ही पैरामीटर लेता है। वास्तव में, csum() कॉल करते समय, दो फ़ंक्शन कहलाते हैं। विशेष रूप से, उस स्थिति पर विचार करें जब csum() कहा जाता है, इसे नंबर 1 पास करना और कुछ नहीं:

 csum(1) // b => 1 + b 

csum() को इस तरह की कॉल इस तथ्य की ओर ले जाती है कि यह एक फ़ंक्शन देता है जो अपने सामान्य कॉल के दौरान csum() को csum() गए दूसरे संख्यात्मक तर्क को स्वीकार कर सकता है, और इस तर्क में एक जोड़ने का परिणाम देता है। इस फ़ंक्शन को कॉल करें plusOne() :

 const plusOne = csum(1) plusOne(2) // 3 

सरणियों के साथ काम करें

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

उदाहरण के लिए, पूर्णांक सरणी के प्रत्येक तत्व को बढ़ाने के लिए (अधिक सटीक रूप से, एक नई सरणी बनाने के लिए मूल सरणी के तत्वों में 1 से वृद्धि हुई है), आप निम्नलिखित निर्माण का उपयोग कर सकते हैं:

 [1, 2, 3].map(x => x + 1) // [2, 3, 4] 

दूसरे शब्दों में, जो कुछ भी हो रहा है, उसे इस प्रकार वर्णित किया जा सकता है: फ़ंक्शन x => x + 1 पूर्णांक लेता है और पूर्णांक की एक श्रृंखला में उसके बाद आने वाले नंबर को लौटाता है। ऊपर चर्चा की गई plusOne() फ़ंक्शन का उपयोग करते हुए, इस उदाहरण को फिर से लिखा जा सकता है:

 [1, 2, 3].map(x => plusOne(x)) // [2, 3, 4] 

यहां यह धीमा करना और क्या हो रहा है इसके बारे में सोचना सार्थक है। यदि आप ऐसा करते हैं, तो आप देख सकते हैं कि विचाराधीन मामले में, कंस्ट्रक्शन x => plusOne(x) और plusOne (ध्यान दें कि इस स्थिति में फ़ंक्शन नाम के बाद कोई ब्रैकेट नहीं हैं) बराबर हैं। इसे बेहतर ढंग से समझने के लिए, अन्य otherPlusOne() पर विचार करें otherPlusOne() फ़ंक्शन:

 const otherPlusOne = x => plusOne(x) otherPlusOne(1) // 2 

इस फ़ंक्शन का परिणाम plusOne() लिए एक सरल कॉल द्वारा प्राप्त किया गया जैसा ही होगा:

 plusOne(1) // 2 

उसी कारण से, हम निम्नलिखित दो निर्माणों की समानता के बारे में बात कर सकते हैं। यहाँ पहले वाला है जिसे हम पहले ही देख चुके हैं:

 [1, 2, 3].map(x => plusOne(x)) // [2, 3, 4] 

यहाँ दूसरा है:

 [1, 2, 3].map(plusOne) // [2, 3, 4] 

इसके अलावा, याद रखें कि plusOne() फ़ंक्शन कैसे बनाया गया था:

 const plusOne = csum(1) 

यह हमें map() साथ हमारे निर्माण को फिर से लिखने की अनुमति देता है:

 [1, 2, 3].map(csum(1)) // [2, 3, 4] 

अब, उसी तकनीक का उपयोग करते हुए, isBiggerThan() फ़ंक्शन isBiggerThan() । यदि आप चाहते हैं, तो इसे स्वयं करने का प्रयास करें, और फिर पढ़ें। यह filter() पद्धति का उपयोग करते समय अनावश्यक निर्माणों के उपयोग को समाप्त कर देगा। सबसे पहले, आइए कोड को इस रूप में लाएं:

 const isBiggerThan = (threshold, int) => int > threshold [1, 2, 3, 4].filter(int => isBiggerThan(3, int)) 

फिर, सब कुछ से छुटकारा पाने के लिए, हमें वह कोड मिलता है जो आपने इस सामग्री की शुरुआत में देखा था:

 [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] .filter(isEven) .filter(isBiggerThan(3)) .map(plus(1)) .map(toChar) .filter(not(isVowel)) .join('') // 'fhjl' 

अब हम दो सरल नियमों पर विचार करते हैं जो आपको यहां चर्चा की गई शैली में कोड लिखने की अनुमति देते हैं।

नियम संख्या १

निम्नलिखित दो निर्माण बराबर हैं:

 […].map(x => fnc(x)) […].map(fnc) 

नियम संख्या २

इसे कॉल करने के लिए उपयोग किए जाने वाले तर्कों की संख्या को कम करने के लिए कॉलबैक को फिर से लिखा जा सकता है:

 const fnc = (x, y, z) => … […].map(x => fnc(x, y, z)) const fnc = (y, z) => x => … […].map(fnc(y, z)) 

यदि आपने स्वयं isBiggerThan() फ़ंक्शन लिखा है, तो आप शायद पहले से ही इस तरह के परिवर्तन का सहारा ले सकते हैं। मान लें कि फ़िल्टर से गुजरने के लिए हमें 3 से अधिक संख्याओं की आवश्यकता है। इसे इस तरह किया जा सकता है:

 const isBiggerThan = (threshold, int) => int > threshold […].filter(int => isBiggerThan(3, int)) 

अब हम isBiggerThan() फ़ंक्शन को फिर से isBiggerThan() ताकि इसे filter() विधि में उपयोग किया जा सके और int=> निर्माण का उपयोग न करें:

 const isBiggerThan = threshold => int => int > threshold […].map(isBiggerThan(3)) 

व्यायाम

मान लें कि हमारे पास निम्नलिखित कोड टुकड़ा है:

 const keepGreatestChar = (char1, char2) => char1 > char2 ? char1 : char2 keepGreatestChar('b', 'f') // 'f' //   'f'   'b' 

अब keepGreatestChar() फ़ंक्शन के आधार पर, keepGreatestChar() फ़ंक्शन बनाएं। हमें इसकी आवश्यकता है, इसे कॉल करके, हम इसके लिए केवल एक तर्क पारित कर सकते हैं, जबकि यह चरित्र b साथ इसे पारित चरित्र की तुलना करेगा। यह फ़ंक्शन इस तरह दिख सकता है:

 const keepGreatestChar = (char1, char2) => char1 > char2 ? char1 : char2 const keepGreatestCharBetweenBAnd = char => keepGreatestChar('b', char) keepGreatestCharBetweenBAnd('a') // 'b' //   'b'   'a' 

अब greatestCharInArray() keepGreatestChar() फ़ंक्शन keepGreatestChar() , जो कि reduce() सरणी विधि में keepGreatestChar() फ़ंक्शन का उपयोग करके, आपको "सबसे बड़ा" वर्ण खोजने के लिए अनुमति देता है और तर्क की आवश्यकता नहीं है। इस कोड के साथ शुरू करते हैं:

 const keepGreatestChar = (char1, char2) => char1 > char2 ? char1 : char2 const greatestCharInArray = array => array.reduce((acc, char) => acc > char ? acc : char, 'a') greatestCharInArray(['a', 'b', 'c', 'd']) // 'd' 

इस समस्या को हल करने के लिए, creduce() फ़ंक्शन को कार्यान्वित करें, जिसका उपयोग greatestCharInArray() creduce() फ़ंक्शन में किया जा सकता है, जो इस फ़ंक्शन के व्यावहारिक अनुप्रयोग में, उस सरणी के अलावा कुछ भी पास नहीं करने की अनुमति देता है जिसमें चरित्र को सबसे बड़ा कोड ढूंढना है।

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

 const greatestCharInArray = creduce(keepGreatestChar, 'a') greatestCharInArray(['a', 'b', 'c', 'd']) // 'd' 

परिणाम

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

प्रिय पाठकों! क्या आप जावास्क्रिप्ट विकास में फ़ंक्शन करी का उपयोग करते हैं?