Extending Type di Typescript

Hadie Danker
sebulan yang lalu
TypeScript

Gunakan tipe intersection untuk mengekstend type di TypeScript, misal. type TypeB = TypeA & {age: number;}.

Jenis intersection didefinisikan menggunakan ampersand & dan digunakan untuk menggabungkan jenis objek yang ada.

Anda dapat menggunakan operator & sebanyak yang diperlukan untuk membangun sebuah type.

tsx
1
type TypeA = {
2
name: string;
3
};
4
5
type TypeB = TypeA & {
6
age: number;
7
};
8
9
type TypeC = TypeB & {
10
country: string;
11
};
12
13
const example: TypeC = {
14
name: 'Tom',
15
age: 30,
16
country: 'Chile',
17
};

Intersection types di definisikan dengan symbol & untuk menggabungkan 2 type

tsx
1
type TypeA = {
2
name: string;
3
};
4
5
type TypeB = {
6
age: number;
7
country: string;
8
};
9
10
type TypeC = TypeA & TypeB;
11
12
const example: TypeC = {
13
name: 'Tom',
14
age: 30,
15
country: 'Chile',
16
};

Dengan & kita juga bisa menggabungkan type dan interface

contoh

tsx
1
type TypeA = {
2
name: string;
3
age: number;
4
};
5
6
interface InterfaceA {
7
country: string;
8
}
9
10
type TypeB = TypeA & InterfaceA;
11
12
const example: TypeB = {
13
name: 'Tom',
14
age: 30,
15
country: 'Chile',
16
};

Kita juga bisa mengekstend dengan keyword extends

tsx
1
type TypeA = {
2
name: string;
3
country: string;
4
};
5
6
interface InterfaceA extends TypeA {
7
age: number;
8
}
9
10
const example: InterfaceA = {
11
name: 'Tom',
12
age: 30,
13
country: 'Chile',
14
};

Jika ingin menggabungkan type menggunakan fungsi extends, pisahkan dengan tanda koma

tsx
1
type TypeA = {
2
name: string;
3
};
4
5
type TypeB = {
6
country: string;
7
};
8
9
interface InterfaceA extends TypeA, TypeB {
10
age: number;
11
}
12
13
const example: InterfaceA = {
14
name: 'Tom',
15
age: 30,
16
country: 'Chile',
17
};

Jadi kesimpulanya, untuk mengekstend atau menggabungkan 2 type pada typescript, kita bisa menggunakan simbol & dan juga fungsi extends pada interface