जावास्क्रिप्ट में फंक्शन एक्सप्रेशन बनाम फंक्शन डिक्लेरेशन - क्या अंतर है?

जावास्क्रिप्ट में फ़ंक्शन घोषणाओं और फ़ंक्शन अभिव्यक्तियों के बीच अंतर के बारे में जानें।

यह एक फंक्शन एक्सप्रेशन है:

// Function expression
let excuteMe = function () {
    console.log('Function Expression')
}

यह एक फ़ंक्शन घोषणा है:

// Function declaration
function excuteMe() {
    console.log('Function Declaration')
}

फंक्शन एक्सप्रेशन और डिक्लेरेशन काफी हद तक एक ही काम करते हैं। ऊपर दिए गए दोनों उदाहरणों में, आप उन्हें इस तरह executeMe() . कहेंगे और फिर वे अपने कोड ब्लॉक के अंदर जो भी कोड है उसे निष्पादित करते हैं {..} .

लेकिन फर्क इस बात से है कि वे क्या करते हैं, लेकिन कैसे उन्हें निष्पादित किया जाता है - या बल्कि, आदेश उन्हें पढ़ा और निष्पादित किया जाता है - और यह मायने रखता है।

यह फ़ंक्शन ठीक चलेगा:

// Call function declaration
executeMe()

// Function declaration
function excuteMe() {
    console.log('Function Declaration')
}

हालांकि, फ़ंक्शन नहीं होगा ठीक चला (यह एक त्रुटि फेंक देगा):

// Call function
executeMe()

// Function expression
let excuteMe = function () {
    console.log('Function Expression')
}

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

उत्थापन

जावास्क्रिप्ट में, कोड को ऊपर से नीचे तक निष्पादित किया जाता है। आम तौर पर, आप अपनी स्क्रिप्ट फ़ाइल (आदेश-वार) में इसकी घोषणा के बाद केवल एक चर का उपयोग कर सकते हैं, हालांकि, कार्य घोषणाएं किसी भी कोड को निष्पादित करने से पहले, वेब ब्राउज़र द्वारा शीर्ष पर फहराया जाता है।

उत्थापन का अर्थ है कि आपके ब्राउज़र का कोड दुभाषिया हमेशा आपके फ़ंक्शन घोषणाओं को कॉल करने से पहले (निष्पादित करने के लिए कहा गया) जानता है (पढ़ चुका है)।

तो आप कहीं भी . से अपने फ़ंक्शन घोषणा को कॉल और निष्पादित कर सकते हैं आपकी जावास्क्रिप्ट फ़ाइल में, आपकी स्क्रिप्ट फ़ाइल में फंक्शन डिक्लेरेशन के भौतिक रूप से मौजूद होने से पहले, क्रम-वार। यह फ़ंक्शन घोषणाओं को अद्वितीय बनाता है।

कार्य घोषणाएं

किसी भी कोड के चलने से पहले, आपका ब्राउज़र आपकी संपूर्ण JS स्क्रिप्ट फ़ाइल को लोड (पढ़ता है) करता है, और चूंकि फ़ंक्शन घोषणाएं निष्पादन आदेश, के शीर्ष (होस्टेड) ​​पर ले जाया जाता है, आपका कोड वास्तव में इस क्रम में दुभाषिया द्वारा निष्पादित किया जाता है:

// 1. Function declaration
function excuteMe() {
    console.log('Function Declaration')
}

// 2. Call to function declaration
executeMe()

भले ही आपका कोड आपकी स्क्रिप्ट फ़ाइल में विपरीत क्रम में भौतिक रूप से लिखा गया हो:

// Call to function declaration
executeMe()

// Function declaration
function excuteMe() {
    console.log('Function Declaration')
}

इसलिए इससे कोई फर्क नहीं पड़ता कि आप अपनी स्क्रिप्ट फ़ाइल में परिभाषित होने से पहले या बाद में कॉल को अपने फ़ंक्शन डिक्लेरेशन में भौतिक रूप से रखते हैं। दोनों दृष्टिकोण काम करेंगे क्योंकि जावास्क्रिप्ट हमेशा फ़ंक्शन लोड करता है घोषणाएं फ़ंक्शन चलाने से पहले कॉल उन समारोह घोषणाओं के लिए।

फंक्शन एक्सप्रेशन फहराते नहीं हैं

फंक्शन एक्सप्रेशन फहराया नहीं जाता है (पहले नहीं पढ़ा जाता है)। फ़ंक्शन एक्सप्रेशन केवल तभी पढ़े जाते हैं जब दुभाषिया आपकी स्क्रिप्ट फ़ाइल में कोड की उस पंक्ति तक पहुँच जाता है। इसलिए यदि आपका फ़ंक्शन एक्सप्रेशन भौतिक रूप से बाद . मौजूद है आपका फ़ंक्शन कॉल (ऑर्डर-वार) तो आपके ब्राउज़र में चलने वाला जावास्क्रिप्ट दुभाषिया इसे निष्पादित नहीं कर सकता है।

तो यह काम नहीं करेगा:

// Call function expression
executeMe()

// Function expression
let excuteMe = function () {
    console.log('Function Expression')
}

उपरोक्त कोड आपको एक त्रुटि देगा क्योंकि आप एक फ़ंक्शन चलाने का प्रयास कर रहे हैं (executeMe() ) इससे पहले कि आपके ब्राउज़र का कोड दुभाषिया आपके फ़ंक्शन एक्सप्रेशन के अस्तित्व के बारे में जानता है (पढ़ चुका है)।

कोड ऑर्डर स्वैप करें और यह काम करेगा:

// Function expression
let excuteMe = function () {
    console.log('Function Expression')
}

// Call function expression
executeMe()

कोड ऑर्डर के कारण उपरोक्त कोड काम करता है। आपका ब्राउज़र सबसे पहले आपके वेरिएबल के साथ लाइन (ऊपर से नीचे) को पढ़ेगा let executeMe जिसमें आपकी फ़ंक्शन अभिव्यक्ति शामिल है - और फिर इसे executeMe() के साथ बाद में निष्पादित करने के लिए कहा जाता है ।

आपको किसका उपयोग करना चाहिए?

महत्वपूर्ण यह नहीं है कि आप फ़ंक्शन घोषणाओं या फ़ंक्शन अभिव्यक्तियों का उपयोग करते हैं या नहीं। न तो आपका करियर बनाने वाला है और न ही तोड़ने वाला। सुसंगत होना कहीं अधिक महत्वपूर्ण है। एक शैली चुनें, और कम से कम उसी प्रोजेक्ट में उसके साथ रहें।

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

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

फ़ंक्शन घोषणाओं का उपयोग करने के लिए एक अच्छा मामला (बहस योग्य) यह है कि यदि आपके पास कुछ फ़ंक्शन हैं जो अन्य कार्यों को कॉल करते हैं, लेकिन आप भ्रमित हैं और किसी कारण से कुछ ऑर्डर भ्रम के कारण आपके फ़ंक्शन अभिव्यक्तियों को निष्पादित नहीं कर सकते हैं