Decorators का परिचय
In this page:
function decoratorName(target: any, context: ClassMethodDecoratorContext) {
// wrap or inspect the decorated member
}
class ClassName {
@decoratorName
methodName() { }
}Decorator क्या है?
एक decorator एक function है जो @ syntax से directly एक class, method, property, या parameter के ऊपर apply होता है; यह उस declaration के बारे में information receive करता है जिससे यह attached है और इसे observe या modify कर सकता है।
उदाहरण: What Is a Decorator?
function logged(target: any, context: ClassMethodDecoratorContext) {
console.log(`Decorator applied to ${String(context.name)}`);
}
class Greeter {
@logged
greet() {
return "hi";
}
}
new Greeter().greet();Decorator Syntax
Decorators उस declaration से immediately पहले लिखे जाते हैं जिसे वे decorate करते हैं, और एक ही declaration पर कई decorators stack किए जा सकते हैं, एक specific, well-defined order में apply होते हुए।
उदाहरण: Decorator Syntax
function first(target: any, ctx: ClassMethodDecoratorContext) {
console.log("first decorator on", String(ctx.name));
}
function second(target: any, ctx: ClassMethodDecoratorContext) {
console.log("second decorator on", String(ctx.name));
}
class Example {
@first
@second
run() {}
}
new Example().run();Decorator Context
Standard decorators एक context object receive करते हैं जो describe करता है कि क्या decorate किया जा रहा है — इसका kind, name, और दूसरी metadata — जिसे decorator यह decide करने के लिए उपयोग कर सकता है कि कैसे behave करे।
उदाहरण: Decorator Context
function describe(target: any, context: ClassMethodDecoratorContext) {
console.log("Decorating", context.kind, String(context.name));
}
class Service {
@describe
start() {}
}
new Service();Decorated Values Replace करना
कुछ decorators एक compatible replacement value return कर सकते हैं; method decorators, उदाहरण के लिए, आमतौर पर original method का एक wrapped version return करते हैं जो call के around logging जैसा behavior जोड़ता है।
उदाहरण: Replacing Decorated Values
function logCall(target: any, context: ClassMethodDecoratorContext) {
return function (this: any, ...args: any[]) {
console.log("Calling", String(context.name));
return target.call(this, ...args);
};
}
class Calculator {
@logCall
add(a: number, b: number) {
return a + b;
}
}
console.log(new Calculator().add(2, 3));Modern Decorators Enable करना
Current TypeScript में, standard decorators legacy experimentalDecorators compiler flag की ज़रूरत के बिना काम करते हैं, older, non-standard implementation के बजाय newer, TC39-aligned decorators proposal follow करते हुए।
उदाहरण: Enabling Modern Decorators
// Modern (TC39) decorators work without experimentalDecorators:
function marker(target: any, context: ClassMethodDecoratorContext) {}
class Widget {
@marker
render() {
return "rendered";
}
}
console.log(new Widget().render());- सही compiler setup के बिना decorators उपयोग करना, क्योंकि legacy decorators को
experimentalDecoratorsचाहिए जबकि standard वाले newer signature expect करते हैं। - standard decorators के under old
(target, key, descriptor)signature के साथ एक decorator लिखना, जहां यह(value, context)receive करता है। - यह मानना कि
@loggedहर बार method call होने पर run होता है, जब decorator function class define होते समय एक बार run होता है।
Chapter Quiz — Complete all 7 topics to unlock
0/7 topics done
Complete these topics first: