ஜாவாஸ்கிரிப்டில் எக்ஸிகியூசன் கான்டெக்ஸ்ட் (Execution Context)

ஜாவாஸ்கிரிப்டில், எக்ஸிகியூசன் கான்டெக்ஸ்ட் என்பது குறியீடு மதிப்பிடப்பட்டு செயல்படுத்தப்படும் ஒரு சூழலாகும் (environment). இது மாறிகள் (variables) மற்றும் செயல்பாடுகளின் (functions) நோக்கம் (scope) மற்றும் நடத்தையை நிர்வகிக்க உதவும் ஒரு அடிப்படைக் கருத்தாகும்.

எக்ஸிகியூசன் கான்டெக்ஸ்ட்-இன் வகைகள் (Types of Execution Context)

ஜாவாஸ்கிரிப்டில் மூன்று முக்கிய வகையான எக்ஸிகியூசன் கான்டெக்ஸ்ட்-கள் உள்ளன:

1. Global Execution Context (குளோபல் எக்ஸிகியூசன் கான்டெக்ஸ்ட்): இது குறியீடு செயல்படுத்தத் தொடங்கும் இயல்புநிலை சூழலாகும். இது குளோபல் பொருளை (global object) (எ.கா., உலாவிகளில் window) உருவாக்கி குளோபல் நோக்கத்தை (global scope) அமைக்கிறது.
2. Function Execution Context (ஃபங்ஷன் எக்ஸிகியூசன் கான்டெக்ஸ்ட்): ஒரு செயல்பாடு அழைக்கப்படும்போதெல்லாம் இது உருவாக்கப்படும். ஒவ்வொரு செயல்பாட்டிற்கும் அதன் சொந்த எக்ஸிகியூசன் கான்டெக்ஸ்ட் உள்ளது.
3. Eval Execution Context (Eval எக்ஸிகியூசன் கான்டெக்ஸ்ட்): eval செயல்பாட்டின் உள்ளே குறியீடு செயல்படுத்தப்படும்போது இது உருவாக்கப்படுகிறது.

எக்ஸிகியூசன் கான்டெக்ஸ்ட்-இன் கட்டங்கள் (Phases of Execution Context)

ஒவ்வொரு எக்ஸிகியூசன் கான்டெக்ஸ்ட்-உம் இரண்டு கட்டங்கள் வழியாகச் செல்கிறது:

1. உருவாக்கும் கட்டம் (Creation Phase): இந்தக் கட்டத்தில், ஜாவாஸ்கிரிப்ட் இயந்திரம் குறியீட்டைச் செயல்படுத்துவதற்கான சூழலை அமைக்கிறது. இது பின்வருவனவற்றை உள்ளடக்குகிறது:

   • this பிணைப்பை (binding) உருவாக்குதல்.
   • நோக்கம் சங்கிலியை (scope chain) அமைத்தல்.
   • மாறி பொருளை (variable object) உருவாக்குதல் (மாறிகள், செயல்பாடுகள் மற்றும் வாதங்கள்).

2. செயல்படுத்தும் கட்டம் (Execution Phase): இந்தக் கட்டத்தில், ஜாவாஸ்கிரிப்ட் இயந்திரம் குறியீட்டை வரியாகச் செயல்படுத்துகிறது.

எக்ஸிகியூசன் கான்டெக்ஸ்ட்-க்கு ஒரு எடுத்துக்காட்டு

எக்ஸிகியூசன் கான்டெக்ஸ்ட்-கள் எவ்வாறு செயல்படுகின்றன என்பதை விளக்குவதற்கான ஒரு எடுத்துக்காட்டு இங்கே:

var globalVar = "நான் ஒரு குளோபல் மாறி (global variable)";

function outerFunction() {
    var outerVar = "நான் ஒரு வெளிப்புற மாறி (outer variable)";

    function innerFunction() {
        var innerVar = "நான் ஒரு உட்புற மாறி (inner variable)";
        console.log(globalVar); // குளோபல் மாறியை அணுகுகிறது
        console.log(outerVar);  // வெளிப்புற மாறியை அணுகுகிறது
        console.log(innerVar);  // உட்புற மாறியை அணுகுகிறது
    }

    innerFunction();
}

outerFunction();

வெளியீடு:

நான் ஒரு குளோபல் மாறி (global variable)
நான் ஒரு வெளிப்புற மாறி (outer variable)
நான் ஒரு உட்புற மாறி (inner variable)

விளக்கம்

1. Global Execution Context:

   • globalVar உருவாக்கப்பட்டு "நான் ஒரு குளோபல் மாறி" என்ற மதிப்பு ஒதுக்கப்படுகிறது.
   • outerFunction உருவாக்கப்பட்டு நினைவகத்தில் (memory) சேமிக்கப்படுகிறது.

2. Function Execution Context (outerFunction):

   • outerVar உருவாக்கப்பட்டு "நான் ஒரு வெளிப்புற மாறி" என்ற மதிப்பு ஒதுக்கப்படுகிறது.
   • innerFunction உருவாக்கப்பட்டு நினைவகத்தில் சேமிக்கப்படுகிறது.

3. Function Execution Context (innerFunction):

   • innerVar உருவாக்கப்பட்டு "நான் ஒரு உட்புற மாறி" என்ற மதிப்பு ஒதுக்கப்படுகிறது.
   • console.log அறிக்கைகள் அந்தந்த நோக்கங்களிலிருந்து மாறிகளை அணுகுகின்றன.

நோக்கம் சங்கிலி மற்றும் லெக்சிக்கல் சூழல் (Scope Chain and Lexical Environment)

நோக்கம் சங்கிலி (scope chain) என்பது தற்போது செயல்படுத்தும் குறியீடு அணுகக்கூடிய அனைத்து மாறி பொருட்களின் பட்டியலாகும். லெக்சிக்கல் சூழல் (lexical environment) என்பது குறியீடு எழுதப்பட்ட சூழலாகும், மேலும் இது நோக்கம் சங்கிலியைத் தீர்மானிக்கிறது.

நோக்கம் சங்கிலிக்கு ஒரு எடுத்துக்காட்டு

var a = 10;

function foo() {
    var b = 20;

    function bar() {
        var c = 30;
        console.log(a + b + c); // அனைத்து நோக்கங்களிலிருந்தும் (scopes) மாறிகளை அணுகுகிறது
    }

    bar();
}

foo();

வெளியீடு:

60

விளக்கம்

1. Global Scope: a ஐக் கொண்டுள்ளது.
2. Function Scope (foo): b ஐக் கொண்டுள்ளது மற்றும் a ஐ அணுக முடியும்.
3. Function Scope (bar): c ஐக் கொண்டுள்ளது மற்றும் a மற்றும் b ஐ அணுக முடியும்.

ஹாய்ஸ்டிங் (Hoisting)

ஹாய்ஸ்டிங் என்பது ஜாவாஸ்கிரிப்ட்டில் உள்ள ஒரு நடத்தையாகும், அங்கு மாறி மற்றும் செயல்பாட்டு அறிவிப்புகள் உருவாக்கும் கட்டத்தில் (creation phase) அவற்றைக் கொண்டிருக்கும் நோக்கத்தின் மேற்பகுதிக்கு நகர்த்தப்படுகின்றன.

ஹாய்ஸ்டிங்கிற்கு ஒரு எடுத்துக்காட்டு

console.log(hoistedVar); // வெளியீடு: undefined
var hoistedVar = "நான் ஹாய்ஸ்ட் செய்யப்பட்டேன் (hoisted)";

hoistedFunction(); // வெளியீடு: நான் ஒரு ஹாய்ஸ்ட் செய்யப்பட்ட செயல்பாடு
function hoistedFunction() {
    console.log("நான் ஒரு ஹாய்ஸ்ட் செய்யப்பட்ட செயல்பாடு");
}

விளக்கம்

• hoistedVar அறிவிக்கப்பட்டுள்ளது, ஆனால் உருவாக்கும் கட்டத்தில் துவக்கப்படவில்லை (initialized), எனவே அதை அணுகும்போது undefined ஆக இருக்கும்.
• hoistedFunction முழுமையாக ஹாய்ஸ்ட் செய்யப்பட்டுள்ளது, மேலும் அதை அறிவிப்பதற்கு முன்பே அழைக்கலாம்.