TypeScript: Menerapkan Batasan Tipe Pengembalian dengan Validasi Enum

Memastikan Keamanan Jenis di API TypeScript yang Kompleks

Saat bekerja dengan Skrip Ketik dalam aplikasi yang kompleks, penting untuk memastikan bahwa setiap fungsi atau metode sesuai dengan struktur tipe yang ketat. Namun apa yang terjadi jika properti tambahan secara tidak sengaja ditambahkan ke objek yang dikembalikan? Seringkali, TypeScript mengabaikan masalah ini, membiarkan kode lewat tanpa peringatan. Hal ini dapat menyebabkan bug tersembunyi yang mungkin sulit dilacak nantinya.

Ambil contoh, skenario saat Anda merancang pengendali respons API. Jika tipe kembalian handler seharusnya hanya menyertakan kolom tertentu—misalnya, "test" dan "limit"—tetapi properti tambahan yang tidak diinginkan menyelinap masuk, hal ini dapat mengganggu fungsionalitasnya. Menerapkan batasan tipe yang ketat dapat menyelamatkan Anda dari hasil yang tidak diharapkan atau kesalahan runtime, terutama saat mengelola basis kode yang besar atau bersama. 😊

Pada artikel ini, kita akan mendalami contoh penyiapan API menggunakan skrip ketikan yang mencakup dua cakupan berbeda: "LIST" dan "GENERIC". Tiap cakupan memiliki struktur yang diharapkan, namun tantangannya adalah memastikan tidak ada kolom tambahan yang muncul dalam respons. Dengan menggunakan pemeriksaan tipe dan enum TypeScript yang canggih, kita dapat menerapkan aturan ini untuk memastikan kode yang bersih dan dapat diprediksi.

Ikuti terus untuk melihat bagaimana kita dapat membuat tipe yang kuat di TypeScript yang tidak hanya menentukan bentuk objek tetapi juga menerapkan batasan untuk mencegah penambahan yang tidak disengaja—memberikan perlindungan untuk basis kode yang lebih bersih dan andal. 🚀

Pelajari Lebih Dalam Penegakan Tipe TypeScript untuk Respons API

Di TypeScript, menerapkan pemeriksaan tipe yang ketat untuk respons API dapat membantu mendeteksi kesalahan lebih awal, terutama saat bekerja dengan tipe dan enum yang kompleks. Contoh skrip di atas dirancang untuk mengelola dua jenis respons API tertentu menggunakan Enum TypeScript untuk mendefinisikan struktur yang ketat. Dengan mengkategorikan respons ke dalam tipe “LIST” atau “GENERIC” menggunakan Tipe Cakupan enum, kami membuat kerangka kerja di mana setiap cakupan harus mengikuti struktur yang tepat. Hal ini sangat berguna ketika mendefinisikan fungsi seperti respons API yang mana setiap tipe respons memerlukan kolom unik—seperti kolom batas dalam tipe LIST yang tidak diperlukan dalam tipe GENERIC. Dalam praktiknya, hal ini memastikan properti tambahan apa pun, seperti “abc” yang tidak diharapkan dalam respons, ditangkap oleh TypeScript pada waktu kompilasi, mencegah masalah waktu proses dan menjaga aliran data yang lebih bersih di aplikasi kita.

Untuk mencapai hal ini, kami mendefinisikan dua antarmuka, DapatkanApiPropsGenerik Dan DapatkanDaftarApiProps, yang menentukan struktur untuk setiap respons cakupan. Itu alat peraga fungsi dalam antarmuka ini mengembalikan a Umum tipe atau a Daftar jenisnya, tergantung pada ruang lingkupnya. Tipe Generik bersifat fleksibel, memungkinkan struktur apa pun, namun tipe Daftar menambahkan struktur yang ketat membatasi bidang, memastikan respons LIST berisi properti ini. Kekuatan sebenarnya di sini adalah penegakan yang diberikan oleh tipe pembantu seperti TerapkanExactKeys, yang memungkinkan kita menentukan bahwa properti di objek kembalian harus sama persis dengan struktur yang diharapkan—tidak ada properti tambahan yang diizinkan. Pendekatan ini penting ketika mengelola proyek besar dengan banyak pengembang di mana pemeriksaan jenis seperti itu dapat mencegah kesalahan diam-diam. 👨‍💻

Jenis utilitas TerapkanExactKeys adalah kunci dalam pengaturan ini. Ia bekerja dengan membandingkan setiap kunci dalam struktur respons yang diharapkan untuk memastikan kunci tersebut sama persis dengan jenis respons sebenarnya. Jika ada kunci tambahan yang ditemukan, seperti “abc,” TypeScript akan memunculkan kesalahan waktu kompilasi. Tingkat pemeriksaan yang ketat ini dapat mencegah masalah yang hanya terjadi di bagian produksi. Dalam skrip di atas, penggunaan memvalidasiApiProps memastikan bahwa hanya properti tertentu yang diterima, menambahkan lapisan validasi sekunder. Itu memvalidasiApiProps fungsi bekerja dengan memilih jenis pengembalian yang berbeda berdasarkan cakupan yang disediakan, sehingga dapat beradaptasi sambil tetap menerapkan struktur. Penerapan tipe dua lapis ini, melalui EnforceExactKeys dan validasiApiProps, meningkatkan ketahanan basis kode TypeScript kami.

Untuk memastikan solusi kami tetap andal, pengujian unit ditambahkan untuk memverifikasi setiap konfigurasi. Menggunakan Jest, itu menggambarkan Dan tes fungsi membuat grup uji logis dan kasus uji individual. Itu mengharapkan(...).toThrowError() fungsi memeriksa apakah properti yang tidak valid, seperti “abc” dalam cakupan LIST, memicu kesalahan, menegaskan bahwa validasi struktur kami berfungsi. Misalnya, jika properti yang salah menyelinap ke dalam props, pengujian Jest akan menyoroti ini sebagai pengujian yang gagal, sehingga membantu pengembang memperbaiki masalahnya dengan segera. Dengan menguji setiap konfigurasi secara ketat, kami dapat yakin bahwa penyiapan TypeScript kami menangani setiap jenis respons dengan benar dan menghasilkan kesalahan yang sesuai untuk setiap inkonsistensi—membuat kode kami lebih aman, dapat diprediksi, dan kuat. 🚀

// Define an enum to control scope types
enum ScopeType { LIST = "LIST", GENERIC = "GENERIC" }

// Define the types expected for each scope
type Generic<T> = T;
type List<T> = T & { limit: number; };

// Define interfaces with specific return shapes for each scope
interface GetApiPropsGeneric<T> {
  props: (storeState: string) => Generic<T>;
  api: (args: Generic<T>) => void;
  type: string;
  scope: ScopeType.GENERIC;
}

interface GetApiPropsList<T> {
  props: (storeState: string) => List<T>;
  api: (args: List<T>) => void;
  type: string;
  scope: ScopeType.LIST;
}

// Helper type to enforce strict property keys in props function
type EnforceExactKeys<T, U> = U & { [K in keyof U]: K extends keyof T ? U[K] : never };

// Main API function with type check for enforced keys
const apiProps = <T extends unknown>(a: GetApiPropsList<T> | GetApiPropsGeneric<T>) => {
  console.log("API call initiated");
}

// Valid usage with enforced property types
type NewT = { test: string };
apiProps<NewT>({
  scope: ScopeType.LIST,
  props: (_) => ({ test: "1444", limit: 12 }),
  api: () => {},
  type: "example",
});

// Invalid usage, will produce a TypeScript error for invalid key
apiProps<NewT>({
  scope: ScopeType.LIST,
  props: (_) => ({ test: "1444", limit: 12, abc: "error" }), // Extra key 'abc'
  api: () => {},
  type: "example",
});

// Helper type that checks the shape against an exact match
type StrictShape<Expected> = {
  [K in keyof Expected]: Expected[K];
};

// Define the function with strict key control using the helper
function validateApiProps<T>(
  a: T extends { scope: ScopeType.LIST } ? GetApiPropsList<T> : GetApiPropsGeneric<T>
): void {
  console.log("Validated API props");
}

// Enforcing strict shape
validateApiProps<NewT>({
  scope: ScopeType.LIST,
  props: (_) => ({ test: "value", limit: 10 }),
  api: () => {},
  type: "correct",
});

// Invalid entry, causes error on extra property 'invalidProp'
validateApiProps<NewT>({
  scope: ScopeType.LIST,
  props: (_) => ({ test: "value", limit: 10, invalidProp: "error" }),
  api: () => {},
  type: "incorrect",
});

import { validateApiProps } from './path_to_script';
describe('validateApiProps', () => {
  test('allows correct shape for LIST scope', () => {
    const validProps = {
      scope: ScopeType.LIST,
      props: (_) => ({ test: "value", limit: 10 }),
      api: () => {},
      type: "correct",
    };
    expect(() => validateApiProps(validProps)).not.toThrow();
  });

  test('throws error on invalid property', () => {
    const invalidProps = {
      scope: ScopeType.LIST,
      props: (_) => ({ test: "value", limit: 10, invalidProp: "error" }),
      api: () => {},
      type: "incorrect",
    };
    expect(() => validateApiProps(invalidProps)).toThrowError();
  });
});

Strategi TypeScript untuk Menerapkan Tipe Pengembalian yang Tepat

Saat bekerja dengan skrip ketikan, mengelola tipe kembalian dengan batasan ketat membantu menerapkan struktur API yang dapat diprediksi, terutama dalam basis kode yang kompleks. Salah satu cara efektif untuk memastikan bahwa suatu fungsi hanya mengembalikan properti yang diizinkan adalah melalui jenis utilitas khusus yang menerapkan pencocokan tepat. Pendekatan ini sangat berguna ketika bekerja dengan REST API atau aplikasi kompleks dengan berbagai struktur respons, karena membantu menghindari penambahan objek respons yang tidak disengaja yang dapat menyebabkan kesalahan. Dengan membuat tipe utilitas umum, pengembang TypeScript dapat memverifikasi bahwa setiap respons API mematuhi struktur yang diharapkan, sehingga menambah ketahanan pada panggilan API dan penanganan respons.

Dalam skenario seperti ini, conditional types menjadi penting, memungkinkan dilakukannya pemeriksaan pada bentuk objek dan memastikan bahwa properti tambahan, seperti yang tidak diinginkan abc kuncinya, jangan dimasukkan ke dalam tanggapan. TypeScript menawarkan alat canggih untuk tujuan ini, termasuk mapped types Dan conditional types yang memvalidasi nama dan tipe properti terhadap struktur yang telah ditentukan sebelumnya. Dengan tipe yang dipetakan, pengembang dapat menerapkan pencocokan tipe yang tepat, sementara tipe kondisional dapat memodifikasi struktur pengembalian berdasarkan tipe input yang diberikan. Menggabungkan strategi-strategi ini membantu memastikan bahwa fungsi berperilaku konsisten di berbagai cakupan dan respons API.

Selain itu, mengintegrasikan kerangka pengujian seperti Jest memungkinkan pengembang memverifikasi batasan TypeScript dengan pengujian unit, memastikan bahwa kode berfungsi seperti yang diharapkan di berbagai skenario. Misalnya, jika properti yang bukan milik tipe yang diharapkan muncul, pengujian Jest dapat segera menyoroti masalah ini, sehingga pengembang dapat mendeteksi kesalahan di awal siklus pengembangan. Penggunaan penerapan tipe statis dan pengujian dinamis memungkinkan tim menghasilkan aplikasi yang aman dan andal yang dapat menangani pemeriksaan tipe yang ketat, memberikan respons API yang lebih stabil, dan meningkatkan kemampuan pemeliharaan. 🚀