कब और क्यों यह ES6 तीर फ़ंक्शन का उपयोग करने के लायक है, और कब नहीं

नमस्कार, हेब्र! मैं आपको " जब (और क्यों) लेख का अनुवाद पेश करना चाहिए, तो आपको ES6 तीर फ़ंक्शन का उपयोग करना चाहिए - और जब आपको सिंथिया ली द्वारा" नहीं करना चाहिए

एरो फ़ंक्शंस सबसे लोकप्रिय ES6 फ़ीचर हैं। यह लेखन कार्यों का एक नया, संक्षिप्त तरीका है।

function timesTwo(params) { return params * 2 } timesTwo(4); // 8 

अब एरो फंक्शन के साथ भी ऐसा ही है।

 var timesTwo = params => params * 2 timesTwo(4); // 8 

बहुत छोटा! हम घुंघराले ब्रेसिज़ और रिटर्न स्टेटमेंट को छोड़ सकते हैं (यदि कोई ब्लॉक नहीं है, लेकिन उस पर बाद में और अधिक)।

आइए जानें कि नई विधि हमेशा की तरह कैसे अलग है।

वाक्य-विन्यास


पहली बात जिस पर आप जल्दी गौर करेंगे वह है विभिन्न वाक्यविन्यास विविधताएँ। आइए मुख्य लोगों को देखें:

1. मापदंडों के बिना


यदि फ़ंक्शन में कोई पैरामीटर नहीं है, तो आप बस => से पहले खाली कोष्ठक लिख सकते हैं

 () => 42 

वास्तव में, आप सभी कोष्ठक के बिना कर सकते हैं!

 _ => 42 

1. एक पैरामीटर


कोष्ठक वैकल्पिक भी हैं

 x => 42 || (x) => 42 

3. कई मापदंडों


यहां हमें कोष्ठक की आवश्यकता है

 (x, y) => 42 

4. निर्देश


आमतौर पर, एक कार्यात्मक अभिव्यक्ति एक मूल्य देता है, जबकि एक निर्देश कार्रवाई के लिए जिम्मेदार होता है।

यह याद रखना चाहिए कि तीर के कार्यों के मामले में, यदि हमारे पास कुछ कार्य / निर्देश हैं, तो हमें घुंघराले ब्रेसिज़ और रिटर्न स्टेटमेंट का उपयोग करना चाहिए।
यहाँ एक उदाहरण एरो फंक्शन है जिसका उपयोग यदि स्टेटमेंट के साथ किया जाता है:

 var feedTheCat = (cat) => { if (cat === 'hungry') { return 'Feed the cat'; } else { return 'Do not feed the cat'; } } 

5. कवक ब्लॉक का शरीर


भले ही आपका फ़ंक्शन केवल मान लौटाता है, लेकिन इसका शरीर घुंघराले ब्रैकेट में है, रिटर्न स्टेटमेंट की आवश्यकता है।

 var addValues = (x, y) => { return x + y } 

6. वस्तु शाब्दिक


यदि फ़ंक्शन एक ऑब्जेक्ट शाब्दिक रिटर्न देता है, तो इसे कोष्ठकों में संलग्न किया जाना चाहिए।

 x =>({ y: x }) 

एरो फ़ंक्शंस - बेनामी


ध्यान दें कि तीर फ़ंक्शंस अनाम हैं; उनका कोई नाम नहीं है।

यह कुछ मुश्किलें पैदा करता है:

  1. निर्बल करना कठिन

    जब ऐसा होता है, तो आप फ़ंक्शन का नाम और पंक्ति संख्या को ट्रैक नहीं कर पाएंगे जहां त्रुटि हुई थी।
  2. एक चर को सौंपा नहीं जा सकता

    यदि आपको किसी चीज़ के लिए फ़ंक्शन के अंदर एक लिंक की आवश्यकता है (पुनरावृत्ति, एक घटना हैंडलर जिसे पूर्ववत करने की आवश्यकता है), तो कुछ भी काम नहीं करेगा

मुख्य लाभ: यह नहीं


नियमित कार्यों में, यह उस संदर्भ को इंगित करता है जिसमें यह फ़ंक्शन कहा जाता है। यह एरो फंक्शन की तरह ही है, इस एनवायरनमेंट में एरो फंक्शन घोषित किया गया है।

उदाहरण के लिए, नीचे दिए गए सेट टाइमआउट फ़ंक्शन को देखें:

 // ES5 var obj = { id: 42, counter: function counter() { setTimeout(function() { console.log(this.id); }.bind(this), 1000); } }; 

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

 // ES6 var obj = { id: 42, counter: function counter() { setTimeout(() => { console.log(this.id); }, 1000); } }; 

इस उदाहरण में, आपको इसे बांधने की आवश्यकता नहीं है। तीर फ़ंक्शन इसे बंद से ले जाएगा।

तीर कार्यों का उपयोग कब करें


अब, मुझे लगता है, यह स्पष्ट हो गया कि तीर के कार्य सामान्य लोगों की जगह नहीं लेते हैं।

यहां कुछ उदाहरण दिए गए हैं जब आप उनका उपयोग नहीं करना चाहते हैं।

1. वस्तु विधियाँ


जब आप कैट.जंप कहते हैं, तो जीवन की संख्या कम नहीं होती है। ऐसा इसलिए है क्योंकि यह कुछ भी करने के लिए बाध्य नहीं है, और बंद होने से मूल्य विरासत में मिला है।

 var cat = { lives: 9, jumps: () => { this.lives--; } } 

2. गतिशील संदर्भ के साथ कॉलबैक कार्य


यदि आपको एक गतिशील संदर्भ की आवश्यकता है, तो एक तीर फ़ंक्शन एक बुरा विकल्प है।

 var button = document.getElementById('press'); button.addEventListener('click', () => { this.classList.toggle('on'); }); 

यदि हम बटन पर क्लिक करते हैं, तो हमें एक टाइपर्र मिलता है। ऐसा इसलिए है क्योंकि यह एक बटन से बंधा हुआ नहीं है।

3. जब कोड पठनीयता बिगड़ जाती है


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

जब वास्तव में यह तीर के कार्यों का उपयोग करने लायक है


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

मैं वास्तव में सभी प्रकार के map में तीर फ़ंक्शंस का उपयोग करना और reduce करना पसंद करता हूं - कोड इस तरह से बेहतर पढ़ता है।

Source: https://habr.com/ru/post/hi413953/


All Articles