nu

null ও undefined মধ্যে JavaScript

১টি অনুশীলনী

null ও undefined সম্পর্কে

অন্যান্য অনেক ভাষার বিপরীতে, JavaScript-এ এমন দুটি ভিন্ন সত্তা আছে যারা একটি (অর্থপূর্ণ) মানের অনুপস্থিতিকে প্রকাশ করে। সেগুলো হলো null এবং undefined।

Null

প্রিমিটিভ ভ্যালু null একটি ভ্যারিয়েবলের জন্য ইচ্ছাকৃত "খালি মান" হিসেবে ব্যবহার করা হয়। অন্য ভাষায় একই ধরনের গঠন কেবল (অনুপস্থিত) অবজেক্ট বা পয়েন্টার টাইপের জন্য ব্যবহার করা হতে পারে। JavaScript-এ null সাধারণত যেকোনো টাইপের জন্য একটি খালি মান বোঝায়।

let name = null;
// name is intentionally set to "empty" because it is not
// available

স্ট্রিক্ট ইকুয়ালিটি অপারেটর === ব্যবহার করে আপনি যাচাই করতে পারেন কোনো ভ্যারিয়েবল null কি না। যদিও null একটি প্রিমিটিভ ভ্যালু, typeof অপারেটর ঐতিহাসিক কারণে "ভুলভাবে" object রিটার্ন করে। এর মানে হলো, কোনো ভ্যারিয়েবল null কি না তা যাচাই করতে এটিকে একা ব্যবহার করা যায় না।

let name = null;

name === null;
// => true

// Pitfall:
typeof name;
// => 'object'

Undefined

যে ভ্যারিয়েবলে কোনো মান অ্যাসাইন করা হয়নি, তার টাইপ undefined।1

এর মানে হলো, null যখন একটি খালি মান (তবে তা এখনও একটি মান) বোঝায়, undefined তখন একটি মানের সম্পূর্ণ অনুপস্থিতি বোঝায়। 🤯

undefined বিভিন্ন প্রেক্ষাপটে দেখা যায়।

  • কোনো ভ্যারিয়েবল কোনো মান ছাড়া (ইনিশিয়ালাইজেশন ছাড়া) ডিক্লেয়ার করলে সেটি undefined হয়।
  • অবজেক্টে নেই এমন কোনো কী (key)-এর মান অ্যাক্সেস করতে চাইলে আপনি undefined পান।
  • কোনো ফাংশন যদি কোনো মান রিটার্ন না করে, তবে ফলাফল undefined হয়।
  • কোনো ফাংশনে যদি কোনো আর্গুমেন্ট পাঠানো না হয়, তবে সেটি undefined হয়, যদি না ওই আর্গুমেন্টের একটি ডিফল্ট মান থাকে।
let name;
console.log(name);
// => undefined

let obj = { greeting: 'hello world' };
console.log(obj.missingKey);
// => undefined

function returnNothing() {
  return;
}
console.log(returnNothing());
// => undefined

স্ট্রিক্ট ইকুয়ালিটি অপারেটর === বা typeof অপারেটর ব্যবহার করে আপনি যাচাই করতে পারেন কোনো ভ্যারিয়েবল undefined কি না।

let name;

name === undefined;
// => true

typeof name === 'undefined';
// => true

কোনো ভ্যারিয়েবলে হাতে undefined অ্যাসাইন করা ঠিক নয়; বরং সবসময় null ব্যবহার করুন, যাতে স্পষ্ট বোঝা যায় যে আপনি ইচ্ছাকৃতভাবে একটি খালি মান সেট করেছেন।

অপশনাল চেইনিং

উপরে বলা হয়েছে, JavaScript-এ অবজেক্টের কোনো অনুপস্থিত কী (key) অ্যাক্সেস করলে undefined রিটার্ন হয়। তবে কোনো নেস্টেড মান বের করতে গিয়ে যদি প্যারেন্ট কী (key) না থাকে, তাহলে নেস্টেড কী (key)-এর মূল্যায়ন undefined-এর উপর করা হয় এবং তাতে TypeError: Cannot read property ... of undefined এরর ঘটে। তাত্ত্বিকভাবে, নেস্টেড কী (key) বের করার চেষ্টা করার আগে সবসময় প্যারেন্ট কী (key) আছে কি না তা যাচাই করা প্রয়োজন হতো। এটি প্রায়ই AND অপারেটর && দিয়ে করা হতো, কিন্তু গভীরভাবে নেস্টেড মানের ক্ষেত্রে এতে খুব দীর্ঘ এক্সপ্রেশন তৈরি হয়।

obj.level1 && obj.level1.level2 && obj.level1.level2.level3;

এই সমস্যার সমাধানে ২০২০ সালে ভাষার স্পেসিফিকেশনে অপশনাল চেইনিং যোগ করা হয়। অপশনাল চেইনিং অপারেটর ?. ব্যবহার করে আপনি নিশ্চিত করতে পারেন যে প্যারেন্টটি null বা undefined না হলে তবেই JavaScript নেস্টেড কী (key) অ্যাক্সেস করার চেষ্টা করবে। অন্যথায় undefined রিটার্ন হয়।

const obj = {
  address: {
    street: 'Trincomalee Highway',
    city: 'Batticaloa',
  },
};

obj.residence;
// => undefined

obj.address.zipCode;
// => undefined

obj.residence.street;
// => TypeError: Cannot read property 'street' of undefined

obj.residence?.street;
// => undefined

obj.residence?.street?.number;
// => undefined

নালিশ কোয়ালেসিং

কিছু পরিস্থিতি আছে যেখানে কোনো ভ্যারিয়েবল null বা undefined হলে আপনি একটি ডিফল্ট মান প্রয়োগ করতে চান। আগে এটি প্রায়ই টার্নারি অপারেটর ? দিয়ে বা OR অপারেটর ||-এর লেজি ইভালুয়েশন কাজে লাগিয়ে করা হতো। এর অসুবিধা হলো, ভ্যারিয়েবলটি ফলসি (যেমন '' বা 0) হলে সব ক্ষেত্রেই ডিফল্ট মানটি প্রয়োগ হয়, কেবল null বা undefined হলেই নয়। এতে সহজেই অপ্রত্যাশিত ফলাফল দেখা দিতে পারে।

let amount = null;
amount = amount || 1;
// => 1

amount = 0;
amount = amount || 1;
// => 1

amount = 0;
amount ? amount : 1;
// => 1

এটি মোকাবিলার জন্য নালিশ কোয়ালেসিং অপারেটর ?? চালু করা হয়। অপশনাল চেইনিংয়ের মতো এটিও ২০২০ সালে ভাষার স্পেসিফিকেশনে যোগ করা হয়। নালিশ কোয়ালেসিং অপারেটর ?? কেবল তখনই ডান দিকের অপারেন্ড রিটার্ন করে যখন বাম দিকের অপারেন্ডটি null বা undefined হয়। অন্যথায় বাম দিকের অপারেন্ড রিটার্ন হয়। ফলে এখন আরও নির্দিষ্টভাবে ডিফল্ট মান প্রয়োগ করা যায়।

let amount = null;
amount = amount ?? 1;
// => 1

amount = 0;
amount = amount ?? 1;
// => 0

[1] Undefined, MDN। (2021)। https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/undefined (সংগ্রহ করা হয়েছে ৪ জুন, ২০২১)।

GitHub-এর মাধ্যমে সম্পাদনা করুন লিংকটি নতুন একটি উইন্ডো বা ট্যাবে খুলবে

null ও undefined শিখুন