Language 7 of 10 · Topic 0.7

Decorators (Stage 3 TC39 / TS 5.0+) & Metadata Reflection

1Concept

TypeScript 5.0+ supports standard TC39 Stage 3 Decorators on classes, methods, and accessors without experimental flags.

2Architecture Diagram

@loggedMethod
calculate() { ... }

3Code Example

Stage 0 Language Foundations
function loggedMethod(target: any, context: ClassMethodDecoratorContext) {
    const methodName = String(context.name);
    return function (this: any, ...args: any[]) {
        console.log(`[LOG] Entering ${methodName} with args:`, args);
        const result = target.call(this, ...args);
        console.log(`[LOG] Exiting ${methodName}`);
        return result;
    };
}

class MathService {
    @loggedMethod
    add(a: number, b: number): number {
        return a + b;
    }
}

const service = new MathService();
console.log(`Result: ${service.add(10, 20)}`);

4Expected Output

[LOG] Entering add with args: [ 10, 20 ]
[LOG] Exiting add
Result: 30

5Key Takeaways

  • ✓TS 5.0 decorators use standard TC39 ClassMethodDecoratorContext specifications.
  • ✓Decorators add cross-cutting concerns (logging, validation, caching) cleanly.
  • ✓Runs natively without experimentalDecorators flag.