लोड हो रहा है...

क्लास इनहेरिटेंस

TeaOrder, Order की साझा तैयारी लेता है और चाय के लिए extra जोड़ता है; इसलिए हर चीज़ फिर से लिखनी नहीं पड़ती।

कुकी से ऑब्जेक्ट तक

पिछले उदाहरण की पंक्ति theme / dark थी। यहाँ browser text नहीं, memory में नए object बनते हैं।

parent का हिस्सा

Order को drink और size मिलते हैं। उसकी label method सभी orders के लिए दो हिस्सों वाली पंक्ति बनाती है।

Parent order

javascript
class Order {
constructor(drink, size) {
this.drink = drink;
this.size = size;
}
label() {
return this.drink + " / " + this.size;
}
}
const order = new Order("tea", "regular");
console.log(order.label());

console में tea / regular आता है। order instanceof Order true है और method prototype पर साझा रहती है।

child की शुरुआत

extends Order child को parent से जोड़ता है। child constructor पहले inherited भाग बनाता है।

Child order

javascript
class Order {
constructor(drink, size) {
this.drink = drink;
this.size = size;
}
label() {
return this.drink + " / " + this.size;
}
}
class TeaOrder extends Order {
constructor(drink, size, extra) {
super(drink, size);
this.extra = extra;
}
}
const tea = new TeaOrder("tea", "regular", "mint");
console.log(tea.drink);
console.log(tea.extra);

tea और फिर mint log होते हैं। super से पहले this.extra लिखने पर ReferenceError मिलता है।

बदलें, दोहराएँ नहीं

TeaOrder अपनी label दे सकता है, मगर super.label() से drink और size की तैयार पंक्ति ले लेता है।

Full tea label

javascript
class Order {
constructor(drink, size) {
this.drink = drink;
this.size = size;
}
label() {
return this.drink + " / " + this.size;
}
}
class TeaOrder extends Order {
constructor(drink, size, extra) {
super(drink, size);
this.extra = extra;
}
label() {
return super.label() + " / " + this.extra;
}
}
console.log(new TeaOrder("tea", "regular", "mint").label());

पूरा परिणाम tea / regular / mint है। वही object instanceof TeaOrder और instanceof Order दोनों है।

छोटी family

Order हर order की बात संभालता है; TeaOrder केवल tea वाली बात जोड़ता है। सिर्फ value का नाम बदलने के लिए child न बनाएँ।

page पर text

demo TeaOrder बनाता है और overridden label को page में रखता है।

Page demo — inherited order

html
<!DOCTYPE html>
<html>
<body>
<p id="line">…</p>
<script>
class Order {
constructor(drink, size) {
this.drink = drink;
this.size = size;
}
label() {
return this.drink + " / " + this.size;
}
}
class TeaOrder extends Order {
constructor(drink, size, extra) {
super(drink, size);
this.extra = extra;
}
label() {
return super.label() + " / " + this.extra;
}
}
document.querySelector("#line").textContent =
new TeaOrder("tea", "regular", "mint").label();
</script>
</body>
</html>

दिखने वाली पंक्ति tea / regular / mint है। theme / dark cookies से था और tea / regular सिर्फ parent का परिणाम था।

खुद करें

Order बनाएँ, फिर mint वाला TeaOrder। this.extra से पहले super रखें और super.label() बढ़ाएँ।

आम चूक

super से पहले this न लें, parent label पूरा copy न करें, और child का Order होना न भूलें।

याद रखें

extends रिश्ता बनाता है; super(...) parent हिस्सा तैयार करता है; override अपना छोटा detail जोड़ता है।

🧠 अपने ज्ञान की परीक्षा करें

शुरू करने के लिए तैयार

अपने ज्ञान की परीक्षा करें

इस इंटरैक्टिव क्विज़ के साथ अपनी चुनौती लें और देखें कि आप विषय को कितनी अच्छी तरह समझते हैं

❓
5
प्रश्न
🎯
70%
पास करने के लिए
♾️
∞
समय
🔄
∞
प्रयास

📝 निर्देश

  • हर प्रश्न को ध्यान से पढ़ें
  • हर प्रश्न के लिए सबसे अच्छा उत्तर चुनें
  • आप जितनी बार चाहें क्विज़ दोबारा दे सकते हैं
  • आपकी प्रगति शीर्ष पर दिखाई जाएगी