इस ट्यूटोरियल में, आप उदाहरणों की मदद से जावास्क्रिप्ट एरो फंक्शन के बारे में जानेंगे।
एरो फ़ंक्शन जावास्क्रिप्ट के ईएस 6 संस्करण में पेश की गई विशेषताओं में से एक है। यह आपको नियमित कार्यों की तुलना में क्लीनर तरीके से कार्य बनाने की अनुमति देता है। उदाहरण के लिए,
यह फ़ंक्शन
// function expression let x = function(x, y) ( return x * y; )
के रूप में लिखा जा सकता है
// using arrow functions let x = (x, y) => x * y;
एक तीर समारोह का उपयोग कर।
एरो फंक्शन सिंटेक्स
तीर फ़ंक्शन का सिंटैक्स है:
let myFunction = (arg1, arg2,… argN) => ( statement(s) )
यहाँ,
myFunctionफ़ंक्शन का नाम हैarg1, arg2,… argNफ़ंक्शन तर्क हैंstatement(s)फ़ंक्शन बॉडी है
यदि शरीर में एकल कथन या अभिव्यक्ति है, तो आप तीर फ़ंक्शन को इस प्रकार लिख सकते हैं:
let myFunction = (arg1, arg2,… argN) => expression
उदाहरण 1: एरो फंक्शन विथ नो अरगमेंट
यदि कोई फ़ंक्शन कोई तर्क नहीं लेता है, तो आपको खाली कोष्ठक का उपयोग करना चाहिए। उदाहरण के लिए,
let greet = () => console.log('Hello'); greet(); // Hello
उदाहरण 2: एरो फंक्शन विथ वन एर्ग्यूमेंट
यदि किसी फ़ंक्शन में केवल एक तर्क है, तो आप कोष्ठकों को छोड़ सकते हैं। उदाहरण के लिए,
let greet = x => console.log(x); greet('Hello'); // Hello
उदाहरण 3: एक अभिव्यक्ति के रूप में एरो फंक्शन
आप गतिशील रूप से एक फ़ंक्शन भी बना सकते हैं और इसे अभिव्यक्ति के रूप में उपयोग कर सकते हैं। उदाहरण के लिए,
let age = 5; let welcome = (age console.log('Baby') : () => console.log('Adult'); welcome(); // Baby
उदाहरण 4: मल्टीलाइन एरो फ़ंक्शंस
यदि एक फ़ंक्शन बॉडी में कई स्टेटमेंट हैं, तो आपको उन्हें घुंघराले ब्रैकेट के अंदर रखना होगा ()। उदाहरण के लिए,
let sum = (a, b) => ( let result = a + b; return result; ) let result1 = sum(5,7); console.log(result1); // 12
एरो फंक्शन के साथ यह
एक नियमित फ़ंक्शन के अंदर, यह कीवर्ड उस फ़ंक्शन को संदर्भित करता है जहां इसे कहा जाता है।
हालांकि, thisतीर के कार्यों से जुड़ा नहीं है। एरो फंक्शन का अपना नहीं होता है this। इसलिए जब भी आप कॉल करते हैं this, तो यह उसके मूल दायरे को संदर्भित करता है। उदाहरण के लिए,
एक नियमित कार्य के अंदर
function Person() ( this.name = 'Jack', this.age = 25, this.sayName = function () ( // this is accessible console.log(this.age); function innerFunc() ( // this refers to the global object console.log(this.age); console.log(this); ) innerFunc(); ) ) let x = new Person(); x.sayName();
आउटपुट
25 अपरिभाषित विंडो ()
यहाँ, this.ageअंदर this.sayName()पहुँच योग्य है क्योंकि this.sayName()एक वस्तु की विधि है।
हालाँकि, innerFunc()एक सामान्य कार्य है और this.ageयह सुलभ नहीं है क्योंकि thisयह वैश्विक ऑब्जेक्ट (ब्राउज़र में विंडो ऑब्जेक्ट) को संदर्भित करता है। इसलिए, this.ageअंदर innerFunc()समारोह देता है undefined।
एक तीर समारोह के अंदर
function Person() ( this.name = 'Jack', this.age = 25, this.sayName = function () ( console.log(this.age); let innerFunc = () => ( console.log(this.age); ) innerFunc(); ) ) const x = new Person(); x.sayName();
आउटपुट
२५ २५
यहां, innerFunc()फ़ंक्शन को एरो फ़ंक्शन का उपयोग करके परिभाषित किया गया है। और तीर फ़ंक्शन के अंदर, thisमाता-पिता के दायरे को संदर्भित करता है। इसलिए, 25this.age देता है ।
तर्क बाँधना
नियमित कार्यों में तर्क बाध्यकारी हैं। इसीलिए जब आप एक नियमित फ़ंक्शन के लिए तर्क पास करते हैं, तो आप उन्हें argumentsकीवर्ड का उपयोग करके एक्सेस कर सकते हैं । उदाहरण के लिए,
let x = function () ( console.log(arguments); ) x(4,6,7); // Arguments (4, 6, 7)
एरो फ़ंक्शंस में तर्क बाध्यकारी नहीं हैं।
जब आप एरो फ़ंक्शन का उपयोग करके किसी तर्क तक पहुंचने का प्रयास करते हैं, तो यह एक त्रुटि देगा। उदाहरण के लिए,
let x = () => ( console.log(arguments); ) x(4,6,7); // ReferenceError: Can't find variable: arguments
इस समस्या को हल करने के लिए, आप प्रसार सिंटैक्स का उपयोग कर सकते हैं। उदाहरण के लिए,
let x = (… n) => ( console.log(n); ) x(4,6,7); // (4, 6, 7)
एम्स और वादों के साथ एरो फंक्शन
एरो फ़ंक्शंस वादे और कॉलबैक लिखने के लिए बेहतर सिंटैक्स प्रदान करते हैं। उदाहरण के लिए,
// ES5 asyncFunction().then(function() ( return asyncFunction1(); )).then(function() ( return asyncFunction2(); )).then(function() ( finish; ));
के रूप में लिखा जा सकता है
// ES6 asyncFunction() .then(() => asyncFunction1()) .then(() => asyncFunction2()) .then(() => finish);
एरो फंक्शन्स से आपको बचना चाहिए
1. आपको ऑब्जेक्ट के अंदर तरीके बनाने के लिए एरो फ़ंक्शंस का उपयोग नहीं करना चाहिए।
let person = ( name: 'Jack', age: 25, sayName: () => ( // this refers to the global… // console.log(this.age); ) ) person.sayName(); // undefined
2. आप एक कंस्ट्रक्टर के रूप में एरो फंक्शन का उपयोग नहीं कर सकते । उदाहरण के लिए,
let Foo = () => (); let foo = new Foo(); // TypeError: Foo is not a constructor
नोट : तीर कार्यों को ES6 में पेश किया गया था । कुछ ब्राउज़र तीर फ़ंक्शंस के उपयोग का समर्थन नहीं कर सकते हैं। अधिक जानने के लिए जावास्क्रिप्ट ऐरो फंक्शन सपोर्ट पर जाएँ।
