𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗖𝗹𝗼𝘀𝘂𝗿𝗲𝘀 𝗘𝘅𝗽𝗹𝗮𝗶𝗻𝗲𝗱

𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 𝗖𝗹𝗼𝘀𝘂𝗿𝗲𝘀 𝗘𝘅𝗽𝗹𝗮𝗶𝗻𝗲𝗱

நீங்கள் JavaScript-இல் தினமும் closures பயன்படுத்துகிறீர்கள். நீங்கள் React hooks, event listeners மற்றும் Node.js callbacks ஆகியவற்றில் அவற்றை likely பயன்படுத்துகிறீர்கள். பல டெவலப்பர்கள் இதன் கோட்பாட்டில் (theory) சிரமப்படுகிறார்கள், ஆனால் அதன் முறையை (pattern) நீங்கள் புரிந்து கொண்டால், இந்த கருத்து மிகவும் எளிமையானது.

Closures-ஐப் புரிந்துகொள்ள, நீங்கள் lexical scope-ஐப் புரிந்துகொள்ள வேண்டும்.

Lexical scope என்பது ஒரு function அதன் சொந்த scope மற்றும் அது வரையறுக்கப்பட்ட (defined) எந்தவொரு வெளிப்படையான (outer) scope-லிருந்தும் மாறிகளை (variables) அணுக முடியும் என்பதைக் குறிக்கிறது. இது நீங்கள் குறியீட்டை (code) எங்கு எழுதுகிறீர்கள் என்பதைப் பொறுத்தது, அதை எங்கு அழைக்கிறீர்கள் (call) என்பதைப் பொறுத்தது அல்ல.

Closure என்பது ஒரு function ஆகும், அது அதன் அசல் scope இயங்கி முடிந்த பிறகும், அந்த scope-இல் இருந்த மாறிகளை நினைவில் வைத்துக்கொள்ளும்.

ஒரு function ஒரு முதுகுப்பையை (backpack) சுமந்து செல்வதாகக் கற்பனை செய்து கொள்ளுங்கள். ஒரு function உருவாக்கப்படும்போது, அதற்குத் தேவையான ஒவ்வொரு மாறியையும் அதன் சூழலில் (environment) இருந்து அந்த முதுகுப்பையில் அடைத்து வைக்கிறது. அந்த function எங்கு சென்றாலும் அந்த முதுகுப்பையைத் தன்னுடன் எடுத்துச் செல்கிறது.

நடைமுறையில் closures எவ்வாறு செயல்படுகின்றன என்பது இதோ:

• Private Variables: நீங்கள் தரவுகளை (data) வெளி உலகத்திடமிருந்து மறைத்து வைக்கலாம். ஒரு வங்கி கணக்கு உதாரணத்தில், balance என்ற மாறி (variable) தனிப்பட்டதாகவே (private) இருக்கும். deposit அல்லது withdraw போன்ற குறிப்பிட்ட முறைகள் (methods) மூலம் மட்டுமே அதை மாற்ற முடியும். இது முக்கியமான தரவுகளை நேரடியாக அணுகுவதைத் தடுக்கிறது.

• Function Factories: மற்ற functions-களை உருவாக்கும் functions-களை உங்களால் உருவாக்க முடியும். ஒரு multiplier factory, ஒரு double function அல்லது ஒரு triple function-ஐ உருவாக்க முடியும். ஒவ்வொரு புதிய function-உம் அதன் முதுகுப்பையில் தனக்கென ஒரு குறிப்பிட்ட multiplier-ஐ வைத்திருக்கும்.

• Event Listeners: ஒரு button-இல் click event-ஐ இணைக்கும்போது, handler அந்த setup function-லிருந்து பெறப்பட்ட தரவுகளை நினைவில் வைத்திருக்கும். Setup function முடிந்த பிறகும், listener அந்தத் தரவுகளைத் தக்கவைத்துக் கொள்கிறது.

• React Hooks: நீங்கள் ஒவ்வொரு முறையும் useState அல்லது useEffect பயன்படுத்தும்போதும், closures-ஐப் பயன்படுத்துகிறீர்கள். React-இல் ஒரு பொதுவான பிழை (bug), ஒரு closure state-இன் பழைய மதிப்பை (old value) பிடிக்கும்போது ஏற்படுகிறது. இது stale closure என்று அழைக்கப்படுகிறது.

நினைவகப் பயன்பாட்டைக் (memory usage) கவனியுங்கள். ஒரு closure மாறிகளுக்கு நேரடித் தொடர்பை (live reference) வைத்திருப்பதால், closure இருக்கும் வரை engine அவற்றை garbage collection மூலம் நீக்க முடியாது. உங்களுக்கு நீண்ட நேரம் தேவைப்படாது என்றால், ஒரு closure-இல் பெரிய அளவிலான objects-களை வைத்திருப்பதைத் தவிர்க்கவும்.

சுருக்கம்:

• Lexical scope அணுகலைத் தீர்மானிக்கிறது.
• Closures அந்த அணுகலைத் தொடர்ச்சியானதாக (persistent) மாற்றுகின்றன.
• ஒரு function அதன் சூழலை ஒரு முதுகுப்பையில் சுமந்து செல்கிறது.
• Scoping பிழைகளைத் தவிர்க்க loops-களில் var-க்கு பதிலாக let-ஐப் பயன்படுத்தவும்.

ஆதாரம்: https://dev.to/digitalunicon/javascript-closures-explained-with-examples-339f