Chapter 23 — Inheritance & Polymorphism

Bu bobda OOP'ning yana ikkita muhim ustuni — Inheritance (Meros olish) va **Polymorphism (Ko'p shakllilik)**ni o'rganamiz.

---

23.1 Inheritance nima?

Simple Explanation

Inheritance — bitta class boshqa class'ning barcha propertylari va metodlarini "meros olib", ustiga o'zining qo'shimcha xususiyatlarini qo'shishi.

Why Does It Exist?

Agar Dog, Cat, Bird — barchasi umumiy xususiyatlarga ega bo'lsa (masalan, name, eat()), bu umumiy qismlarni har bir class'da alohida-alohida qayta yozish o'rniga, ularni umumiy Animal class'ida yozib, qolganlar undan meros olishlari mumkin.

Real-Life Analogy

🧬 Inheritance — bu biologik meros: bola ota-onasining ko'plab xususiyatlarini (ko'z rangi, bo'yi) meros oladi, lekin o'zining alohida xususiyatlariga (masalan, ismiga) ham ega bo'ladi.

Example

script.js
JavaScriptNusxalash
01class Animal {
02    constructor(name) {
03        this.name = name;
04    }
05 
06    eat() {
07        console.log(`${this.name} ovqatlanmoqda`);
08    }
09}
10 
11class Dog extends Animal {
12    bark() {
13        console.log(`${this.name} vovullamoqda`);
14    }
15}
16 
17let myDog = new Dog("Ola");
18 
19myDog.eat();  // "Ola ovqatlanmoqda" — Animal'dan meros
20myDog.bark(); // "Ola vovullamoqda" — Dog'ning o'zida

How It Works

• extends Animal — Dog class'i Animaldan meros olishini bildiradi.
• Dogning o'z instance'lari (myDog) — Animalning barcha metodlariga (eat()) kirisha oladi, xuddi o'zida yozilgandek.
• Dog shu bilan birga o'zining qo'shimcha metodiga (bark()) ham ega.

🔗 Connection
extends — Chapter 21'da o'rgangan Prototype Chain mexanizmini ishlatadi: Dog.prototypening prototipi — Animal.prototype qilib avtomatik belgilanadi.

23.2 super — ota-klassga murojaat

Simple Explanation

super — bola class ichida ota-klassning constructor'i yoki metodlariga murojaat qilish uchun ishlatiladi.

Example

script.js
JavaScriptNusxalash
01class Animal {
02    constructor(name) {
03        this.name = name;
04    }
05 
06    describe() {
07        return `Men — ${this.name}`;
08    }
09}
10 
11class Dog extends Animal {
12    constructor(name, breed) {
13        super(name); // Animal'ning constructor'ini chaqiradi
14        this.breed = breed;
15    }
16 
17    describe() {
18        return super.describe() + `, zoti — ${this.breed}`;
19    }
20}
21 
22let dog = new Dog("Ola", "Labrador");
23console.log(dog.describe()); // "Men — Ola, zoti — Labrador"

How It Works — bosqichma-bosqich

1. new Dog("Ola", "Labrador") chaqiriladi.
2. Dogning constructor'i ishga tushadi, u super(name) chaqiradi.
3. super(name) — Animalning constructor'ini chaqiradi, u this.name = nameni bajaradi.
4. Constructor davom etib, this.breed = breedni bajaradi.
5. describe() chaqirilganda, super.describe() — Animalning describe() metodini chaqiradi, natijaga qo'shimcha matn qo'shiladi.

⚠️ Common Mistake
Agar bola class'da constructor yozilgan bo'lsa, unda super(...)ni chaqirish majburiy — aks holda xatolik chiqadi:

script.js
JavaScriptNusxalash
01class Dog extends Animal {
02    constructor(name, breed) {
03        this.breed = breed; // ❌ ReferenceError: 'this' o'zi hali "yaratilmagan"
04    }
05}

Nima uchun? super() chaqirilmaguncha, this hali mavjud emas — chunki ota-klass constructor'i thisni "yaratish" uchun javobgar.

23.3 ⚠️ Qiyin mavzu: Polymorphism (Ko'p shakllilik)

Simple Explanation

Polymorphism — turli class'lar bir xil nomdagi metodga ega bo'lishi, lekin har biri o'zicha boshqacha ishlashi.

Nega bu tushuncha qiyin?

Chunki bu — "abstrakt" tushuncha, uni amaliy misolsiz tasavvur qilish qiyin. Aslida siz buni Chapter 23.2'da describe() metodi orqali allaqachon ko'rgan edingiz — Dog o'zining describe()sini Animalnikidan farqli qilib yozdi (bu — method overriding deb ataladi).

Real-Life Analogy

🔊 Polymorphism'ni turli hayvonlarning "ovoz chiqarish" qobiliyatiga o'xshating: hammasi "ovoz chiqaradi" (bir xil metod nomi), lekin it vovullaydi, mushuk miyovlaydi, qush sayraydi (har biri o'zicha ishlaydi).

Example — bir nechta class, bitta interfeys

script.js
JavaScriptNusxalash
01class Animal {
02    makeSound() {
03        console.log("Хайвон ovoz chiqarmoqda");
04    }
05}
06 
07class Dog extends Animal {
08    makeSound() {
09        console.log("Vov-vov!");
10    }
11}
12 
13class Cat extends Animal {
14    makeSound() {
15        console.log("Myov!");
16    }
17}
18 
19class Bird extends Animal {
20    makeSound() {
21        console.log("Chirq-chirq!");
22    }
23}
24 
25let animals = [new Dog(), new Cat(), new Bird()];
26 
27animals.forEach(animal => animal.makeSound());
28// "Vov-vov!"
29// "Myov!"
30// "Chirq-chirq!"

Nima uchun bu kuchli?

Eng muhim jihati: animals.forEach(animal => animal.makeSound()) qatorida, biz har bir hayvon turini alohida tekshirmadik (if (animal instanceof Dog) ... kabi). Kod shunchaki har bir object'ga makeSound()ni chaqirdi, va JavaScript avtomatik ravishda har biri uchun to'g'ri (o'ziga xos) versiyani tanladi.

Diagram

code.text
TEXTNusxalash
01animals array: [Dog, Cat, Bird]
02        │
03        ▼ forEach(animal => animal.makeSound())
04        │
05   Har bir object o'zining METHOD OVERRIDE
06   qilingan makeSound() versiyasini ishlatadi

💡 Key Idea
Polymorphism orqali kod umumiyroq va kengaytiriladigan bo'ladi: agar ertaga yangi Fish class qo'shilsa (makeSound() bilan), yuqoridagi forEach kodini o'zgartirish shart emas — u avtomatik ishlayveradi.

23.4 method overriding vs method overloading

Simple Explanation

• Overriding — bola class ota-klassning metodini qayta yozib, boshqacha xatti-harakat bilan almashtiradi (yuqorida ko'rdik).
• Overloading — bitta metodning bir nechta "versiyasi", turli argumentlar soni/turiga qarab boshqacha ishlaydi. JavaScript'da bu klassik shaklda mavjud emas (Java yoki C++dan farqli).

⚠️ Common Mistake
JavaScript'da bir xil nomli metodni ikki marta yozishga urinish — ikkinchisi birinchisini butunlay almashtiradi (overload emas):

script.js
JavaScriptNusxalash
01class Test {
02    method(a) { console.log("1 argument"); }
03    method(a, b) { console.log("2 argument"); } // birinchisini "yopib qo'yadi"
04}

Agar "overloading"ga o'xshash xatti-harakat kerak bo'lsa, argumentlar sonini metod ichida tekshirish kerak:

script.js
JavaScriptNusxalash
01class Test {
02    method(a, b) {
03        if (b === undefined) {
04            console.log("1 argument bilan ishladi");
05        } else {
06            console.log("2 argument bilan ishladi");
07        }
08    }
09}

📝 Practice Exercises

🟢 Exercise 1 — Easy

Task:
Shape class yarating (name bilan), undan meros oluvchi Square class yarating (side bilan). Squarega area() metodini qo'shing.
Required Concepts:

• extends, super
  Hint:
  super(name)ni constructor ichida chaqirishni unutmang.

🟡 Exercise 2 — Medium

Task:
Employee class yarating (name, salary), getDetails() metodi bilan. Manager class'ini Employeedan meros qildirib, getDetails()ni override qiling — u ota-klassning natijasiga " (Menejer)" qo'shsin (super.getDetails()dan foydalaning).
Required Concepts:

• Inheritance
• Method overriding
• super
  Hint:
  return super.getDetails() + " (Menejer)";

🔴 Exercise 3 — Hard

Task:
Shape (abstrakt g'oyaviy ota-klass, area() metodi 0 qaytarsin) dan meros oluvchi Circle va Rectangle class'larini yarating, ikkalasida ham area()ni o'zicha override qiling. Bir nechta shakl'dan iborat array yarating va forEach bilan har birining maydonini polymorphism orqali chiqaring.
Required Concepts:

• Inheritance
• Polymorphism
• Method overriding
  Hint:
  Chapter 23.3'dagi hayvonlar misoliga o'xshab yozing.

🔮 Predict the Output

script.js
JavaScriptNusxalash
01class A {
02    greet() {
03        console.log("A dan salom");
04    }
05}
06 
07class B extends A {
08    greet() {
09        super.greet();
10        console.log("B dan salom");
11    }
12}
13 
14new B().greet();

🧠 Think first! Javobni ko'rishdan oldin kamida 30 soniya o'ylang.

<details> <summary>Answer</summary> A dan salom B dan salom

Why?
Bning greet() metodi avval super.greet() orqali Aning greet()ini chaqiradi ("A dan salom" chiqadi), keyin o'zining qo'shimcha kodini bajaradi ("B dan salom" chiqadi).

</details>

🐛 Debugging Challenge

Quyidagi kodda muammo bor:

script.js
JavaScriptNusxalash
01class Vehicle {
02    constructor(brand) {
03        this.brand = brand;
04    }
05}
06 
07class Car extends Vehicle {
08    constructor(brand, model) {
09        this.model = model;
10        super(brand);
11    }
12}
13 
14let car = new Car("Toyota", "Corolla");

Your Task:

• Kod ishga tushganda nima bo'lishini bashorat qiling.
• Nima uchun xatolik yuz berishini tushuntiring.
• Kodni tuzating.

<details> <summary>Solution</summary> Muammo: this.model = model — super(brand) chaqirilishidan oldin yozilgan. Lekin bola class'da this faqat super() chaqirilgandan keyin ishlatilishi mumkin (chunki thisni ota-klass "yaratadi").

Yechim: super() har doim constructor ichida birinchi qatorda chaqirilishi kerak:

script.js
JavaScriptNusxalash
01class Car extends Vehicle {
02    constructor(brand, model) {
03        super(brand);
04        this.model = model;
05    }
06}
07 
08let car = new Car("Toyota", "Corolla");

</details>

📌 Chapter Summary

• Inheritance (extends) — bir class boshqasining xususiyatlarini meros oladi.
• super() — ota-klass constructor'ini chaqirish uchun, bola constructor'ida majburiy va birinchi bo'lishi kerak.
• super.methodName() — ota-klassning metodini chaqirish uchun.
• Polymorphism — turli class'lar bir xil metod nomiga ega bo'lib, har biri o'zicha ishlaydi (method overriding orqali).
• JavaScript'da klassik method overloading mavjud emas.

🎯 Key Takeaways

• super() bola constructor'ida thisdan foydalanishdan oldin chaqirilishi shart.
• Method overriding — polymorphism'ning JavaScript'dagi asosiy amalga oshirilish usuli.
• Polymorphism orqali kod kengaytiriladigan bo'ladi — yangi class qo'shilganda, umumiy kodni o'zgartirish shart emas.
• extends — Prototype Chain mexanizmini "sahna orqasida" ishlatadi.
• JavaScript'da "overloading" o'rniga, metod ichida argumentlar sonini tekshirish ishlatiladi.

⚡ Quick Cheat Sheet

script.js
JavaScriptNusxalash
01class Animal {
02    constructor(name) {
03        this.name = name;
04    }
05    speak() {
06        console.log(`${this.name} ovoz chiqaradi`);
07    }
08}
09 
10class Dog extends Animal {
11    constructor(name) {
12        super(name); // majburiy, birinchi qatorda
13    }
14    speak() {
15        super.speak(); // ota-klass metodini chaqirish
16        console.log(`${this.name} vovullaydi`);
17    }
18}

---