What is a mapped type?

Learn mapped types that iterate over types.

What is a mapped type?

A mapped type iterates over all properties of a type and transforms each one. The syntax [K in keyof T] produces a property for each key K of T. The type expression on the right produces the new type by playing with the original value type T[K].

type Ayni<T> = {
  [K in keyof T]: T[K];
};
// Every property of T is copied
// with the same type

The power of mapped types

A mapped type takes a type and transforms each of its properties by the same rule. It can change the value type, add readonly, or make properties optional with ?. This is the foundation of built-in utility types like Partial and Readonly; you can write them yourself.

Exercise Make all values string

Write the mapped type MetinYap<T> as { [K in keyof T]: string }. Define interface Ayar with tema: string and ses: number. Define type AyarMetin as MetinYap<Ayar>. Assign { tema: "koyu", ses: "acik" } to a variable a (of type AyarMetin). Print a.tema with console.log.

Show example solution

type MetinYap<T> = {
  [K in keyof T]: string;
};
interface Ayar {
  tema: string;
  ses: number;
}
type AyarMetin = MetinYap<Ayar>;
const a: AyarMetin = { tema: "koyu", ses: "acik" };
console.log(a.tema);

Test yourself

What does the mapped type below do?
```
type NumYap<T> = { [K in keyof T]: number };
```
- Makes all of T's properties readonly
- Converts all of T's properties to number
- Removes all of T's properties
- Makes all of T's properties optional
Show answer

Converts all of T's properties to number — Since the right-hand type is number, each property K gets a number value type. Property names come from T but the value type becomes number.

Mapped type body

type Dize<T> = {
  [K in ____]: string;
};

Show answer

type Dize<T> = {
  [K in keyof T]: string;
};

Mapped type parts

[K in keyof T]

Iterates over T's properties
T[K]

Original property's value type
: string

New value type
type NumYap<T>

Mapped type alias

Next lesson: Readonly mapped type

We Are Enhancing Your Experience

Cookie Preferences

Strictly Necessary Cookies

Analytical Cookies