Menggabungkan dua jenis fungsi dengan & (ampersand) di TypeScript (persimpangan)

25 Agustus 2023 [Programming, Tech, TypeScript]

Menggabungkan antarmuka/objek dengan &

Saat Anda menggabungkan dua jenis dalam naskah dengan & (ampersand), itu disebut tipe persimpangan.

Misalnya:

interface Particle {
    mass: number;
}

interface Wave {
    wavelength: number;
}

type Both = Particle & Wave;

Jenis baru keduanya adalah partikel dan gelombang, sehingga memiliki massa sifat dan panjang gelombang.

Jika Anda menggabungkan tipe dengan |, membuat jenis serikat, seperti ini:

type Either = Particle | Wave;

Maka tipe baru itu akan berupa partikel atau gelombang, bukan keduanya. Untuk menggunakannya, Anda perlu mencari tahu yang mana, sebelum mengakses hanya properti (massa atau panjang gelombang) yang sekarang Anda ketahui ada, dan bukan yang lain.

Menggabungkan fungsi dengan &

Ini semua baik -baik saja, dan relatif mudah dimengerti, tetapi bagaimana dengan ketika Anda menggabungkan jenis fungsi dengan cara ini?

type TakesString = (s: string) => void;
type TakesNumber = (n: number) => void;
type TakesStringOrNumber = TakesString & TakesNumber;

Sekarang Anda memiliki tipe yang baik Takesstring dan TakeNumber, yang berarti fungsi yang dapat melakukan kedua hal, yang berarti dibutuhkan string atau angka sebagai argumen. Saya dapat membuat sesuatu yang memiliki tipe seperti ini:

const f: TakesStringOrNumber = (x: string | number) => {console.log(x);};

Perhatikan bagaimana | Simbol menyelinap ke sana? Untuk memenuhi & pada jenis fungsi, jenis argumen menggunakan |. Ketika dua hal memiliki hubungan yang berlawanan seperti ini, kadang -kadang dikenal sebagai bertentangan.

Itu harus seperti ini: agar fungsi menjadi TakessTring dan mengambil nomor argumen yang harus menjadi string atau angka.

Berfungsi dengan tipe literal

Jika fungsi Anda mengambil tipe literal, ini bisa menjadi lebih membingungkan:

type TakesTrue = (success: true) => void;
type TakesFalse = (success: false) => void;

Argumen apa pun yang Anda lewati ke fungsi yang takepestrue harus benar. Demikian pula, untuk memanggil fungsi yang mengambil FalSe Anda harus lulus dalam false. Typescript memungkinkan Anda melakukan ini, yang menyenangkan.

Jadi sekarang bayangkan Anda menggabungkan tipe ini:

type TakesEither = TakesTrue & TakesFalse;

Sekarang, Takese keduanya takeTestrue dan TakeFalse sehingga dapat dianggap benar atau salah.

Mari membuat fungsi yang bisa melakukan itu:

const f: TakesEither = (success: boolean) => { console.log(`${success}`); };

Ini berhasil – f mengambil boolean, jadi itu memang memungkinkan Anda untuk lulus benar atau salah, seperti yang diharuskan menjadi takese.

Apa yang aneh, adalah bahwa Anda tidak dapat melakukan ini:

let x: boolean = new Date().getHours > 12;
f(x); // Compile error

(Abaikan tanggal – x hanyalah boolean yang mungkin benar atau salah.)

Inilah kesalahan kompilasi:

index.ts:9:7 - error TS2769: No overload matches this call.
  Overload 1 of 2, '(success: true): void', gave the following error.
    Argument of type 'boolean' is not assignable to parameter of type 'true'.
  Overload 2 of 2, '(success: false): void', gave the following error.
    Argument of type 'boolean' is not assignable to parameter of type 'false'.

Masalahnya adalah bahwa kompiler hanya tahu bahwa f adalah takeseither, yang berarti bahwa itu adalah fungsi yang mengambil benar atau fungsi yang mengambil salah. Tidak tahu bahwa F dapat mengambil boolean (meskipun di sini bisa!).

Kode ini berhasil:

let x: boolean = new Date().getHours() > 12;
if (x) {
    f(x); // OK
} else {
    f(x); // OK
}

Mengapa? Karena di dalam bagian pertama IF, kompiler tahu bahwa X itu benar, sehingga dapat memanggil F dengan itu, karena F dapat menjadi kenyataan sebagai argumen. Demikian pula di babak kedua, ia tahu X salah.

Di masa depan, kompiler mungkin menumbuhkan kemampuan untuk menangani pekerjaan dalam kasus pertama, tetapi pada saat penulisan, kami melihat kesalahan ini.

Keren, ya?

(Terima kasih kepada JCALZ untuk jawaban StackOverflow ini yang membantu saya sedikit memahami ini: Jenis fungsi persimpangan naskah.)