Ciri TypeScript canggih untuk Menambahkan Pembangunan Anda-tutorial js-php.cn

dvanced TypeScript Features to Supercharge Your Development

Sebagai pengarang terlaris, saya menjemput anda untuk menerokai buku saya di Amazon. Jangan lupa ikuti saya di Medium dan tunjukkan sokongan anda. terima kasih! Sokongan anda bermakna dunia!

TypeScript telah merevolusikan cara kami menulis aplikasi JavaScript. Sebagai pembangun yang telah bekerja secara meluas dengan TypeScript, saya mula menghargai kuasanya dalam mencipta aplikasi yang teguh, boleh diselenggara dan berskala. Dalam artikel ini, saya akan berkongsi pengalaman dan pandangan saya tentang tujuh ciri TypeScript lanjutan yang boleh meningkatkan proses pembangunan anda dengan ketara.

Pengawal Jenis ialah alat berkuasa dalam TypeScript yang membolehkan kami mengecilkan jenis dalam blok bersyarat. Ia amat berguna apabila bekerja dengan jenis kesatuan atau apabila kita perlu melakukan operasi khusus jenis. Saya dapati pengawal jenis tidak ternilai dalam meningkatkan keselamatan jenis dan kebolehbacaan kod.

Mari kita lihat contoh praktikal:

function processValue(value: string | number) {
  if (typeof value === "string") {
    // TypeScript knows that 'value' is a string here
    console.log(value.toUpperCase());
  } else {
    // TypeScript knows that 'value' is a number here
    console.log(value.toFixed(2));
  }
}

Salin selepas log masuk

Dalam kod ini, jenis semakan bertindak sebagai pengawal jenis, membolehkan TypeScript membuat kesimpulan jenis yang betul dalam setiap blok. Ini menghalang ralat dan membolehkan kami menggunakan kaedah khusus jenis dengan yakin.

Kami juga boleh mencipta pengawal jenis tersuai untuk senario yang lebih kompleks:

interface Dog {
  bark(): void;
}

interface Cat {
  meow(): void;
}

function isDog(animal: Dog | Cat): animal is Dog {
  return (animal as Dog).bark !== undefined;
}

function makeSound(animal: Dog | Cat) {
  if (isDog(animal)) {
    animal.bark(); // TypeScript knows this is safe
  } else {
    animal.meow(); // TypeScript knows this is safe
  }
}

Salin selepas log masuk

Jenis Dipetakan ialah satu lagi ciri yang saya dapati sangat berguna. Ia membolehkan kami mencipta jenis baharu berdasarkan yang sedia ada, yang boleh mengurangkan pertindihan kod dengan ketara dan menjadikan definisi jenis kami lebih dinamik.

Berikut ialah contoh cara saya menggunakan jenis dipetakan untuk mencipta versi baca sahaja antara muka:

interface User {
  id: number;
  name: string;
  email: string;
}

type ReadonlyUser = {
  readonly [K in keyof User]: User[K];
};

const user: ReadonlyUser = {
  id: 1,
  name: "John Doe",
  email: "john@example.com",
};

// This would cause a TypeScript error
// user.name = "Jane Doe";

Salin selepas log masuk

Jenis Bersyarat telah menjadi pengubah permainan dalam projek TypeScript saya. Ia membolehkan kami membuat definisi jenis yang bergantung pada jenis lain, membolehkan sistem jenis yang lebih fleksibel dan ekspresif.

Saya sering menggunakan jenis bersyarat apabila bekerja dengan fungsi generik:

type NonNullable<T> = T extends null | undefined ? never : T;

function processValue<T>(value: T): NonNullable<T> {
  if (value === null || value === undefined) {
    throw new Error("Value cannot be null or undefined");
  }
  return value as NonNullable<T>;
}

const result = processValue("Hello"); // Type is string
const nullResult = processValue(null); // TypeScript error

Salin selepas log masuk

Jenis Literal ialah satu lagi ciri yang saya dapati sangat berguna. Ia membolehkan kami mentakrifkan jenis yang mewakili nilai tepat, yang boleh sangat membantu untuk mencegah ralat dan menambah baik pemeriksaan jenis.

Berikut ialah contoh cara saya menggunakan jenis literal dalam kod saya:

type Direction = "north" | "south" | "east" | "west";

function move(direction: Direction) {
  // Implementation
}

move("north"); // This is valid
// move("up"); // This would cause a TypeScript error

Salin selepas log masuk

Kesatuan Terdiskriminasi telah menjadi bahagian penting dalam kit alat TypeScript saya. Mereka menggabungkan jenis kesatuan dengan sifat diskriminasi biasa, membolehkan definisi jenis yang lebih tepat dan pengendalian struktur data yang kompleks dengan lebih mudah.

Berikut ialah contoh cara saya menggunakan kesatuan yang didiskriminasi:

interface Square {
  kind: "square";
  size: number;
}

interface Rectangle {
  kind: "rectangle";
  width: number;
  height: number;
}

type Shape = Square | Rectangle;

function calculateArea(shape: Shape) {
  switch (shape.kind) {
    case "square":
      return shape.size * shape.size;
    case "rectangle":
      return shape.width * shape.height;
  }
}

Salin selepas log masuk

Generik ialah ciri berkuasa yang kerap saya gunakan untuk mencipta komponen dan fungsi yang boleh diguna semula. Mereka membenarkan kami menulis kod yang boleh berfungsi dengan berbilang jenis sambil mengekalkan keselamatan jenis.

Berikut ialah contoh fungsi generik yang mungkin saya gunakan:

function processValue(value: string | number) {
  if (typeof value === "string") {
    // TypeScript knows that 'value' is a string here
    console.log(value.toUpperCase());
  } else {
    // TypeScript knows that 'value' is a number here
    console.log(value.toFixed(2));
  }
}

Salin selepas log masuk

Penghias ialah ciri yang saya dapati amat berguna apabila bekerja dengan kelas. Mereka membenarkan kami menambah metadata atau mengubah suai gelagat kelas, kaedah dan sifat pada masa jalan.

Berikut ialah contoh penghias ringkas yang mungkin saya gunakan:

interface Dog {
  bark(): void;
}

interface Cat {
  meow(): void;
}

function isDog(animal: Dog | Cat): animal is Dog {
  return (animal as Dog).bark !== undefined;
}

function makeSound(animal: Dog | Cat) {
  if (isDog(animal)) {
    animal.bark(); // TypeScript knows this is safe
  } else {
    animal.meow(); // TypeScript knows this is safe
  }
}

Salin selepas log masuk

Ciri TypeScript canggih ini telah meningkatkan proses pembangunan saya dengan ketara. Mereka telah membenarkan saya menulis kod yang lebih mantap, selamat jenis, menangkap ralat lebih awal dalam kitaran pembangunan dan mencipta aplikasi yang lebih boleh diselenggara.

Pengawal Jenis amat berguna dalam senario di mana saya bekerja dengan data daripada API luaran. Mereka membenarkan saya mengecilkan jenis dengan selamat dan mengendalikan kes yang berbeza tanpa mengambil risiko ralat masa jalan.

Jenis Dipetakan telah menjimatkan berjam-jam saya menulis definisi jenis berulang. Saya telah menggunakannya untuk mencipta jenis utiliti yang mengubah antara muka sedia ada dalam pelbagai cara, seperti menjadikan semua sifat pilihan atau baca sahaja.

Jenis Bersyarat sangat berharga apabila berfungsi dengan fungsi generik yang kompleks. Mereka telah membenarkan saya mencipta definisi jenis yang lebih fleksibel yang menyesuaikan diri berdasarkan jenis input, yang membawa kepada sistem jenis yang lebih ekspresif dan tepat.

Jenis Literal telah menjadi pengubah permainan untuk menghalang pepijat yang berkaitan dengan rentetan atau nilai nombor yang salah. Saya telah menggunakannya secara meluas untuk menentukan pilihan yang sah untuk objek konfigurasi, memastikan bahawa hanya nilai yang dibenarkan digunakan.

Kesatuan Terdiskriminasi sangat berguna apabila bekerja dengan pengurusan negeri dalam aplikasi React. Mereka telah membenarkan saya mentakrifkan jenis yang tepat untuk keadaan yang berbeza, menjadikannya lebih mudah untuk mengendalikan logik UI yang kompleks dan menghalang keadaan mustahil.

Generik telah menjadi teras kepada kebanyakan fungsi dan komponen utiliti boleh guna semula saya. Mereka telah membenarkan saya menulis kod yang fleksibel dan selamat jenis yang boleh berfungsi dengan pelbagai jenis data tanpa mengorbankan pemeriksaan jenis.

Penghias telah sangat berguna untuk aspek seperti pengelogan, pengesahan dan caching. Saya telah menggunakannya untuk menambahkan kebimbangan silang kepada kelas saya tanpa mengacaukan logik utama, membawa kepada kod yang lebih bersih dan lebih boleh diselenggara.

Mengikut pengalaman saya, ciri TypeScript canggih ini benar-benar bersinar apabila digunakan dalam kombinasi. Contohnya, saya mungkin menggunakan generik dengan jenis bersyarat untuk mencipta jenis utiliti yang fleksibel atau menggabungkan kesatuan yang didiskriminasi dengan pengawal jenis untuk pengurusan negeri yang mantap.

Satu corak yang saya dapati sangat berkuasa ialah menggunakan jenis dipetakan dengan jenis bersyarat untuk mencipta jenis utiliti lanjutan. Berikut ialah contoh:

interface User {
  id: number;
  name: string;
  email: string;
}

type ReadonlyUser = {
  readonly [K in keyof User]: User[K];
};

const user: ReadonlyUser = {
  id: 1,
  name: "John Doe",
  email: "john@example.com",
};

// This would cause a TypeScript error
// user.name = "Jane Doe";

Salin selepas log masuk

Jenis DeepReadonly ini secara rekursif menjadikan semua sifat objek (dan objek bersarang) dibaca sahaja. Ini adalah contoh hebat tentang betapa hebatnya sistem jenis TypeScript apabila memanfaatkan ciri lanjutan ini.

Satu lagi corak yang saya dapati berguna ialah menggabungkan generik dengan kesatuan yang didiskriminasi untuk mencipta sistem acara selamat jenis:

function processValue(value: string | number) {
  if (typeof value === "string") {
    // TypeScript knows that 'value' is a string here
    console.log(value.toUpperCase());
  } else {
    // TypeScript knows that 'value' is a number here
    console.log(value.toFixed(2));
  }
}

Salin selepas log masuk

Corak ini memastikan acara dipancarkan dengan jenis muatan yang betul, menghalang ralat masa jalan dan meningkatkan kebolehpercayaan kod.

Kesimpulannya, ciri TypeScript canggih ini telah menjadi alat yang sangat diperlukan dalam kit alat pembangunan saya. Mereka telah membenarkan saya menulis aplikasi JavaScript yang lebih mantap, boleh diselenggara dan berskala. Dengan memanfaatkan Pengawal Jenis, Jenis Dipeta, Jenis Bersyarat, Jenis Tersurat, Kesatuan Terdiskriminasi, Generik dan Penghias, saya telah dapat mencipta definisi jenis yang lebih tepat, menangkap ralat lebih awal dalam proses pembangunan dan menulis kod yang lebih ekspresif.

Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa dengan kuasa yang besar datang tanggungjawab yang besar. Walaupun ciri ini boleh meningkatkan kod kami dengan ketara, ciri ini juga boleh membawa kepada definisi jenis yang terlalu kompleks jika tidak digunakan dengan bijak. Seperti mana-mana alat, kuncinya ialah menggunakannya di mana ia memberikan faedah yang jelas dan meningkatkan kualiti kod.

Saya menggalakkan semua pembangun JavaScript untuk meneroka ciri TypeScript lanjutan ini. Mereka mungkin kelihatan menakutkan pada mulanya, tetapi dengan latihan, mereka menjadi sekutu yang kuat dalam mencipta aplikasi yang berkualiti tinggi dan selamat jenis. Masa yang dilaburkan untuk mempelajari dan menggunakan ciri ini akan membuahkan hasil dalam bentuk pepijat yang lebih sedikit, kebolehbacaan kod yang dipertingkatkan dan pangkalan kod yang lebih boleh diselenggara.

Ingat, TypeScript bukan sekadar menambah jenis pada JavaScript; ia mengenai memanfaatkan sistem jenis untuk menulis kod yang lebih baik dan lebih selamat. Ciri lanjutan ini bukan sekadar gula sintaks - ia adalah alat berkuasa yang secara asasnya boleh meningkatkan cara kami mereka bentuk dan melaksanakan aplikasi kami.

Memandangkan ekosistem JavaScript terus berkembang, saya teruja untuk melihat bagaimana TypeScript dan ciri lanjutannya akan membentuk masa depan pembangunan web. Dengan menguasai alatan ini, kami meletakkan diri kami di barisan hadapan evolusi ini, bersedia untuk membina aplikasi yang teguh dan berskala pada masa hadapan.

101 Buku

101 Buku ialah syarikat penerbitan dipacu AI yang diasaskan bersama oleh pengarang Aarav Joshi. Dengan memanfaatkan teknologi AI termaju, kami memastikan kos penerbitan kami sangat rendah—sesetengah buku berharga serendah $4—menjadikan pengetahuan berkualiti boleh diakses oleh semua orang.

Lihat buku kami Kod Bersih Golang tersedia di Amazon.

Nantikan kemas kini dan berita menarik. Apabila membeli-belah untuk buku, cari Aarav Joshi untuk mencari lebih banyak tajuk kami. Gunakan pautan yang disediakan untuk menikmati diskaun istimewa!

Ciptaan Kami

Pastikan anda melihat ciptaan kami:

Kami berada di Medium

Atas ialah kandungan terperinci Ciri TypeScript canggih untuk Menambahkan Pembangunan Anda. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!