[javascript] जावास्क्रिप्ट में एकाधिक तीर कार्यों का क्या अर्थ है?


Answers

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

जब एक तीर फ़ंक्शन बिना किसी पैरामीटर के या बिना ब्लॉक ब्रेसिज़ के लिखा जाता है, तो फ़ंक्शन के शरीर का गठन करने वाली अभिव्यक्ति पूरी तरह से लौटा दी जाती है। आपके उदाहरण में, अभिव्यक्ति एक और तीर कार्य है।

No arrow funcs              Implicitly return `e=>{…}`    Explicitly return `e=>{…}` 
---------------------------------------------------------------------------------
function (field) {         |  field => e => {            |  field => {
  return function (e) {    |                             |    return e => {
      e.preventDefault()   |    e.preventDefault()       |      e.preventDefault()
  }                        |                             |    }
}                          |  }                          |  }

तीर सिंटैक्स का उपयोग करके अज्ञात कार्यों को लिखने का एक अन्य लाभ यह है कि वे उस क्षेत्र के लिए लंबवत हैं जो उन्हें परिभाषित किया गया है। एमडीएन पर 'तीर फ़ंक्शंस' से :

एक तीर फ़ंक्शन अभिव्यक्ति में फ़ंक्शन एक्सप्रेशन की तुलना में एक छोटा वाक्यविन्यास होता है और this मान को लंबवत रूप से बांधता है। तीर कार्य हमेशा anonymous होते हैं।

यह आपके उदाहरण में विशेष रूप से प्रासंगिक है क्योंकि यह एक reactjs अनुप्रयोग से लिया जाता है। जैसा कि @ नोमिक द्वारा इंगित किया गया है, वास्तव में आप अक्सर इसका उपयोग करके किसी घटक के सदस्य फ़ंक्शंस तक पहुंच सकते हैं। उदाहरण के लिए:

Unbound                     Explicitly bound            Implicitly bound 
------------------------------------------------------------------------------
function (field) {         |  function (field) {       |  field => e => {
  return function (e) {    |    return function (e) {  |    
      this.setState(...)   |      this.setState(...)   |    this.setState(...)
  }                        |    }.bind(this)           |    
}                          |  }.bind(this)             |  }
Question

मैं react कोड का एक गुच्छा पढ़ रहा हूं और मुझे इस तरह की चीजें दिखाई देती हैं जिन्हें मैं समझ नहीं पा रहा हूं:

handleChange = field => e => {
  e.preventDefault();
  /// Do something here
}



एक सामान्य युक्ति, यदि आप किसी भी नए जेएस सिंटैक्स द्वारा भ्रमित हो जाते हैं और यह कैसे संकलित होगा, तो आप babel जांच कर सकते हैं। उदाहरण के लिए बेबेल में अपना कोड कॉपी करना और es2015 प्रीसेट का चयन करना इस तरह का आउटपुट देगा

handleChange = function handleChange(field) {
 return function (e) {
 e.preventDefault();
  // Do something here
   };
 };






Related