7.6 new কীওয়ার্ড কি? এটা কীভাবে কাজ করে?

জাভাস্ক্রিপ্টে অন্যতম গুরুত্বপূর্ণ একটা টপিক হচ্ছে new কীওয়ার্ড। আমরা কন্সট্রাক্টর প্যাটার্ন ইউজ করার সময় এটি ব্যবহার করি, কিংবা ES6 -এ ক্লাস থেকে নতুন ইন্সট্যান্স/অবজেক্ট তৈরি করার ক্ষেত্রেও ব্যবহার করে থাকি। আজ আমরা জানবো এটি কীভাবে কাজ করে।

আমরা যখন কন্সট্রাক্টর প্যাটার্ন ইউজ করার সময় new কীওয়ার্ড ইউজ করি তখন সাধারণত ৪ টা জিনিস হয়। সেগুলো হচ্ছেঃ

  1. একটি সম্পূর্ণ নতুন অবজেক্ট তৈরি হয়
  2. নতুন অবজেক্টের প্রোটোটাইপ হিসেবে ফাংশনের প্রোটোটাইপ সেট হয়
  3. this এর ভ্যালু হিসেবে নতুন অবজেক্টটি সেট হয়
  4. নতুন তৈরি করা অবজেক্টটি অটোমেটিক রিটার্নড হয়

উপরের কথাগুলো না বুঝে থাকলে আমি বলব জাভাস্ক্রিপ্টের প্রোটোটাইপ এবং কন্সট্রাক্টর ফাংশন টপিকগুলো দেখে আসতে। তাহলে এগুলো বুঝতে সুবিধা হবে।

এখন new কীওয়ার্ড ব্যবহার করে একটি ফাংশন কল করার জন্য, আমাদের আগে একটি ফাংশন ডিক্লেয়ার করতে হবে। চলুন একটি ফাংশন ডিক্লেয়ার করিঃ

function Car(color) {
   this.color = color;
};

 

আমরা Car নামে একটি ফাংশন তৈরি করেছি, যার প্যারামিটার হিসেবে color থাকবে এবং সেটা তার নিজের color প্রোপার্টিতে এসাইন করবে। এখন আমরা যদি new কীওয়ার্ড ব্যবহার করে ফাংশনটি কল করি, তাহলে নিচের জিনিসগুলো হবে।

১। নতুন অবজেক্ট তৈরি হওয়া

let mercedes = new Car("Red");
console.log(typeof mercedes)      // Output: object

 

এখানে আমরা new কীওয়ার্ড ব্যবহার করতেই mercedes অবজেক্ট তৈরি হয়ে গেছে।

২। নতুন অবজেক্টের প্রোটোটাইপ হিসেবে ফাংশনের প্রোটোটাইপ সেট হওয়া

আমরা জানি যে, প্রত্যেকটা ফাংশনেরই prototype প্রোপার্টি থাকে। এখন আমরা যদি Car কন্সট্রাক্টর ফাংশনের প্রোটোটাইপের মধ্যে একটা মেথড ডিক্ল্যেয়ার করি, তাহলে “new” কীওয়ার্ড ব্যবহার করতেই নতুন অবজেক্টের প্রোটোটাইপ প্রোপার্টির সাথে Car ফাংশনের প্রোটোটাইপের লিংক হয়ে যাবে। কথাগুলো শুনতে কিছুটা কঠিন লাগতে পারে। নিচের উদাহরণটি দেখার পরে আশা করি ব্যাপারটা পরিষ্কার হয়ে যাবে।

function Car(color) {
   this.color = color;
};

Car.prototype.getColor = function(){
   console.log("Color of the car is "+this.color)
}

let mercedes = new Car("Red");
mercedes.getColor()         // Output: Color of the car is Red

 

দেখা যাচ্ছে যে, নতুন অবজেক্ট থেকেই আমরা Car এর প্রোটোটাইপের মেথড getColor এক্সেস করতে পারছি। তাই আমরা দেখতে পাচ্ছি যে new কীওয়ার্ড ব্যবহার করলে আমাদের জন্য স্বয়ংক্রিয়ভাবে এই প্রোটোটাইপ লিঙ্কেজ তৈরি হয়।

৩। this এর ভ্যালু হিসেবে নতুন অবজেক্টটি সেট হওয়া

যখনি আমরা new কীওয়ার্ড ব্যবহার করে নতুন অবজেক্ট তৈরি করি, তখনি ফাংশনের ভিতরে this এর ভ্যালু হিসেবে নতুন অবজেক্টটি সেট হবে। এভাবে যদি আমরা হাজারটা অবজেক্টও তৈরি করি, প্রত্যেকবারই this এর ভ্যালু হিসেবে নতুন অবজেক্টই ঠিক হবে। নিচের কোডটি খেয়াল করিঃ

function Car(color) {
   this.color = color;
};

Car.prototype.getColor = function(){
   console.log("Color of the car is "+this.color)
}

let mercedes = new Car("Red");
mercedes.getColor()               // Output: Color of the car is Red
let bmw = new Car("Black");
bmw.getColor()                    // Output: Color of the car is Black

 

যখন আমরা mercedes অবজেক্ট তৈরি করেছি, তখন this এর মান এই অব্জেক্টটিতেই সেট হয়, যার কারণে কালার Red হয়। আবার যখন bmw অবজেক্ট তৈরি করেছি, তখন কালার Black হয়েছে।

৪। নতুন তৈরি অবজেক্ট রিটার্ন হওয়া

এটা বোঝার জন্য আমাদের দুইটা আলাদা ফাংশন ডেফিনিশনের দিকে খেয়াল করতে হবে। প্রথমটায় কোনো return স্টেটমেন্ট থাকবেনা, আর দ্বিতীয়টায় return স্টেটমেন্ট থাকবে। চলুন নিচের কোডটি খেয়াল করিঃ

function Car(color) {
   var object = {
     color: "Green"
   }
   this.color = color;
};

let mercedes = new Car("Red");
console.log(mercedes.color);             // Output: Red
console.log(mercedes instanceof Car)     // Output: true

 

ফাংশনটি একটি অবজেক্ট রিটার্ন করে। তা Car এর ইন্সট্যান্স কিনা তা দেখি এবং আউটপুট true আসে। আসুন এখন ফাংশনটিকে সামান্য পরিবর্তন করি এবং এতে একটি রিটার্ন স্টেটমেন্ট যোগ করি।

function Car(color) {
   var object = {
     color: "Green"
   }
   this.color = color;
   return object;
};

let mercedes = new Car("Red");
console.log(mercedes.color);              // Output: Green
console.log(mercedes instanceof Car)      // Output: false

 

দেখা যাচ্ছে যে এখন আর mercedes অবজেক্ট Car এর ইন্সট্যান্স না। আমাদের তৈরি করা একটি নরমাল অবজেক্ট এক্ষেত্রে রিটার্ন হয়েছে।

আমরা কন্সট্রাক্টর ফাংশনের ক্ষেত্রে new কীওয়ার্ড এর ব্যবহার দেখলাম, এখন দেখব ES6 এর ক্লাসের ক্ষেত্রে new কীওয়ার্ড এর ব্যবহার। ক্লাসের ক্ষেত্রে যখন new কীওয়ার্ড ব্যবহার করা হয় ওই ক্লাসের নতুন কোন ইন্সট্যান্স বা অবজেক্ট তৈরি করতে। নিচের কোডটি একটি নতুন Car অবজেক্ট তৈরি করে, যা সাথে সাথেই Car ক্লাসের কন্সট্রাক্টর মেথড কল করে, আর this এর ভ্যালু হিসেবে অবজেক্টটি সেট হয়। যেহেতু mercedes অবজেক্টটি Car ক্লাস থেকে তৈরি করা হয়েছে, তাই Car ক্লাসের মেথড আর প্রোপার্টিগুলোও mercedes অবজেক্ট থেকে এক্সেস করা যাবে।

class Car {
   constructor(color){
     this.color = color;
   }
   getColor (){
     console.log(this.color)
   }
}

let mercedes = new Car("Red");
mercedes.getColor()              // Output: Red

 

আশা করি new কীওয়ার্ড সম্পর্কে আমাদের ধারণা পরিষ্কার হয়েছে। জাভাস্ক্রিপ্টে এর ব্যবহার আমরা অনেক বেশি দেখব।