TypeScript Academy · Lezione

TypeScript 5.0: decorator standard e parametri di tipo const

Utilizzi la nuova proposta per i decorator e i parametri generici const.

Lezione 1 di 413 passaggi

TypeScript 5.0: decorator standard e parametri di tipo const è una lezione TypeScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento TypeScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso TypeScript Academy include 4 lezioni in totale.

Panoramica di TypeScript 5.0

TypeScript 5.0 ha introdotto la proposta standardizzata di decorator TC39 (Stage 3), i parametri di tipo const, la nuova sintassi dei moduli verbatim e significativi miglioramenti delle prestazioni.

// TS 5.0 release: March 2023
// npm install typescript@5

Decorator Stage 3

TS 5.0 implementa la proposta ufficiale TC39 per i decorator Stage 3, diversa dai decorator sperimentali legacy. Non è più necessario experimentalDecorators: true.

// New standard decorator — no experimentalDecorators flag needed
function logged(target: Function, ctx: ClassDecoratorContext) {
  return class extends (target as any) {
    constructor(...args: any[]) {
      console.log("Creating", target.name);
      super(...args);
    }
  };
}

@logged
class User { constructor(public name: string) {} }

Oggetto di contesto dei decorator

I nuovi decorator ricevono un oggetto tipizzato ClassDecoratorContext o MethodDecoratorContext con i metadati relativi all'elemento decorato.

function sealed(_: Function, ctx: ClassDecoratorContext) {
  ctx.addInitializer(function(this: any) {
    Object.seal(this);
  });
}

Decorator di metodo in TS 5.0

I decorator di metodo ricevono il metodo e un ClassMethodDecoratorContext, che sostituisce la vecchia firma (target, key, descriptor).

function measure(_: Function, ctx: ClassMethodDecoratorContext) {
  return function(this: any, ...args: any[]) {
    const start = performance.now();
    const result = (_.apply as any)(this, args);
    console.log(ctx.name, performance.now() - start, "ms");
    return result;
  };
}

Parametri di tipo const

const applicato a un parametro di tipo fa sì che TypeScript inferisca i tipi letterali degli argomenti invece di ampliarli al tipo di base.

function identity<const T>(val: T): T { return val; }
const a = identity("hello");      // type: "hello" (not string)
const b = identity([1, 2, 3]);    // type: readonly [1, 2, 3]

Generics const e as const

I parametri di tipo const applicano automaticamente l'effetto di restringimento: chi effettua la chiamata non deve aggiungere as const in ogni punto di chiamata.

// Without const param: callers need as const
function makeRoute<T extends string>(path: T) { return path; }
const r1 = makeRoute("/home" as const); // "/home"

// With const param: automatic
function makeRoute2<const T extends string>(path: T) { return path; }
const r2 = makeRoute2("/home"); // "/home" — no as const needed

Risoluzione dei moduli per bundler

TS 5.0 ha aggiunto moduleResolution: "bundler" per i progetti che usano Vite, esbuild o bundler simili, che gestiscono autonomamente la risoluzione dei moduli.

{
  "compilerOptions": {
    "module": "ESNext",
    "moduleResolution": "bundler"
  }
}

verbatimModuleSyntax

verbatimModuleSyntax: true impone l'uso di import type per le importazioni di soli tipi, impedendo che finiscano accidentalmente nelle importazioni a runtime.

// tsconfig.json
{ "compilerOptions": { "verbatimModuleSyntax": true } }

// Now this errors: must be import type
import { User } from "./types"; // Error if User is only a type
import type { User } from "./types"; // OK

Miglioramenti delle prestazioni

TS 5.0 ha migliorato la memorizzazione nella cache dell'istanziazione dei tipi e le prestazioni del narrowing, rendendo più veloci i progetti di grandi dimensioni senza modifiche al codice.

# TS 5.0 compile benchmarks: ~10-15% faster on large projects

Migrare dai decorator legacy

I decorator legacy experimentalDecorators funzionano ancora, ma in futuro saranno deprecati. Esegua la migrazione ai decorator TC39 per garantire la compatibilità futura.

// Legacy: requires experimentalDecorators: true
@Component({ selector: "app-root" })
class AppComponent {}

// New TC39 decorator: no flag needed (but Angular/NestJS need updates)

Riepilogo: TypeScript 5.0

TypeScript 5.0 ha introdotto i decorator standard TC39, i parametri di tipo const per l'inferenza automatica dei tipi letterali, moduleResolution: "bundler", verbatimModuleSyntax e significativi miglioramenti delle prestazioni.

Verifica rapida

Che cosa fa const applicato a un parametro di tipo?

Rispondi nella lezione interattiva

Cosa ha imparato

TypeScript 5.0: i decorator standard TC39 sostituiscono quelli sperimentali, i parametri di tipo const restringono automaticamente gli argomenti ai tipi letterali, moduleResolution: "bundler" supporta gli strumenti di build moderni e verbatimModuleSyntax impone l'uso di import type.

Gratis per iniziare

Impara TypeScript con un tutor IA — gratis

Scrivi ed esegui vero codice nel tuo browser, ricevi aiuto istantaneo da un tutor IA disponibile 24/7, e riprendi da dove hai lasciato sul web o nell'app.

Corsi: 101
Lezioni: 352

Inizia a imparare gratis Visualizza il corso completo

Domande Frequenti

La lezione «TypeScript 5.0: decorator standard e parametri di tipo const» è gratuita?

Sì — il testo completo di «TypeScript 5.0: decorator standard e parametri di tipo const» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso TypeScript Academy, passa a CoddyKit PRO. Il corso TypeScript Academy include 4 lezioni in totale.

Cosa imparerò in «TypeScript 5.0: decorator standard e parametri di tipo const»?

Utilizzi la nuova proposta per i decorator e i parametri generici const. Eserciti TypeScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare TypeScript Academy?

Non è richiesta alcuna esperienza precedente. TypeScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.

Quanto tempo richiede la lezione «TypeScript 5.0: decorator standard e parametri di tipo const»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione TypeScript Academy?

Sì. Ogni lezione TypeScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

TypeScript 5.0: decorator standard e parametri di tipo const
TypeScript 5.1-5.2: inferenza migliorata
TypeScript 5.3-5.4: nuovo narrowing e NoInfer
TypeScript 5.5+: dichiarazioni isolate e novità

← Torna a TypeScript Academy