JavaScript Scope কী? Global, Local ও Block Scope

JavaScript Scope কী, Global Scope, Function Scope, Block Scope, let, const, var, Scope Chain ও Lexical Scope সহজ উদাহরণসহ শিখুন।

JavaScript Scope হলো JavaScript-এর এমন একটি গুরুত্বপূর্ণ concept, যা নির্ধারণ করে একটি variable বা function-এর কোন জায়গা থেকে access করা যাবে এবং কোন জায়গা থেকে access করা যাবে না।

সহজভাবে বললে, Scope হলো একটি variable কোথায় accessible বা ব্যবহারযোগ্য থাকবে তার সীমা। JavaScript-এ Scope ভালোভাবে বোঝা অত্যন্ত গুরুত্বপূর্ণ, কারণ var, let, const, function, block এবং nested function নিয়ে কাজ করার সময় Scope-এর নিয়ম বারবার ব্যবহার করতে হয়।

JavaScript Scope কী?

Scope নির্ধারণ করে JavaScript code-এর কোন অংশ থেকে একটি variable ব্যবহার করা যাবে।

উদাহরণ:

let x = 10;

console.log(x);

এখানে x এমন একটি জায়গায় declare করা হয়েছে যেখান থেকে এটি নিচের code-এ access করা যাচ্ছে।

অন্যদিকে কোনো variable যদি function-এর ভিতরে declare করা হয়, তাহলে সাধারণভাবে সেটি function-এর বাইরে access করা যায় না।

function myFunction() {
  let x = 10;
}

console.log(x);

এখানে x function-এর ভিতরের variable। তাই function-এর বাইরে x access করলে error হবে।

JavaScript-এ Scope-এর প্রধান ধরন

JavaScript-এ সাধারণভাবে নিচের Scope-গুলো গুরুত্বপূর্ণ:

  1. Global Scope
  2. Function Scope
  3. Block Scope
  4. Module Scope

এছাড়াও JavaScript-এর Scope Chain এবং Lexical Scope বোঝাও গুরুত্বপূর্ণ।

1. Global Scope

কোনো variable যদি কোনো function বা block-এর বাইরে declare করা হয়, তাহলে সেটি সাধারণভাবে Global Scope-এর variable।

let name = "John";

function showName() {
  console.log(name);
}

showName();

Output:

John

এখানে name global scope-এ আছে। তাই function-এর ভিতর থেকেও সেটিকে access করা যাচ্ছে।

Global Variable-এর উদাহরণ

const country = "Bangladesh";

console.log(country);

function showCountry() {
  console.log(country);
}

showCountry();

country function-এর বাইরে declare করা হয়েছে, তাই এটি function-এর ভিতরেও accessible।

2. Function Scope

কোনো variable যদি function-এর ভিতরে declare করা হয়, তাহলে সেটি সাধারণভাবে সেই function-এর Scope-এর মধ্যে সীমাবদ্ধ থাকে।

function myFunction() {
  let message = "Hello World";

  console.log(message);
}

myFunction();

এখানে message function-এর ভিতরে declare করা হয়েছে। তাই function-এর বাইরে এটি ব্যবহার করা যাবে না।

function myFunction() {
  let message = "Hello World";
}

console.log(message);

উপরের code-এ message function-এর বাইরে access করার চেষ্টা করা হয়েছে। তাই error হবে।

3. Block Scope

Block বলতে সাধারণত curly braces { }-এর ভিতরের code-কে বোঝানো হয়।

let এবং const block-scoped।

{
  let x = 10;
  const y = 20;

  console.log(x);
  console.log(y);
}

কিন্তু block-এর বাইরে:

{
  let x = 10;
}

console.log(x);

এখানে x access করা যাবে না, কারণ এটি block-এর ভিতরে declare করা হয়েছে।

if Block-এর Scope

if (true) {
  let message = "Hello";

  console.log(message);
}

এখানে message শুধু if block-এর ভিতরে accessible।

if (true) {
  let message = "Hello";
}

console.log(message);

এখানে message block-এর বাইরে access করা যাবে না।

var, let এবং const-এর Scope

JavaScript-এ var, let এবং const variable declaration-এর Scope-এর নিয়ম এক নয়।

Keyword Scope Reassign Redeclare
var Function Scope হ্যাঁ হ্যাঁ
let Block Scope হ্যাঁ একই Scope-এ না
const Block Scope না না

var-এর Function Scope

var block-scoped নয়। এটি function-scoped।

if (true) {
  var x = 10;
}

console.log(x);

এখানে x block-এর বাইরে থেকেও access করা যাচ্ছে।

কারণ var if block-এর Scope অনুসরণ করে না।

let-এর Block Scope

if (true) {
  let x = 10;
}

console.log(x);

এখানে error হবে, কারণ let block-scoped।

const-এর Block Scope

if (true) {
  const x = 10;
}

console.log(x);

এখানেও error হবে, কারণ const block-scoped।

Global Scope এবং Function Scope একসাথে

let x = 5;

function myFunction() {
  const x = 3;

  console.log(x);
}

myFunction();

console.log(x);

Output:

3
5

এখানে দুটি আলাদা x variable রয়েছে।

  1. Global x এর value হলো 5।
  2. Function-এর ভিতরের x এর value হলো 3।
  3. Function-এর ভিতরের x global x-কে পরিবর্তন করে না।

Local Scope

Function বা block-এর ভিতরে থাকা variable-কে সাধারণভাবে Local Variable বলা হয়।

function test() {
  let message = "Hello";

  console.log(message);
}

test();

এখানে message একটি local variable।

Scope Chain কী?

JavaScript যখন কোনো variable ব্যবহার করতে দেখে, তখন প্রথমে বর্তমান Scope-এ সেই variable খুঁজে। সেখানে না পেলে বাইরের Scope-এ খুঁজে। এভাবে ধাপে ধাপে বাইরের Scope-এ যেতে থাকে। এই ব্যবস্থাকে Scope Chain বলা হয়।

let a = 10;

function outer() {
  let b = 20;

  function inner() {
    let c = 30;

    console.log(a);
    console.log(b);
    console.log(c);
  }

  inner();
}

outer();

inner() function তিনটি variable-ই access করতে পারছে।

  1. c পাওয়া যাচ্ছে নিজের Scope-এ।
  2. b পাওয়া যাচ্ছে outer function-এর Scope-এ।
  3. a পাওয়া যাচ্ছে Global Scope-এ।

Lexical Scope কী?

JavaScript-এ একটি function কোথায় লেখা হয়েছে তার ওপর ভিত্তি করে সে কোন বাইরের variable access করতে পারবে তা নির্ধারিত হয়। এটিকে Lexical Scope বলা হয়।

let name = "John";

function outer() {

  let age = 30;

  function inner() {
    console.log(name);
    console.log(age);
  }

  inner();
}

outer();

inner() function তার নিজের Scope-এর পাশাপাশি বাইরে থাকা age এবং Global Scope-এর name access করতে পারছে।

Nested Function Scope

একটি function-এর ভিতরে আরেকটি function থাকলে তাকে Nested Function বলা হয়।

function outer() {

  let message = "Hello";

  function inner() {
    console.log(message);
  }

  inner();
}

outer();

এখানে inner() function তার outer function-এর variable message access করতে পারছে।

Inner Function থেকে Outer Variable Access

function outer() {

  let x = 10;

  function inner() {
    console.log(x);
  }

  inner();
}

outer();

Output:

10

কারণ inner function-এর Scope Chain-এর মাধ্যমে outer function-এর x পাওয়া যাচ্ছে।

Outer Function থেকে Inner Variable Access করা যায় না

Scope-এর একটি গুরুত্বপূর্ণ নিয়ম হলো, বাইরের Scope সাধারণভাবে ভেতরের Scope-এর variable access করতে পারে না।

function outer() {

  function inner() {
    let x = 10;
  }

  console.log(x);
}

outer();

এখানে x inner function-এর ভিতরে তৈরি হয়েছে। তাই outer function থেকে x access করা যাবে না।

Scope এবং Function Parameter

Function parameter-ও function-এর Scope-এর মধ্যে থাকে।

function add(a, b) {
  return a + b;
}

console.log(add(10, 20));

এখানে a এবং b function-এর local parameter। এগুলো function-এর বাইরে সরাসরি access করা যায় না।

Block Scope এবং Loop

Loop-এর মধ্যে let ব্যবহার করলে variable block-scoped থাকে।

for (let i = 0; i < 3; i++) {
  console.log(i);
}

console.log(i);

এখানে শেষের console.log(i) error দেবে, কারণ i loop block-এর বাইরে accessible নয়।

var ব্যবহার করলে

for (var i = 0; i < 3; i++) {
  console.log(i);
}

console.log(i);

এখানে var block-scoped না হওয়ায় loop-এর বাইরে থেকেও i access করা যায়।

Scope এবং if Statement

let age = 20;

if (age >= 18) {
  let message = "Adult";

  console.log(message);
}

এখানে message শুধুমাত্র if block-এর ভিতরে accessible।

Scope Shadowing কী?

যখন inner Scope-এ বাইরের Scope-এর একই নামের variable declare করা হয়, তখন inner variable বাইরের variable-কে shadow করে।

let name = "John";

function myFunction() {

  let name = "Jane";

  console.log(name);
}

myFunction();

console.log(name);

Output:

Jane
John

Function-এর ভিতরে থাকা name outer name-কে shadow করছে।

Block Shadowing

let x = 10;

{
  let x = 20;

  console.log(x);
}

console.log(x);

Output:

20
10

Block-এর ভিতরের x বাইরের x-কে shadow করেছে।

Global Variable পরিবর্তন করা

Function-এর ভিতর থেকে Global variable access করে পরিবর্তন করা সম্ভব, যদি variable পরিবর্তনযোগ্য হয়।

let count = 0;

function increase() {
  count = count + 1;
}

increase();
increase();

console.log(count);

Output:

2

এখানে function-এর ভিতর থেকে Global count পরিবর্তন করা হয়েছে।

Global Variable এবং Local Variable

Global Variable Local Variable
বাইরের Scope-এ declare করা হয় Function বা block-এর ভিতরে declare করা হয়
অনেক জায়গা থেকে access করা যায় নিজের Scope-এর মধ্যে accessible
বড় project-এ বেশি ব্যবহার করলে conflict হতে পারে Scope সীমিত হওয়ায় সাধারণত বেশি নিরাপদ

Scope এবং var-এর সমস্যা

পুরোনো JavaScript-এ var বেশি ব্যবহৃত হতো। কিন্তু var block scope follow করে না।

if (true) {
  var message = "Hello";
}

console.log(message);

Output:

Hello

আধুনিক JavaScript-এ সাধারণত প্রয়োজন অনুযায়ী let এবং const ব্যবহার করা হয়, কারণ এগুলো block-scoped।

Scope এবং Hoisting

Scope বোঝার সময় Hoisting concept-ও গুরুত্বপূর্ণ। JavaScript execution-এর আগে variable এবং function declaration কীভাবে তৈরি ও initialize হয়, তার সঙ্গে Hoisting সম্পর্কিত।

var Example

console.log(x);

var x = 10;

এখানে output হবে:

undefined

let Example

console.log(x);

let x = 10;

এখানে ReferenceError হবে, কারণ declaration-এর আগে x access করা হয়েছে।

Scope এবং const

const block-scoped এবং একবার value assign করার পর একই variable-এ নতুন value assign করা যায় না।

{
  const x = 10;

  console.log(x);
}

console.log(x);

শেষের console.log(x) block-এর বাইরে হওয়ায় error হবে।

Scope এবং let

let block-scoped হলেও একই Scope-এর মধ্যে এর value পরিবর্তন করা যায়।

let x = 10;

x = 20;

console.log(x);

Output:

20

Scope এবং Strict Mode

Strict Mode ব্যবহার করলে variable declare না করে ব্যবহার করার মতো কিছু ভুল আচরণ JavaScript error হিসেবে দেখায়।

"use strict";

x = 10;

console.log(x);

এখানে x declare করা হয়নি, তাই error হবে।

সঠিক code:

"use strict";

let x = 10;

console.log(x);

Module Scope

JavaScript ES Modules ব্যবহার করলে module-এর variable সাধারণভাবে সেই module-এর মধ্যেই সীমাবদ্ধ থাকে।

// app.js

const name = "John";

console.log(name);

Module system ব্যবহার করার সময় export এবং import-এর মাধ্যমে প্রয়োজনীয় value অন্য module-এ ব্যবহার করা যায়।

// user.js

export const name = "John";
// app.js

import { name } from "./user.js";

console.log(name);

Scope কেন গুরুত্বপূর্ণ?

JavaScript project বড় হওয়ার সঙ্গে সঙ্গে Scope-এর গুরুত্ব আরও বেড়ে যায়। Scope ঠিকভাবে ব্যবহার করলে variable conflict কমে এবং code বুঝতে ও maintain করতে সহজ হয়।

  1. Variable কোথায় ব্যবহার করা যাবে তা নির্ধারণ করা যায়।
  2. একই নামের variable বিভিন্ন Scope-এ ব্যবহার করা যায়।
  3. Accidental global variable তৈরি হওয়ার ঝুঁকি কমে।
  4. Code maintain করা সহজ হয়।
  5. Function এবং block-এর data আলাদা রাখা যায়।
  6. Large project-এ naming conflict কমানো যায়।

একটি সম্পূর্ণ Scope Example

let globalValue = 10;

function outer() {

  let outerValue = 20;

  function inner() {

    let innerValue = 30;

    console.log(globalValue);
    console.log(outerValue);
    console.log(innerValue);
  }

  inner();
}

outer();

Output:

10
20
30

এখানে inner() function তিনটি Scope থেকেই value access করছে।

  1. innerValue → নিজের Scope থেকে এসেছে।
  2. outerValue → outer function-এর Scope থেকে এসেছে।
  3. globalValue → Global Scope থেকে এসেছে।

JavaScript Scope সহজে মনে রাখার নিয়ম

  1. Global Scope: Function ও block-এর বাইরে declare করা variable।
  2. Function Scope: Function-এর ভিতরের variable।
  3. Block Scope: letconst block-এর ভিতরে সীমাবদ্ধ থাকে।
  4. var: Function-scoped, block-scoped নয়।
  5. Scope Chain: নিজের Scope-এ না পেলে JavaScript বাইরের Scope-এ খোঁজে।
  6. Shadowing: Inner Scope-এর একই নামের variable outer variable-কে shadow করে।
  7. Lexical Scope: Function কোথায় লেখা হয়েছে তার ওপর তার outer Scope নির্ধারিত হয়।

উপসংহার

JavaScript Scope হলো এমন একটি নিয়ম, যা নির্ধারণ করে কোনো variable বা function code-এর কোন অংশ থেকে access করা যাবে। JavaScript ভালোভাবে শেখার জন্য Global Scope, Function Scope, Block Scope, let, const, var, Scope Chain, Lexical Scope এবং Shadowing ভালোভাবে বোঝা প্রয়োজন।

বিশেষ করে আধুনিক JavaScript শেখার সময় let এবং const-এর block scope এবং function-এর local scope ভালোভাবে বুঝে practice করা উচিত। Scope পরিষ্কারভাবে বুঝতে পারলে JavaScript-এর Closures, Functions, Modules এবং Classes শেখাও অনেক সহজ হয়ে যাবে।

Post a Comment

To avoid SPAM, all comments will be moderated before being displayed.
Don't share any personal or sensitive information.