DEV Community

Cover image for JavaScript Execution Context সম্পর্কে বিস্তারিত আলোচনা
RSM Academy BD
RSM Academy BD

Posted on

JavaScript Execution Context সম্পর্কে বিস্তারিত আলোচনা

JavaScript Execution Context একটি গুরুত্বপূর্ণ ধারণা যা প্রোগ্রাম চলাকালীন সময়ে কিভাবে কোড ব্যাখ্যা এবং এক্সিকিউট করা হয় তা বোঝায়। প্রতিটি ফাংশন কল বা কোডের একটি ব্লক চালানোর সময় একটি execution context তৈরি হয়, যা কোড চলাকালীন সময়ে সমস্ত ভেরিয়েবল, অবজেক্ট, এবং ফাংশনগুলোর স্কোপকে নিয়ন্ত্রণ করে।

Execution Context কী?

Execution Context হল একটি পরিবেশ যা JavaScript কোডের execution (কার্যকরকরণ) সময় তৈরি হয়। এটি একটি container এর মতো কাজ করে যা specific ফাংশনের ভেরিয়েবল, অবজেক্ট এবং ফাংশনের তথ্যগুলো সংরক্ষণ করে। মূলত, Execution Context জাভাস্ক্রিপ্ট ইঞ্জিনকে বলে দেয় কোন ভেরিয়েবল এবং ফাংশনগুলো কোথায় পাওয়া যাবে এবং সেগুলো কীভাবে কার্যকর করতে হবে।

Execution Context এর প্রকারভেদ

Execution Context প্রধানত তিন প্রকারের হতে পারে:

  1. Global Execution Context (GEC): যখন কোনো স্ক্রিপ্ট প্রথমবার চালু হয়, তখন একটি global execution context তৈরি হয়। এটি শুধুমাত্র একবার তৈরি হয় এবং এতে global object (যেমন ব্রাউজারে window) এবং this binding অন্তর্ভুক্ত থাকে। GEC শেষ হয় না যতক্ষণ না পুরো স্ক্রিপ্ট execute শেষ হয়।
  2. Function Execution Context (FEC): প্রতিবার যখন একটি ফাংশন কল করা হয়, তখন একটি নতুন execution context তৈরি হয়। প্রতিটি ফাংশনের নিজস্ব execution context থাকে, যা তাদের নিজস্ব scope, variables এবং this binding নিয়ে থাকে।
  3. Eval Execution Context: যখন eval() ফাংশনটি ব্যবহৃত হয় তখন একটি নতুন execution context তৈরি হয়। যদিও eval() ব্যবহার করা সাধারণত নিরুৎসাহিত করা হয় কারণ এটি কোড পড়ার এবং নিরাপত্তার জন্য সমস্যা সৃষ্টি করতে পারে।

Execution Context এর Components:

Execution Context সাধারণত তিনটি প্রধান অংশ নিয়ে গঠিত:

  1. Variable Object (VO) / Lexical Environment: সমস্ত ভেরিয়েবল, ফাংশন ডিক্লারেশন এবং ফাংশন আর্গুমেন্টগুলোকে সংরক্ষণ করে।
console.log(a); // Output: undefined
var a = 5;

function myFunction() {
    console.log(b); // Output: undefined
    var b = 10;
}
myFunction();
Enter fullscreen mode Exit fullscreen mode
  1. Scope Chain: Scope Chain হলো একটি চেইন যা বর্তমান execution context থেকে শুরু করে তার পূর্ববর্তী context পর্যন্ত সমস্ত ভেরিয়েবল এবং ফাংশনগুলিকে অ্যাক্সেসযোগ্য করে। এটি নির্ধারণ করে কোন ভেরিয়েবলগুলি কোথায় পাওয়া যাবে।।
var globalVar = "I'm Global";

function outerFunction() {
    var outerVar = "I'm in outer function";

    function innerFunction() {
        var innerVar = "I'm in inner function";
        console.log(globalVar); // "I'm Global"
        console.log(outerVar);  // "I'm in outer function"
    }

    innerFunction();
}

outerFunction();

Enter fullscreen mode Exit fullscreen mode
  1. this Keyword Binding: this হল একটি বিশেষ keyword, যা Execution Context অনুযায়ী পরিবর্তিত হয়। Global Execution Context এ this global অবজেক্টকে নির্দেশ করে, আর Function Execution Context এ এটি নির্ভর করে ফাংশনটি কীভাবে কল করা হয়েছে তার উপর।
console.log(this); // Global context, refers to `window` in browsers.

var myObject = {
    name: "JavaScript",
    sayName: function() {
        console.log(this.name); // `this` refers to `myObject`.
    }
};

myObject.sayName(); // Output: "JavaScript"

function MyConstructor() {
    this.prop = "Property";
}

var obj = new MyConstructor();
console.log(obj.prop); // Output: "Property"
Enter fullscreen mode Exit fullscreen mode

Execution Context Lifecycle:

Execution Context এর lifecycle তিনটি ধাপে বিভক্ত:

  1. Creation Phase: এই ধাপে Execution Context তৈরি হয় এবং Scope Chain, Variable Object এবং this এর মতো সমস্ত গুরুত্বপূর্ণ components তৈরি এবং initialized হয়।
  2. Execution Phase: এই ধাপে কোড execute করা হয়, অর্থাৎ, ভেরিয়েবলগুলোকে মান অ্যাসাইন করা হয় এবং ফাংশনগুলো execute করা হয়।
  3. Garbage Collection: Execution Context এর শেষের দিকে, যদি এটি আর দরকার না হয়, তাহলে এটি মেমরি থেকে অপসারণ করা হয় এবং সংশ্লিষ্ট resources গুলো মুক্তি পায়।

Image description

Conclusion

Execution Context জাভাস্ক্রিপ্টের মূল ভিত্তি যা ঠিক করে কোড কীভাবে কার্যকর হবে। এটি ভেরিয়েবল, ফাংশন, এবং স্কোপের সঠিক ব্যবস্থাপনা করে। Execution Context এর সঠিক বোঝাপড়া থাকলে, জাভাস্ক্রিপ্ট কোডের কার্যকারিতা এবং কার্যনির্বাহী ধাপগুলোকে ভালোভাবে বুঝতে এবং পরিচালনা করতে সহায়তা করে।

SurveyJS custom survey software

Build Your Own Forms without Manual Coding

SurveyJS UI libraries let you build a JSON-based form management system that integrates with any backend, giving you full control over your data with no user limits. Includes support for custom question types, skip logic, an integrated CSS editor, PDF export, real-time analytics, and more.

Learn more

Top comments (0)

Cloudinary image

Video API: manage, encode, and optimize for any device, channel or network condition. Deliver branded video experiences in minutes and get deep engagement insights.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay