DEV Community

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

Posted on

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

JavaScript-এর Closures একটি গুরুত্বপূর্ণ এবং শক্তিশালী বৈশিষ্ট্য যা JavaScript প্রোগ্রামিং ভাষার বিভিন্ন কার্যকরীতা এবং প্যাটার্ন বুঝতে সহায়তা করে। Closures নিয়ে বিস্তারিত আলোচনা করতে গেলে scope এবং lexical environment (যেখানে ফাংশনটি ডিক্লেয়ার করা হয়) কনসেপ্টের সম্পর্কে জানা প্রয়োজন।

  • নিচে এগুলো সম্পর্কে আলোচনা করা হলোঃ-

1. Scope:- Scope হলো একটি নির্দিষ্ট ক্ষেত্র বা পরিবেশ যেখানে কোন ভেরিয়েবল, ফাংশন বা অবজেক্ট অ্যাক্সেস করা যায়। JavaScript-এ দুটি প্রধান ধরনের scope আছে:-

  • Global Scope: এটি হলো ডিফল্ট স্কোপ যেখানে কোনো ভেরিয়েবল বা ফাংশন পুরো স্ক্রিপ্ট জুড়ে অ্যাক্সেস করা যায়।
var myGlobalVar = "This is global!";

function printSomething() {
  console.log(myGlobalVar);
}

printSomething(); // Output: This is global!
Enter fullscreen mode Exit fullscreen mode
  • Local/Function Scope: এটি কোনো নির্দিষ্ট ফাংশন বা ব্লকের ভিতরে থাকা ভেরিয়েবল বা ফাংশন অ্যাক্সেসের জন্য ব্যবহৃত হয়।
function printSomething() {
  var myLocalVar = "I'm local!";
  console.log(myLocalVar);
}

printSomething(); // Output: I'm local!

// Not allowed
console.log(myLocalVar); // Output: Uncaught ReferenceError: myLocalVar is not defined
Enter fullscreen mode Exit fullscreen mode

💡 Closures মূলত Local/Function Scope এর সাথে সম্পর্কিত। Local/Function Scope একটি ফাংশনের মধ্যে ভেরিয়েবলগুলির অ্যাক্সেসযোগ্যতা নির্দেশ করে, যেখানে global scope পুরো স্ক্রিপ্ট জুড়ে ভেরিয়েবলগুলির অ্যাক্সেসের কথা বলে।

2. Lexical Environment:- Lexical Environment হলো একটি অবজেক্ট যা বর্তমান execution context-এর সকল ভেরিয়েবল ও ফাংশন রেফারেন্স ধারণ করে। প্রতিটি ফাংশন execution-এর সময় তার নিজস্ব lexical environment তৈরি করে।

Image description

Closures কীভাবে কাজ করে?

যখন একটি ফাংশন ডিফাইন করা হয়, তখন সেই ফাংশনটি একটি ক্লোজার তৈরি করে। এই ক্লোজারের মধ্যে ফাংশনের কোড এবং সেই ফাংশনের লেক্সিক্যাল স্কোপের মধ্যে থাকা ভেরিয়েবল বা ফাংশন থাকে। যখন ফাংশনটি কল করা হয়, তখন ক্লোজারটি একটি নতুন এক্সিকিউশন কনটেক্সট তৈরি করে এবং সেই কনটেক্সটের মধ্যে ভেরিয়েবল এবং ফাংশনগুলো অ্যাক্সেস করা যায়

  • এখন একটি উদাহরণের মাধ্যমে Closure কীভাবে কাজ করে তা ব্যাখ্যা করা যাক:
function outerFunction() {
    let outerVariable = 'I am from outer function';

    function innerFunction() {
        console.log(outerVariable); // এখানে outerVariable-কে access করছে
    }

    return innerFunction;
}

const closureFunc = outerFunction();
closureFunc(); // Output: I am from outer function
Enter fullscreen mode Exit fullscreen mode

ব্যাখ্যা:

  • এখানে outerFunction একটি ভেরিয়েবল outerVariable ডিক্লেয়ার করেছে এবং একটি innerFunction রিটার্ন করছে।
  • innerFunctionএর মধ্যে outerVariableকে এক্সেস করা হচ্ছে, যদিও innerFunction নিজে কোনো outerVariable ডিক্লেয়ার করে নাই।
  • যখন closureFunc চালানো হয়, তখন outerVariable প্রিন্ট হবে, যদিও outerFunction ইতিমধ্যে execute হয়ে শেষ হয়ে গেছে। এটি সম্ভব হয়েছে closure-এর কারণে, যা outerFunctionএর lexical environment ধরে রেখেছে।

Closures-এর ব্যবহার:

  1. Data Privacy/Encapsulation:- Closures প্রাইভেট ডেটা তৈরি করতে পারে যা শুধুমাত্র নির্দিষ্ট ফাংশনের মাধ্যমে অ্যাক্সেস করা যায়।
function counter() {
    let count = 0;
    return function() {
        count++;
        return count;
    };
}

const myCounter = counter();
console.log(myCounter()); // Output: 1
console.log(myCounter()); // Output: 2
console.log(myCounter()); // Output: 3
Enter fullscreen mode Exit fullscreen mode
  1. Function Currying:- একটি ফাংশন যে অন্য ফাংশনকে তার আর্গুমেন্ট হিসেবে গ্রহণ করে এবং একটি নতুন ফাংশন রিটার্ন করে, সেটি কারিং বলে।
function multiply(a) {
    return function(b) {
        return a * b;
    };
}

const multiplyBy2 = multiply(2);
console.log(multiplyBy2(5)); // Output: 10
Enter fullscreen mode Exit fullscreen mode
  1. Asynchronous Handling Operations:- Closures প্রায়ই asynchronous callback ফাংশনের ক্ষেত্রে ব্যবহৃত হয়, যেমন setTimeout বা event listeners.
function asyncFunction() {
    let message = 'Hello, World!';

    setTimeout(function() {
        console.log(message);
    }, 1000);
}

asyncFunction(); // Output: Hello, World! (1 সেকেন্ড পরে)
Enter fullscreen mode Exit fullscreen mode

Closures-এর সুবিধা:

  • ডেটা প্রাইভেসি: Closures sensitive ডেটা encapsulate করতে পারে এবং সেই ডেটা বাইরের জগতে অ্যাক্সেস থেকে নিরাপদ রাখে।
  • মেমরি ইফিশিয়েন্সি: একটি ফাংশন তার lexical scope ধরে রাখে, তাই closure যথাযথভাবে ব্যবহৃত হলে এটি মেমরি ইফিশিয়েন্ট হয়।

Closures-এর অসুবিধা:

  • মেমরি লিক: যদি Closures অনুপযুক্তভাবে ব্যবহৃত হয়, তাহলে এটি মেমরি লিকের কারণ হতে পারে, কারণ এটি প্রয়োজনের চেয়ে বেশি ডেটা ধরে রাখতে পারে।
  • ডিবাগিং সমস্যা: Closures জটিল হতে পারে এবং ডিবাগিং কঠিন হয়ে যায়, কারণ যখন আপনি বিভিন্ন ভেরিয়েবলের ভ্যালু ট্র্যাক করেন, তখন সেগুলি কোথায় সংরক্ষিত আছে তা স্পষ্ট নাও হতে পারে।

JavaScript-এ Closures একটি মৌলিক ও শক্তিশালী কনসেপ্ট যা আপনাকে অনেক উন্নত ও কার্যকরী কোড লিখতে সহায়তা করবে।

SurveyJS custom survey software

JavaScript UI Libraries for Surveys and Forms

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

Learn more

Top comments (0)

Cloudinary image

Zoom pan, gen fill, restore, overlay, upscale, crop, resize...

Chain advanced transformations through a set of image and video APIs while optimizing assets by 90%.

Explore

👋 Kindness is contagious

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

Okay