Amalan Terbaik untuk Logik Bersyarat dalam TypeScript

Artikel ini menerangkan amalan terbaik untuk logik bersyarat dalam TypeScript.

YouTube Video

Amalan Terbaik untuk Logik Bersyarat dalam TypeScript

Menyempitkan Jenis dengan Penjaga Jenis

Dengan memanfaatkan sistem jenis TypeScript dan menggunakan penjaga jenis dalam penyataan if, anda dapat meningkatkan keselamatan jenis dan kebolehbacaan.

1function processInput(input: string | number) {
2    if (typeof input === "string") {
3        console.log(`String input: ${input.toUpperCase()}`);
4    } else {
5        console.log(`Number input: ${input.toFixed(2)}`);
6    }
7}

Menggunakan typeof dan penjaga jenis lain memastikan bahawa kod dalam setiap blok adalah selamat jenis dan relevan dengan konteks.

Elakkan Penyataan if Bersarang

Penyataan if yang bersarang secara mendalam mengurangkan kebolehbacaan dan penyelenggaraan kod. Sebaliknya, gunakan pemulangan awal, operator logik, atau fungsi pengekstrakan.

Contoh Tidak Baik:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (user.age) {
3        if (user.age > 18) {
4            if (user.isAdmin) {
5                console.log("User is an adult admin.");
6            }
7        }
8    }
9}

Contoh Diperbaiki:

1function checkUser(user: { age?: number; isAdmin?: boolean }) {
2    if (!user.age || user.age <= 18 || !user.isAdmin) {
3        return;
4    }
5    console.log("User is an adult admin.");
6}

Pendekatan ini mendatarakan kod dan menjadikan logik lebih mudah difahami.

Gunakan Pengekalan Pilihan

Apabila memeriksa sifat bersarang, gunakan pengekalan pilihan (?.) untuk mengelakkan syarat if yang tidak perlu.

Tanpa Pengekalan Pilihan:

1if (user && user.profile && user.profile.email) {
2    console.log(user.profile.email);
3}

Menggunakan Pengekalan Pilihan:

1if (user?.profile?.email) {
2    console.log(user.profile.email);
3}

Ini mengurangkan kod piawai dan meningkatkan kebolehbacaan. Di sini, kod piawai merujuk kepada kod berulang dan standard yang sering diperlukan untuk melaksanakan tugas tertentu dalam pengaturcaraan.

Gunakan Operator Kesaksamaan Ketat

TypeScript menyokong pengetikan ketat, dan penggunaan kesaksamaan ketat (===) atau ketaksamaan ketat (!==) membantu mengelakkan paksaan jenis yang tidak dijangka.

Contoh Tidak Baik:

1if (value == "123") {
2    console.log("Value is 123.");
3}

Contoh Diperbaiki:

1if (value === "123") {
2    console.log("Value is 123.");
3}

Gunakan Enums atau Jenis Literal untuk Syarat Eksplisit

Menggunakan enums atau jenis literal menjelaskan syarat dan mengurangkan peluang kesalahan.

 1type Status = "success" | "error" | "loading";
 2
 3function displayMessage(status: Status) {
 4    if (status === "success") {
 5        console.log("Operation succeeded.");
 6    } else if (status === "error") {
 7        console.log("Operation failed.");
 8    } else {
 9        console.log("Loading...");
10    }
11}

Dengan mentakrifkan nilai yang dijangka, TypeScript dapat mengesan jenis dan memastikan ketepatan.

Gabungkan syarat yang serupa

Apabila banyak syarat berkongsi logik yang sama, satukan mereka dengan menggunakan operator logik atau pernyataan switch.

Contoh Tidak Baik:

1if (role === "admin") {
2    grantAccess();
3}
4if (role === "superadmin") {
5    grantAccess();
6}

Contoh Diperbaiki:

1if (role === "admin" || role === "superadmin") {
2    grantAccess();
3}

Sebagai alternatif, gunakan pernyataan switch untuk menangani cabang-cabang jelas yang berganda:

 1switch (role) {
 2    case "admin":
 3    case "superadmin":
 4        grantAccess();
 5        break;
 6    case "user":
 7        console.log("Limited access.");
 8        break;
 9    default:
10        console.log("No access.");
11}

Elakkan membuat ungkapan bersyarat menjadi rumit

Ungkapan bersyarat yang kompleks dalam pernyataan if mengurangkan kebolehbacaan. Ekstrak ungkapan tersebut ke dalam pembolehubah atau fungsi yang bermakna.

Contoh Tidak Baik:

1if (user.age > 18 && user.isAdmin && user.permissions.includes("write")) {
2    console.log("User can write.");
3}

Contoh Diperbaiki:

1const isAdultAdminWithWriteAccess = user.age > 18 && user.isAdmin && user.permissions.includes("write");
2if (isAdultAdminWithWriteAccess) {
3    console.log("User can write.");
4}

Penamaan syarat meningkatkan kejelasan dan menjadikan kod lebih mudah difahami.

Gunakan operator ternary untuk syarat yang mudah

Untuk syarat yang mudah, menggunakan operator ternary menjadikan kod lebih ringkas.

Contoh:

1const message = isLoggedIn ? "Welcome back!" : "Please log in.";
2console.log(message);

Walau bagaimanapun, elakkan menggunakan operator ternary untuk syarat yang kompleks kerana ia mengurangkan kebolehbacaan.

Kesimpulan

Dengan mengikuti amalan terbaik ini, anda boleh menjadikan pernyataan if dalam TypeScript lebih jelas, cekap, dan mudah diselenggara. Manfaatkan ciri-ciri TypeScript seperti kawalan jenis, rantai opsional, dan enum untuk meningkatkan kebolehbacaan dan kekukuhan kod anda. Pastikan syarat ringkas dan jelas, berusaha menghasilkan kod yang sentiasa mudah difahami dan diselenggara.

Anda boleh mengikuti artikel di atas menggunakan Visual Studio Code di saluran YouTube kami. Sila lihat juga saluran YouTube kami.

YouTube Video