JS क्लासेस
किसी घर के architectural blueprint के बारे में सोचें, blueprint खुद कोई घर नहीं है जिसमें आप रह सकें, पर यह ठीक-ठीक बताता है कि एक कैसे बनाया जाए, और आप उसी blueprint से कई individual घर बना सकते हैं, हर एक का अपना address पर वही layout।
JavaScript में एक class वही blueprint है, एक template जो बताता है कि उससे बना हर object कौन सी properties और methods रखेगा, और किसी class से बनाए गए हर individual object को instance कहते हैं।
Classes बड़े applications को organize करने में मदद करती हैं, जैसे cookiescursor.com जैसी किसी चीज़ को चलाने वाले codebase में किसी Tutorial या User को consistently model करना।
In this page:
Syntax
class ClassName {
constructor(parameter) {
this.property = parameter;
}
methodName() {
// body
}
}
const object = new ClassName(argument);Class Syntax और Constructor
एक class को class keyword से declare किया जाता है, और उसका constructor method तब अपने आप चलता है जब new से कोई नया instance बनाया जाता है, जिसका इस्तेमाल आमतौर पर instance की शुरुआती properties सेट करने के लिए होता है।
Note:
constructor parameters स्वीकार करने और उन्हें this को assign करने की स्वाभाविक जगह है, जो हर instance की शुरुआती state तय करता है।
Warning:
एक class में सिर्फ एक ही constructor method हो सकता है, दूसरा define करने पर syntax error आता है।
उदाहरण: Class Syntax and the Constructor
// Define the class `User`
// Define the class `User`
class User {
// Constructor taking `name`, runs when a new instance is created
// Constructor taking `name`, runs when a new instance is created
constructor(name) {
// Assign `name` to `this.name`
// Assign `name` to `this.name`
this.name = name;
}
}
// Declare the constant `u` as a new `User` instance
// Declare the constant `u` as a new `User` instance
const u = new User("Sam");
// Print `u.name` to the console
// Print `u.name` to the console
console.log(u.name);Methods
class के अंदर defined methods उससे बनाए गए हर instance पर उपलब्ध हो जाते हैं, जिससे class से बना हर object उस code को duplicate किए बिना एक जैसा व्यवहार साझा करता है।
Note:
Class methods बिना function keyword के लिखे जाते हैं, object literals में shorthand methods की तरह।
Warning:
class पर defined methods सभी instances में साझा होते हैं, वे instance-specific data को तब तक access नहीं कर सकते जब तक this के ज़रिए reference न किया जाए।
उदाहरण: Methods
// Define the class `User`
// Define the class `User`
class User {
constructor(name) { this.name = name; }
greet() { console.log(`Hi, ${this.name}`); }
}
// Create a new `User` instance with `"Amit").greet(`
// Create a new `User` instance with `"Amit").greet(`
new User("Amit").greet();extends और super से Inheritance
extends एक class को दूसरी पर बनने देता है, उसकी properties और methods inherit करते हुए, और किसी subclass के constructor के अंदर super() parent class के constructor को कॉल करता है, जिसे this इस्तेमाल होने से पहले चलना ही होगा।
Note:
एक subclass सिर्फ उसी नाम का एक method define करके parent method को override कर सकता है, और अगर उसे original व्यवहार भी चाहिए तो super.methodName() भी कॉल कर सकता है।
Warning:
किसी subclass constructor में सबसे पहली line के रूप में super() कॉल करना भूल जाना, this इस्तेमाल होने से पहले ही एक ReferenceError देता है।
उदाहरण: Inheritance With extends and super
// Define the class `Animal`
// Define the class `Animal`
class Animal {
constructor(name) { this.name = name; }
}
// Define the class `Dog`, inheriting from `Animal`
// Define the class `Dog`, inheriting from `Animal`
class Dog extends Animal {
// Constructor taking `name`, runs when a new instance is created
// Constructor taking `name`, runs when a new instance is created
constructor(name) {
// Call `super(name)`
// Call `super(name)`
super(name);
}
bark() { console.log(`${this.name} says woof`); }
}
// Create a new `Dog` instance with `"Rex").bark(`
// Create a new `Dog` instance with `"Rex").bark(`
new Dog("Rex").bark();Static Methods
एक static method individual instances के बजाय class से ही संबंधित होता है, इसे सीधे class name पर कॉल किया जाता है, और आमतौर पर ऐसे utility functions के लिए इस्तेमाल होता है जो class से जुड़े तो हैं पर किसी खास instance के data से बंधे नहीं।
Note:
Static methods factory-style functions के लिए एक स्वाभाविक जगह हैं जो class के नए instances बनाकर return करते हैं।
Warning:
एक static method instance properties तक पहुंचने के लिए this access नहीं कर सकता, क्योंकि यह कभी किसी असली instance पर कॉल ही नहीं होता।
उदाहरण: Static Methods
// Define the class `MathUtil`
// Define the class `MathUtil`
class MathUtil {
static double(n) { return n * 2; }
}
// Print `MathUtil.double(5)` to the console
// Print `MathUtil.double(5)` to the console
console.log(MathUtil.double(5));Getters और Setters
get और set ऐसे special methods define करते हैं जो किसी property के पढ़े या assign होने पर अपने आप चलते हैं, जिससे आप पढ़ते समय कोई derived value calculate कर सकते हैं या store होने से पहले किसी value को validate कर सकते हैं, जबकि calling code फिर भी साधारण property syntax ही इस्तेमाल करता है।
Note:
Getters computed properties के लिए बढ़िया हैं, जैसे first और last name को मिलाना, बिना उस combination को एक अलग, duplicated field के रूप में store किए।
Warning:
एक जैसे नाम वाले getter और setter को अपने अंदर उसी identical नाम को सीधे पढ़ना या लिखना नहीं चाहिए, ऐसा करने से infinite recursion होता है।
उदाहरण: Getters and Setters
// Define the class `Circle`
// Define the class `Circle`
class Circle {
constructor(radius) { this._radius = radius; }
get area() { return Math.PI * this._radius ** 2; }
set radius(value) { this._radius = value; }
}
// Declare the constant `c` as a new `Circle` instance
// Declare the constant `c` as a new `Circle` instance
const c = new Circle(2);
// Print `c.area` to the console
// Print `c.area` to the console
console.log(c.area);Live Example
Related Topics
{# common_mistakes/chapter_summary/browser_support: on Hindi pages the
view already swaps in the hi_ translation fields (or blanks these
out if untranslated), so this renders correctly for both languages
without a lang_code check here. #}
आम गलतियां
- किसी subclass के constructor में this इस्तेमाल करने से पहले super() कॉल करना भूल जाना, जो किसी दूसरी class को extend करने वाली किसी भी class में error throw करता है।
- किसी class को new के बिना सीधे एक function की तरह कॉल करने की कोशिश करना, class functions को एक instance बनाने के लिए खासतौर पर new keyword चाहिए।
- static methods, जो class पर खुद कॉल होते हैं, को regular methods, जो class से बने instances पर कॉल होते हैं, से confuse करना।
चैप्टर सारांश
- एक class एक constructor और methods define करती है जो उससे new से बने हर object, जिसे instance कहते हैं, के बीच shared होते हैं।
- extends और super inheritance enable करते हैं, एक class को किसी दूसरी की behavior पर build करने और reuse करने देते हुए।
- static methods class को खुद belong करते हैं, जबकि getters और setters आपको control करने देते हैं कि properties कैसे पढ़ी और assign की जाती हैं।
ब्राउज़र सपोर्ट
Classes को 2015 से सभी major browsers में support मिला है और यह modern JavaScript का पूरी तरह standard, widely used हिस्सा है।
🔒
Chapter Quiz — Complete all 26 topics to unlock
0/26 topics done
Complete these topics first:
- JS Dates
- JS Math
- JS Conditionals
- JS Switch
- JS Loop For
- JS Loop While
- JS Iterables
- JS Sets
- JS Maps
- JS typeof
- JS Type Conversion
- JS Destructuring
- JS Arrow Functions
- JS Classes
- JS Modules
- JS Promises
- JS Async/Await
- JS DOM
- JS DOM Methods
- JS Events Advanced
- JS DOM Navigation
- JS DOM Collections
- JS Async Callbacks
- JS Async Parallel
- JS Date Set
- JS Set Logic