var, let, const এবং স্কোপ, হোইস্টিং এর মধ্যে পার্থক্য

var, let, const এবং স্কোপ, হোইস্টিং এর মধ্যে পার্থক্য

নিচের টেবিলটি var, let এবং const এর মধ্যে পার্থক্যগুলো তুলনা করে এবং আগের আলোচনা অনুযায়ী তাদের স্কোপ, হোইস্টিং, ভ্যালু অ্যাসাইনমেন্ট, TDZ ইত্যাদি বিষয়গুলো তুলে ধরছে:

ডিটেইলসের মাধ্যমে পার্থক্য:

১. স্কোপ (Scope)

• var: ফাংশন স্কোপে থাকে, ব্লক স্কোপ সমর্থন করে না। অর্থাৎ var দিয়ে ডিক্লেয়ার করা ভ্যারিয়েবলটি ফাংশনের বাইরে বা ব্লকের বাইরে অ্যাক্সেসযোগ্য হতে পারে যদি সেটি ফাংশনের ভিতরে ডিক্লেয়ার করা না হয়।
• let এবং const: ব্লক স্কোপ সমর্থন করে। অর্থাৎ, এগুলি শুধুমাত্র তাদের ডিক্লেয়ার করা ব্লকের মধ্যে এক্সেসযোগ্য।

২. হোইস্টিং (Hoisting)

• var: হোইস্ট হয়, তবে ভ্যালু undefined হয় (অ্যাসাইনমেন্টের আগে এক্সেস করা যাবে না)।
• let এবং const: হোইস্ট হয় কিন্তু TDZ (Temporal Dead Zone) থাকে, অর্থাৎ ডিক্লেয়ারেশনের আগে এগুলি এক্সেস করা যাবে না এবং এর জন্য ReferenceError পাওয়া যাবে।

৩. TDZ (Temporal Dead Zone)

• var: TDZ নেই, তাই ভ্যালু undefined থাকা সত্ত্বেও কোড চলতে থাকে।
• let এবং const: TDZ থাকে, অর্থাৎ আপনি let বা const ভ্যারিয়েবলকে ডিক্লেয়ার করার আগে এক্সেস করলে ReferenceError পাবেন।

৪. ভ্যালু অ্যাসাইনমেন্ট (Value Assignment)

• var: অ্যাসাইনমেন্টের পরেও ভ্যারিয়েবলটি পরিবর্তনযোগ্য থাকে।
• let: অ্যাসাইনমেন্টের পরেও ভ্যারিয়েবলটি পরিবর্তনযোগ্য থাকে।
• const: একবার অ্যাসাইন করার পর ভ্যালু পরিবর্তন করা সম্ভব নয়।

৫. গ্লোবাল স্কোপ (Global Scope)

• var: যদি গ্লোবাল স্কোপে ডিক্লেয়ার করা হয়, তবে সেটি window বা global অবজেক্টের অংশ হয়ে যায়। (ব্রাউজারে window, নোডে global)
• let এবং const: গ্লোবাল স্কোপে ডিক্লেয়ার করার পরেও window বা global অবজেক্টে যুক্ত হয় না।

৬. ফাংশন স্কোপ (Function Scope)

• সব তিনটি var, let, const ফাংশনের ভিতরে এক্সেসযোগ্য। তবে let এবং const ব্লক স্কোপও সমর্থন করে, ফলে এগুলি শুধুমাত্র তাদের ডিক্লেয়ার করা ব্লকেই অ্যাক্সেসযোগ্য।

উদাহরণ দিয়ে বিশ্লেষণ:

উদাহরণ ১: var হোইস্টিং

console.log(a); // undefined
var a = 10;
console.log(a); // 10

এখানে, a প্রথমে হোইস্ট হয় এবং undefined থাকে, তারপর 10 অ্যাসাইন হয়।

উদাহরণ ২: let হোইস্টিং এবং TDZ

console.log(b); // ReferenceError: Cannot access 'b' before initialization
let b = 20;

এখানে b এর হোইস্টিং ঘটে কিন্তু ডিক্লেয়ারেশন আগে এটি অ্যাক্সেস করার চেষ্টা করলে ReferenceError পাওয়া যায়।

উদাহরণ ৩: const হোইস্টিং এবং TDZ

console.log(c); // ReferenceError: Cannot access 'c' before initialization
const c = 30;

এখানে, c এর হোইস্টিং ঘটলেও TDZ এর কারণে আগে অ্যাক্সেস করার চেষ্টা করলে ReferenceError হবে।

উদাহরণ ৪: const এর এক্সেস এবং রিডিফাইনেবল

const d = 40;
d = 50; // TypeError: Assignment to constant variable.

এখানে, const দিয়ে ডিক্লেয়ার করা ভ্যারিয়েবলটি রিডিফাইন করা সম্ভব নয়।

সারাংশ

• var গ্লোবাল স্কোপে এবং ফাংশন স্কোপে কাজ করে, তবে ব্লক স্কোপে কাজ করে না এবং এটি undefined থাকে হোইস্টিংয়ে।
• let এবং const ব্লক স্কোপে কাজ করে, কিন্তু হোইস্টিংয়ের পর TDZ থাকে, যার কারণে এগুলি ডিক্লেয়ার করার আগে এক্সেস করা যায় না।
• const একবার ভ্যালু অ্যাসাইন করা হলে পুনরায় ভ্যালু পরিবর্তন করা সম্ভব নয়, তবে let এবং var ভ্যালু পুনরায় অ্যাস

াইন করা যেতে পারে।

এই সব বিষয়গুলোর সমন্বয়ে জাভাস্ক্রিপ্টে var, let, এবং const এর পার্থক্য বোঝা খুবই গুরুত্বপূর্ণ!

নিচে প্রতিটি var, let, এবং const এর মধ্যে স্কোপের পার্থক্য সহ তাদের ব্লক, ফাংশন, গ্লোবাল স্কোপে অ্যাসাইন করার উদাহরণ দেয়া হলো।

উদাহরণ সহ পার্থক্য:

১. গ্লোবাল স্কোপে অ্যাসাইনমেন্ট:

// var
var x = 10;
console.log(window.x); // 10 (Window Object এ x যোগ হবে)

let y = 20;
console.log(window.y); // undefined (window object এ y যোগ হয় না)

const z = 30;
console.log(window.z); // undefined (window object এ z যোগ হয় না)

এখানে দেখা যাচ্ছে var গ্লোবাল স্কোপে থাকলে সেটা window অবজেক্টে যুক্ত হয়ে যায়, তবে let এবং const গ্লোবাল স্কোপে থাকলেও window অবজেক্টে যুক্ত হয় না।

২. ফাংশন স্কোপে অ্যাসাইনমেন্ট:

function testFunction() {
  // var
  var a = 5;
  console.log(a); // 5 (ফাংশনের ভিতরে কাজ করবে)

  // let
  let b = 10;
  console.log(b); // 10 (ফাংশনের ভিতরে কাজ করবে)

  // const
  const c = 15;
  console.log(c); // 15 (ফাংশনের ভিতরে কাজ করবে)
}

testFunction();

এখানে, var, let, এবং const সবগুলোই ফাংশন স্কোপে থাকে, তাই ফাংশনের ভিতরে সেগুলোর এক্সেস করা যাবে।

৩. ব্লক স্কোপে অ্যাসাইনমেন্ট:

if (true) {
  // var
  var a = 5;
  console.log(a); // 5 (ফাংশন স্কোপে, বাইরের স্কোপেও অ্যাক্সেস হবে)

  // let
  let b = 10;
  console.log(b); // 10 (ব্লক স্কোপে, এই ব্লকের বাইরে এক্সেস করা যাবে না)

  // const
  const c = 15;
  console.log(c); // 15 (ব্লক স্কোপে, এই ব্লকের বাইরে এক্সেস করা যাবে না)
}

console.log(a); // 5 (ফাংশন স্কোপে, বাইরের স্কোপে এক্সেস করা যাবে)
console.log(b); // ReferenceError: b is not defined (ব্লক স্কোপের বাইরে এক্সেস করা যাবে না)
console.log(c); // ReferenceError: c is not defined (ব্লক স্কোপের বাইরে এক্সেস করা যাবে না)

এখানে দেখা যাচ্ছে:

• var ব্লক স্কোপের মধ্যে থাকা সত্ত্বেও ফাংশন স্কোপে অ্যাক্সেসযোগ্য, অর্থাৎ সেটি বাইরের স্কোপে চলে যায়।
• let এবং const ব্লক স্কোপে থাকে, তাই তাদের অ্যাক্সেস ব্লকের বাইরে করা যাবে না।

৪. let এবং const এর TDZ (Temporal Dead Zone):

// let
console.log(a); // ReferenceError: Cannot access 'a' before initialization
let a = 5;

// const
console.log(b); // ReferenceError: Cannot access 'b' before initialization
const b = 10;

এখানে let এবং const এর মধ্যে TDZ বিদ্যমান। আপনি যেগুলো ডিক্লেয়ার করার আগে এক্সেস করতে গেলে ReferenceError পাবেন।

৫. ভ্যালু পুনরায় অ্যাসাইনমেন্ট:

// var
var x = 10;
x = 20; // পুনরায় অ্যাসাইন করা সম্ভব
console.log(x); // 20

// let
let y = 30;
y = 40; // পুনরায় অ্যাসাইন করা সম্ভব
console.log(y); // 40

// const
const z = 50;
z = 60; // TypeError: Assignment to constant variable.
console.log(z); // Error

এখানে:

• var এবং let এ ভ্যালু পুনরায় অ্যাসাইন করা সম্ভব, তবে const এর মান একবার অ্যাসাইন করার পর আর পরিবর্তন করা যায় না।

সারাংশ:

• var: গ্লোবাল স্কোপে window বা global অবজেক্টে যোগ হয়ে যায়, ফাংশন স্কোপে থাকে, এবং ব্লক স্কোপ সমর্থন করে না।
• let: ব্লক স্কোপ সমর্থন করে, ফাংশন স্কোপে কাজ করে, তবে TDZ (Temporal Dead Zone) থাকে, তাই ডিক্লেয়ারেশন করার আগে এক্সেস করা যাবে না।
• const: ব্লক স্কোপে কাজ করে, ফাংশন স্কোপে কাজ করে, এবং একবার মান অ্যাসাইন করার পর তা পরিবর্তন করা যায় না। TDZ থেকেও এক্সেস করা যাবে না ডিক্লেয়ারেশনের আগে।