স্কোপ(Scope) এন্ড লেক্সিক্যাল স্কোপ(Lexical Scope) ইন জাভাস্ক্রিপ্ট

শুক্রবার, ২৫ জুন ২০২১, রাত ২:০৭ সময়

স্কোপিং(Scoping) জাভাস্ক্রিপ্টে একটি গুরুত্বপূর্ন কনসেপ্ট । সোজা সাপ্টায় স্কোপ বলতে দুনিয়া বা এরিয়াকে বোঝায় ।

অর্থাৎ, আমরা কোন ভ্যারিয়েবল বা ফাংশন কোথা থেকে এক্সেস করতে পারবো আর কোথা থেকে পারবো না সেইটাই মুলত স্কোপ । জাভাস্ক্রিপ্টে ২ ধরনের স্কোপ রয়েছে :-

১। লোকাল(Local) স্কোপ

২। গ্লোবাল(Global) স্কোপ

লোকাল এবং গ্লোবাল স্কোপ সমন্ধে আলোচনার আগে চলুন একটা গল্প পড়া যাক ।

আমি আর বন্ধু রায়হান দুই জন দুই পাড়ায় বা স্কোপে থাকি । তো হইলো টা কি, একদিন বিকেলে পুকুর পাড়ে আড্ডা দেওয়ার সময় সুন্দরি একটা মেয়ে আমাদের পাশে দিয়ে যাইতেছিল । লও ঠেলা তারপর থেকেই আমাদের মাঝে মেয়েটাকে নিয়ে শুরু হইলো অস্থির কাড়াকাড়ি। এক পর্যায়ে আমি রায়হানকে বললাম আমার পাড়ায় যাস তোর ঠ্যাং ভেঙ্গে দিবো, রায়হানও আমাকে তাই বললো । তারপর না আমি পারি রায়হানের পাড়ায় যাইতে না রায়হান পারে আমার পাড়ায় আসতে । এইদিকে মেয়েটা হইলো পুরো গ্রামের যুবক মাতবর ফাহিম মোরশেদের চাচাত বোন ও প্রেমিকা। কোনো কারণে, ফাহিম মোরশেদ আমাদের কথা জানতে পারলো যে আমরা দুই বন্ধু তার সুইটির দিকে তাকাইছি । পুরো গ্রামের মাতবর হওয়ায় আমাদের পাড়ায় এসে আমাদেরকে নন-স্টপ থাক বলবো নাহ ।

আমি আর রায়হান দুইজন দুই পাড়ার লোকাল হওয়ায় কেউ কারো পাড়ায় বা গ্লোবালেও যাইতে পারি নাহ, কিন্তু নিজেদের লোকাল পাড়ায় বা স্কোপে যেখানে ইচ্ছে সেখানে যাইতে, গাইতে ইত্যাদি করতে পারি। কিন্তু, যদি অন্য পাড়ায় বা গ্লোবালে যাওয়ার চেষ্টা করি তাহলে আমরা যে শক্তি-হীন তা প্রকাশ পায়। এইদিকে, ফাহিম মোরশেদ পুরো গ্রামের মাতবর অর্থাৎ গ্লোবাল হওয়ায় আমাদের পাড়াসহ পুরো গ্রামে আসতে, বসতে ইত্যাদি করতে পারে ।

উপরের ফালতু গল্পটা আরেকবার পড়ুন, তাহলে লোকাল এবং গ্লোবাল স্কোপ সমন্ধে একটা আইডিয়া চলে আসবে ।

১। লোকাল(Local) স্কোপ:-

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

function localArea(){
    var Name = 'Shakil Babu';
    console.log(Name);
}

localArea();

// Output = Shakil Babu

localArea নামে একটা ফাংশনের ভেতরে Name নামে একটা ভ্যারিয়েবল নেওয়া হয়েছে যা একটি লোকাল ভ্যারিয়েবল। অর্থাৎ , Name ভ্যারিয়েবলটি localArea ফাংশনের ভেতরেই শুধু ব্যাবহার করা যাবে । এইজন্যই উপরোক্ত কোডে সঠিক আউটপুট দিয়েছে।

এখন যদি Name ভ্যারিয়েবলটি localArea ফাংশনের বাহিরে এক্সেস করতে যাই তাহলে :-

function localArea(){
    var Name = 'Shakil Babu';
}

localArea();
console.log(Name);

// Output = ReferenceError: Name is not defined

দেখছেন ? একটা এরর পাইলাম যে Name is not defined মানে Name ডিফাইনই করা হয় নাই । তাহলে, আমরা ফাংশনের বাহিরে ব্যাবহার করতে পারবো নাহ। উপরের গল্পের সাথে কি কিছু মিল পাওয়া গেল ? আমি আর রায়হান কিন্তু আমাদের পাড়া বা লোকাল স্কোপ ছাড়া বাহিরে শক্তি দেখাতে পারি নাহ ।

২। গ্লোবাল(Global) স্কোপ:-

যেসব ভ্যারিয়েবল ফাংশনের বাহিরে যেকোনো জায়গায় ডিক্লেয়ার করা হয় সেসব ভ্যারিয়েবলগুলো গ্লোবাল স্কোপ পায় । এইসব ভ্যারিয়েবলগুলো কে গ্লোবাল ভ্যারিয়েবলও বলা হয় । আর গ্লোবাল ভ্যারিয়েবল যেকোনো জায়গা বা যেকোনো ফাংশনের ভেতর থেকেই এক্সেস করা যায়।

আমাদের গল্পের মাতবর ফাহিম মোরশেদ হইলো গ্লোবাল ভ্যারিয়েবল যে যেকোনো জায়গা থেকেই এক্সেসেবল।

var Name = 'fahim morshed';
function globalArea(){
    console.log('Now',Name,"inside of function.")
}
globalArea();
// output = Now fahim morshed inside of function

console.log('Now',Name,'outside of function.')
// output = Now fahim morshed outside of function

উপরে Name নামে একটা ভ্যারিয়েবল ফাংশনের বাহিরে ডিক্লেয়ার করা হয়েছে । অর্থাৎ,( Name ভ্যারিয়েবল) টি গ্লোবাল হওয়ায় ফাংশনের ভেতর এবং বাহির দুই জায়গা থেকেই সঠিক আউটপুট দিচ্ছে ।

একইভাবে যদি, একটা প্যারেন্ট ফাংশনের ভেতর অন্য আরেকটা চাইল্ড ফাংশন ডিক্লেয়ার করা হয় তাহলে চাইল্ড ফাংশনটি প্যারেন্ট ফাংশনের লোকাল স্কোপ পাবে । এবং চাইল্ড ফাংশনটি শুধুমাত্র প্যারেন্ট ফাংশনের ভেতর এক্সেস করা যাবে বাইরে এক্সেস করা যাবে নাহ ।

function Parent(){
    console.log("Hi! i am parent function");

    function Child(){
        console.log('I am child function');
    }

    Child();
    // ouput = I am child function
}

Parent();
// output = Hi! i am parent function

উপরে লক্ষ্য করুন, Child() ফাংশনটি কিন্তু Parent() ফাংশনের ভেতরেই কল করা হয়েছে কারণ - Child() ফাংশন Parent() ফাংশনের লোকাল । তাই Parent() বা গ্লোবাল ফাংশন কল করায় আমাদের আউটপুটে কোনো এরর আসে নাই ।

এখন যদি, Child() ফাংশনটি Parent() ফাংশনের বাহিরে কল করি তাহলে :-

function Parent(){
    console.log("Hi! i am parent function");
    function Child(){
        console.log('I am child function');
    }
}

Parent();
// output = Hi! i am parent function

Child();
// output = ReferenceError: Child is not defined

আমরা (ReferenceError: Child is not defined) এই এরর টা পাইলাম । Child() ফাংশন Parent() ফাংশনের লোকাল তাই যত খুশি Parent() ফাংশনের ভেতরে এক্সেস করা যাবে কিন্তু বাহিরে এক্সেস করতে গেলে এমন এরর দিবে ।

লেক্সিক্যাল স্কোপিং(Lexical Scoping) :-

আমাদের দেশে কিন্তু একটা নিয়ম আছে যে, বাবা-মার বা প্যারেন্টর সম্পত্তি ছেলে-মেয়ে বা চাইল্ডরা পায় । কিন্তু, ছেলে-মেয়ে বা চাইল্ডদের সম্পত্তি কিন্তু প্যারেন্টরা পায় নাহ। অর্থাৎ, প্যারেন্টর সবকিছুতেই চাইল্ড দের এক্সেস আছে কিন্তু চাইল্ডদের কোনো কিছেতেই প্যারেন্ট দের এক্সেস নাই ।

লেক্সিক্যাল স্কোপিং(Lexical Scoping) কাকে বলে ?

একটা প্যারেন্ট ফাংশনের ভেতর আরেকটি চাইল্ড ফাংশন ডিক্লেয়ার করা হলে চাইল্ড ফাংশনটি প্যারেন্টের লোকাল হয় সেইসাথে প্যারেন্ট ফাংশনের ভেতর আরগুমেন্টসহ ডিক্লেয়ারকৃত সবকিছুতেই চাইল্ড ফাংশন এক্সেস নিতে পারে কিন্তু চাইল্ড ফাংশনের কোনো কিছুতেই প্যারেন্ট ফাংশন এক্সেস নিতে পারে নাহ তাকেই লেক্সিক্যাল স্কোপিং(Lexical Scoping) বলে ।

নিচের উদাহরণ দেখুন:-

function Parent(firstNumber){
    var secondNumber = 10 ;

    function Child(thirdNumber){
        console.log('Sum is : ', (firstNumber + secondNumber + thirdNumber))
    }

    Child(10);
    // Output = Sum is : 30
}

Parent(10);

এখানে, Parent() ফাংশনে একটা আরগুমেন্ট firstNumber নেওয়া হয়েছে । Parent() ফাংশনের ভেতরে secondNumber নামে একটা ভ্যারিয়েবল নেওয়া হয়েছে  সাথে Child() নামে ফাংশনও নেওয়া হয়েছে।

Child() ফাংশনেও একটা আরগুমেন্ট (thirdNumber) নেওয়া হয়েছে । তারপর Child() ফাংশনের ভেতর তিনটা নাম্বার এর যোগফল লগ করা হয়েছে যার আউটপুট সঠিক দিয়েছে । এখানে, একটু লক্ষ্য করলে দেখবেন যে, firstNumber এবং secondNumber প্যারেন্ট ফাংশনের আরগুমেন্ট ও ভ্যারিয়েবল । তাহলে এখানে প্রমাণ হইলো যে, Child() ফাংশন Parent() ফাংশনের সবকিছুতেই এক্সেস করতে পারে ।

তো চলুন এখন দেখি যে, প্যারেন্ট ফাংশন চাইল্ডের কোনো কিছু এক্সেস করতে পারে কি না :-

function Parent(firstNumber){
    
    function Child(){
        var secondNumber = 10 ;
    }

    Child();

    console.log(firstNumber + secondNumber );
}

Parent(10);
// output = ReferenceError: secondNumber is not defined

আমাদের আউটপুট হিসেবে ReferenceError: secondNumber is not definedএই বাণী দিয়েছে । তার মানে চাইল্ড ফাংশনের কোনো কিছু প্যারেন্ট ফাংশন এক্সেস করতে পারবে নাহ । আশা করি বুঝতে পারছেন ।

ধন্যবাদ সবাইকে । স্কোপ নিয়ে আরও জানতে যদি মনের ভেতর সুর-সুরি দিয়ে ওঠে তাহলে এই আরটিকেলটি পড়তে পারেন ।