जावास्क्रिप्ट में फ़ंक्शंस कैसे करें

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

जावास्क्रिप्ट में करी फ़ंक्शन के बारे में सब कुछ जानें, फ़ंक्शन बनाने के लिए करी तकनीक का उपयोग कैसे करें आंशिक रूप से लागू फ़ंक्शंस, साथ ही वास्तविक जीवन में उपयोग किए गए फ़ंक्शंस और आंशिक रूप से लागू दोनों के लिए उपयोग के मामले कार्य.

करींग क्या है?

करीइंग का नाम गणितज्ञ हास्केल बी के नाम पर रखा गया है। करी, और यह अवधारणा लैम्ब्डा कैलकुलस से निकली है। करीइंग एक ऐसा फ़ंक्शन लेता है जो एक से अधिक पैरामीटर प्राप्त करता है और इसे यूनरी (एक-पैरामीटर) फ़ंक्शन की श्रृंखला में तोड़ देता है। दूसरे शब्दों में, एक तैयार किया गया फ़ंक्शन एक समय में केवल एक पैरामीटर लेता है।

करीइंग का एक बुनियादी उदाहरण

नीचे एक करीबी फ़ंक्शन का उदाहरण दिया गया है:

functionbuildSandwich(ingredient1) 





instagram viewer
{
return(ingredient2) => {
return(ingredient3) => {
return`${ingredient1},${ingredient2},${ingredient3}`
 }
 }
}

बिल्डसैंडविच() फ़ंक्शन एक अन्य फ़ंक्शन लौटाता है - एक अज्ञात फ़ंक्शन जो प्राप्त करता है सामग्री2 तर्क। फिर, यह अनाम फ़ंक्शन एक अन्य अनाम फ़ंक्शन लौटाता है जो प्राप्त होता है सामग्री3. अंत में, यह अंतिम फ़ंक्शन टेम्पलेट को शाब्दिक रूप से लौटाता है जावास्क्रिप्ट में स्ट्रिंग्स को फ़ॉर्मेट करना.

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

console.log(buildSandwich("Bacon"))

आप आउटपुट से देख सकते हैं कि बिल्डसैंडविच एक फ़ंक्शन लौटाता है:

फ़ंक्शन कॉल को पूरा करने के लिए, आपको सभी तीन तर्क देने होंगे:

buildSandwich("Bacon")("Lettuce")("Tomato")

यह कोड पहले फ़ंक्शन में "बेकन", दूसरे में "लेटस" और अंतिम फ़ंक्शन में "टमाटर" पास करता है। दूसरे शब्दों में, बिल्डसैंडविच() फ़ंक्शन वास्तव में तीन फ़ंक्शन में विभाजित है, प्रत्येक फ़ंक्शन को केवल एक पैरामीटर प्राप्त होता है।

हालाँकि यह पारंपरिक कार्यों का उपयोग करके करी करने के लिए पूरी तरह से वैध है, लेकिन जितना अधिक आप गहराई में जाएंगे, सभी घोंसले बहुत बदसूरत हो सकते हैं। इससे निजात पाने के लिए, आप एरो फ़ंक्शंस का उपयोग कर सकते हैं और उनके क्लीनर सिंटैक्स का लाभ उठा सकते हैं:

const buildMeal = ingred1 =>ingred2 =>ingred3 =>
`${ingred1}, ${ingred2}. ${ingred3}`;

यह पुनर्निर्मित संस्करण अधिक संक्षिप्त है, इसका उपयोग करने का एक फायदा है एरो फ़ंक्शंस बनाम नियमित फ़ंक्शंस. आप फ़ंक्शन को उसी तरह कॉल कर सकते हैं जैसे आपने पिछले वाले के साथ किया था:

buildMeal("Bacon")("Lettuce")("Tomato")

आंशिक रूप से लागू करी फ़ंक्शंस

आंशिक रूप से लागू फ़ंक्शन करीइंग का एक सामान्य उपयोग है। इस तकनीक में एक समय में केवल आवश्यक तर्कों की आपूर्ति करना शामिल है (सभी तर्कों की आपूर्ति करने के बजाय)। जब भी आप सभी आवश्यक मापदंडों को पारित करके किसी फ़ंक्शन का आह्वान करते हैं, तो आप कहते हैं कि आपने उस फ़ंक्शन को "लागू" कर दिया है।

आइए एक उदाहरण देखें:

const multiply = (x, y) => x * y;

नीचे गुणा का नवीनतम संस्करण दिया गया है:

const curriedMultiply = x =>y => x * y;

करीडमल्टीप्लाई() फ़ंक्शन प्राप्त करता है एक्स पहले फ़ंक्शन के लिए तर्क और य दूसरे फ़ंक्शन के लिए, यह दोनों मानों को गुणा करता है।

पहला आंशिक रूप से लागू फ़ंक्शन बनाने के लिए कॉल करें करीडमल्टीपल() पहले पैरामीटर के साथ और लौटाए गए फ़ंक्शन को एक वेरिएबल पर असाइन करें:

const timesTen = curriedMultiply(10)

इस बिंदु पर, कोड को "आंशिक रूप से लागू" किया गया है करीडमल्टीप्लाई() समारोह। तो जब भी आप कॉल करना चाहें टाइम्सटेन(), आपको बस इसे एक नंबर पास करना होगा और संख्या स्वचालित रूप से 10 से गुणा हो जाएगी (जो कि लागू फ़ंक्शन के अंदर संग्रहीत है):

console.log(timesTen(8)) // 80

यह आपको एक ही जटिल फ़ंक्शन से कई कस्टम फ़ंक्शंस बनाकर निर्माण करने देता है, जिनमें से प्रत्येक की अपनी कार्यक्षमता लॉक होती है।

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

const updateElemText = id = content
 => document.querySelector(`#${id}`).textContent = content
// Lock the element's id into the function:
const updateHeaderText = updateElemText('header')
// Update the header text
updateHeaderText("Hello World!")

करीड फ़ंक्शंस के साथ फ़ंक्शन संरचना

करीइंग का एक अन्य सामान्य उपयोग फ़ंक्शन संरचना है। यह आपको छोटे फ़ंक्शंस को एक विशिष्ट क्रम में कॉल करने और उन्हें एक एकल, अधिक जटिल फ़ंक्शन में संयोजित करने की सुविधा देता है।

उदाहरण के लिए, एक काल्पनिक ई-कॉमर्स वेबसाइट में, यहां तीन फ़ंक्शन हैं जिन्हें आप एक के बाद एक (सटीक क्रम में) चलाना चाहेंगे:

const addCustomer = fn =>(...args) => {
console.log("Saving customer info")
return fn(...args)
}
const processOrder = fn =>(...args) => {
console.log(`processing order #${args[0]}`)
return fn(...args);
}
let completeOrder = (...args) => {
console.log(`Order #${[...args].toString()} completed.`);
}

ध्यान दें कि यह कोड इसका उपयोग करता है होने देना परिभाषित करने के लिए कीवर्ड आदेश पूरा() समारोह। यह आपको वेरिएबल के लिए एक मान पुन: असाइन करने की अनुमति देता है और इसका हिस्सा है जावास्क्रिप्ट में स्कोपिंग कैसे काम करती है.

इसके बाद, आपको फ़ंक्शन को उल्टे क्रम में (अंदर से बाहर तक) कॉल करना होगा क्योंकि आप पहले ग्राहकों को जोड़ना चाहेंगे:

completeOrder = (processOrder(completeOrder));
completeOrder = (addCustomer(completeOrder));
completeOrder("1000")

यह आपको निम्नलिखित आउटपुट देगा:

यदि आप उपरोक्त फ़ंक्शन को नियमित तरीके से लिखते हैं, तो कोड कुछ इस तरह दिखेगा:

functionaddCustomer(...args) {
returnfunctionprocessOrder(...args) {
returnfunctioncompleteOrder(...args) {
// end
 }
 }
}

जब आप कॉल करते हैं ग्राहक जोड़ें() फ़ंक्शन करें और तर्कों को पास करें, आप अंदर से शुरू कर रहे हैं और फ़ंक्शन के शीर्ष तक अपना रास्ता बना रहे हैं।

करी फंक्शन के साथ एक सामान्य फंक्शन को करी फंक्शन में बदलें

यदि आप करीड फ़ंक्शंस का बहुत अधिक उपयोग करने की योजना बना रहे हैं, तो आप एक सहायक फ़ंक्शन के साथ प्रक्रिया को सुव्यवस्थित कर सकते हैं।

यह फ़ंक्शन किसी भी सामान्य फ़ंक्शन को एक त्वरित फ़ंक्शन में परिवर्तित कर देगा। यह किसी भी संख्या में तर्कों को संभालने के लिए रिकर्सन का उपयोग करता है।

const curry = (fn) => {
return curried = (...args) => {
if (fn.length !== args.length) {
return curried.bind(null, ...args)
 }
return fn(...args);
 }
}

यह फ़ंक्शन किसी भी मानक लिखित फ़ंक्शन को स्वीकार करेगा जो एक से अधिक पैरामीटर प्राप्त करता है, उस फ़ंक्शन का एक तैयार संस्करण लौटाएगा। इसे कार्य में देखने के लिए, इस उदाहरण फ़ंक्शन का उपयोग करें जो तीन पैरामीटर लेता है और उन्हें एक साथ जोड़ता है:

const total = (x, y, z) => x + y + z

इस फ़ंक्शन को कनवर्ट करने के लिए, कॉल करें करी() कार्य करें और पास करें कुल एक तर्क के रूप में:

const curriedTotal = curry(total)

अब फ़ंक्शन को कॉल करने के लिए, आपको बस सभी तर्कों को पारित करना होगा:

console.log(curriedTotal(10)(20)(30)) // 60

जावास्क्रिप्ट में फ़ंक्शंस के बारे में अधिक जानकारी

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