JavaScriptAdvanced

Prototype Chain

Prototype ও inheritance, Object.create, delegation, class-এর ভেতর prototype — JavaScript-এর উত্তরাধিকার ব্যবস্থা বাংলায়।

22টি অংশবাংলা ভাষায়

JavaScript-এ উত্তরাধিকার (inheritance) class-এর মতো নয় — সব object-এর একটি hidden link [[Prototype]] থাকে। এই chain-কেই বলে prototype chain।

Prototype কী

const arr = [1, 2, 3];

console.log(arr.length);      // 3 — নিজের property
console.log(arr.join("-"));    // "1-2-3" — কোথা থেকে?

// আরে prototype থেকে: Array.prototype.join
console.log(Array.prototype.join === arr.join) // true

arr-এর নিজের কাছে join নেই — খোঁজালে JavaScript prototype chain ধরে পেয়ে যায়। সব array-এর prototype হলো Array.prototype।

Object এর prototype

const user = { name: "রহিম" };

console.log(user.toString());
// user → Object.prototype → null

// প্রোটোটাইপ দেখতে
console.log(Object.getPrototypeOf(user)); // Object.prototype

console.log(Object.prototype.toString === user.toString); // true

Delegation — মূল ধারণা

const animal = {
  eat() {
    console.log("খাচ্ছে");
  },
};

const dog = Object.create(animal);   // dog-এর prototype = animal
dog.name = "টমি";

dog.eat();     // delegation — dog নিজে না পেয়ে prototype থেকে
console.log(dog.name);         // নিজের property
console.log(Object.getPrototypeOf(dog) === animal); // true

Object.create(proto) দিয়ে নতুন object-এর prototype বানানো যায়। property খুঁজে না পেলে chain ধরে parent-এ যায় — এটাই delegation।

Chain — কেমন ভাবে

function Dog(name) {
  this.name = name;
}

// prototype-এ method
Dog.prototype.bark = function () {
  console.log(this.name + " ঘেউ");
};

const tommy = new Dog("টমি");
const bob = new Dog("বব");

tommy.bark();  // টমি ঘেউ
bob.bark();    // বব ঘেউ

// method একটাই — shared
console.log(tommy.bark === bob.bark); // true

constructor-এর .prototype-এ রাখা method-গুলো সব instance-এর জন্য shared — প্রতিবার নতুন বানানোর দরকার নেই, memory বাঁচে।

class-এর ভেতর prototype

class Animal {
  constructor(name) {
    this.name = name;
  }
  speak() {
    return this.name + " শব্দ";
  }
}

class Dog extends Animal {
  speak() {
    return super.speak() + " — ঘেউ";
  }
}

const d = new Dog("টমি");
console.log(d.speak());

// d → Dog.prototype → Animal.prototype → Object.prototype
console.log(d instanceof Dog);     // true
console.log(d instanceof Animal);  // true

class মূলত prototype-এর syntactic sugar — method-গুলো .prototype-এ জমা হয়। extends/super ঠিক করে chain।

hasOwnProperty

const dog = Object.create(animal);
dog.name = "টমি";

console.log(dog.hasOwnProperty("name")); // true — নিজের
dog.hasOwnProperty("eat");               // false — prototype-এ

"নিজের" property-কে শনাক্ত করতে hasOwnProperty — prototype-এর উত্তরাধিকার বাদ দিয়ে। ডেটা-ভিত্তিক কাজে Object.keys একই রকম।

অংশ	কাজ
`[[Prototype]]`	object-এর hidden link
`Object.create(proto)`	prototype দিয়ে object
`.prototype`	constructor-এর shared method
`Object.getPrototypeOf`	prototype দেখা
`hasOwnProperty`	নিজের property check

অ্যারে-ও object

array-এর prototype-এ array method, object-এর prototype-এ object method — chain ধরে জড়িত, তাই array-ও অবশেষে object।

Interview

"Class-এর prototype কী?" — method-গুলো .prototype-এ shared, instance-গুলো কেবল [[Prototype]] link দিয়ে পায়।

Practice

Object.create দিয়ে point object বানিয়ে, খুঁজে না পাওয়া property-র উত্তর chain-এ কীভাবে আসে — কনসোলে __proto__ দেখুন।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।