0Pricing
TypeScript Academy · Lesson

TypeScript 5.1-5.2: Improved Inference

Explore setter/getter type independence and using declarations.

TypeScript 5.1-5.2: Improved Inference is a free TypeScript Academy lesson on CoddyKit — lesson 2 of 4. You can read the complete lesson below for free — then practise it hands-on in the browser with a built-in code editor and a 24/7 AI tutor. It is part of the TypeScript Academy learning path, one of 4 lessons in the course, and your progress syncs across the web and the CoddyKit app.

TypeScript 5.1 Overview

TypeScript 5.1 (released June 2023) improved setter/getter type independence, JSX element type flexibility, linked cursors in editors, and performance optimizations.

// npm install typescript@5.1

Setter/Getter Type Independence

Before 5.1, setter and getter had to use the same type. Now, a getter can return a wider type than the setter accepts — useful for coercion patterns.

class Temperature {
  get celsius(): string { return this._c + "°C"; } // string
  set celsius(value: string | number) {             // string | number
    this._c = Number(value);
  }
  private _c = 0;
}

undefined as JSX Children

TS 5.1 allows components to return undefined directly (in addition to null) from their render function, matching React 18 behavior.

// TS 5.1+: OK
function Widget(): undefined { return undefined; }
// Before 5.1: had to return null or JSX element

JSX Element Type Flexibility

New JSX.ElementType constraint gives more flexibility for custom JSX factories, useful for non-React environments.

// Custom JSX element types supported more naturally in 5.1

TypeScript 5.2 Overview

TypeScript 5.2 (released August 2023) introduced using declarations (Explicit Resource Management), decorator metadata, and array copy methods.

// npm install typescript@5.2

using Declarations

using implements the Explicit Resource Management proposal — the resource's [Symbol.dispose]() method is called when it goes out of scope.

// Requires lib: ["es2022", "esnext.disposable"]
function getConnection(): Disposable {
  const conn = openDb();
  return { [Symbol.dispose]() { conn.close(); } };
}

{
  using conn = getConnection();
  // conn.close() called automatically at block end
}

await using for Async Disposal

await using works like using but calls an async [Symbol.asyncDispose]() method, enabling async cleanup.

async function run() {
  await using db = await connectDb();
  // db[Symbol.asyncDispose]() called on exit
}

Decorator Metadata

TS 5.2 implements the TC39 decorator metadata proposal, letting decorators attach metadata via Symbol.metadata.

function meta(value: string) {
  return (_: unknown, ctx: DecoratorContext) => {
    ctx.metadata[ctx.name] = value;
  };
}

@meta("service")
class MyService {}
console.log((MyService as any)[Symbol.metadata]); // { "MyService": "service" }

Array Copy Methods

TS 5.2 added types for Array.prototype.toSorted, toReversed, toSpliced, and with — immutable array operations from ES2023.

const arr = [3, 1, 2];
const sorted = arr.toSorted(); // [1, 2, 3] — new array, arr unchanged
const reversed = arr.toReversed(); // [2, 1, 3]

Using in tsconfig for 5.2

To use using declarations, include the esnext.disposable lib in your tsconfig.

{
  "compilerOptions": {
    "target": "ES2022",
    "lib": ["ES2022", "ESNext.Disposable"]
  }
}

Recap: TS 5.1-5.2

TS 5.1: independent setter/getter types, undefined JSX returns. TS 5.2: using declarations for automatic resource cleanup, decorator metadata, and immutable array copy method types.

Quick Check

What does the using declaration do in TypeScript 5.2?

What You Learned

TS 5.1 brought independent getter/setter types and undefined JSX returns. TS 5.2 delivered using declarations for automatic resource management, decorator metadata, and ES2023 immutable array method types.

Frequently asked questions

Is the “TypeScript 5.1-5.2: Improved Inference” lesson free?

Yes — the full text of “TypeScript 5.1-5.2: Improved Inference” is free to read here on the web, and the TypeScript Academy course includes 4 lessons in total. To practise it interactively (a built-in code editor and a 24/7 AI tutor) and unlock the rest of the TypeScript Academy course, upgrade to CoddyKit PRO.

What will I learn in “TypeScript 5.1-5.2: Improved Inference”?

Explore setter/getter type independence and using declarations. You practise TypeScript Academy with hands-on code you run directly in the browser, and a 24/7 AI tutor answers your questions as you work through the lesson.

Do I need any experience to start TypeScript Academy?

No prior experience is required. TypeScript Academy on CoddyKit is structured for beginners through advanced learners; this is — lesson 2 of 4, so you can start here or from the beginning and move at your own pace.

How long does the “TypeScript 5.1-5.2: Improved Inference” lesson take?

Most CoddyKit lessons take about 5–10 minutes. Each one is bite-sized and interactive, so you make steady progress and pick up exactly where you left off across the web and the app.

Can I write and run code in this TypeScript Academy lesson?

Yes. Every TypeScript Academy lesson includes a built-in code editor, so you write and run real code right in your browser and get instant AI feedback — no local setup required.

All lessons in this course

  1. TypeScript 5.0: Decorators Standard and const Type Params
  2. TypeScript 5.1-5.2: Improved Inference
  3. TypeScript 5.3-5.4: New Narrowing and NoInfer
  4. TypeScript 5.5+: Isolated Declarations and Beyond
← Back to TypeScript Academy