Bedste praksis for betinget logik i TypeScript

Denne artikel forklarer bedste praksis for betinget logik i TypeScript.

YouTube Video

Bedste praksis for betinget logik i TypeScript

Indsnævring af typer med typevagter

Ved at udnytte TypeScripts typesystem og bruge typevagter i if-sætninger kan du forbedre typesikkerheden og læsbarheden.

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}

Ved at bruge typeof og andre typevagter sikres det, at koden inden for hvert blok er typesikker og kontekstuelt relevant.

Undgå indlejrede if-sætninger

Dybt indlejrede if-sætninger reducerer kodens læsbarhed og vedligeholdelsesvenlighed. I stedet bør du bruge tidlige returneringer, logiske operatorer eller udtrække funktioner.

Dårligt eksempel:

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}

Forbedret eksempel:

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}

Denne fremgangsmåde flader koden ud og gør logikken mere forståelig.

Udnyt valgfri kædning

Når du tjekker indlejrede egenskaber, brug valgfri kædning (?.) for at undgå unødvendige if-betingelser.

Uden valgfri kædning:

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

Ved brug af valgfri kædning:

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

Dette reducerer standardkode og forbedrer læsbarhed. Her refererer standardkode til gentagne, standardiserede kodeblokke, der ofte er nødvendige for at udføre specifikke opgaver i programmering.

Brug strikte lighedsoperatorer

TypeScript understøtter streng typing, og brugen af strikt lighed (===) eller strikt ulighed (!==) hjælper med at forhindre uventet typekonvertering.

Dårligt eksempel:

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

Forbedret eksempel:

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

Brug enums eller bogstavelige typer til eksplicitte betingelser

Brugen af enums eller bogstavelige typer tydeliggør betingelserne og reducerer risikoen for fejl.

 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}

Ved at definere forventede værdier kan TypeScript registrere typer og sikre præcision.

Kombinér lignende betingelser

Når flere betingelser deler samme logik, konsolider dem ved hjælp af logiske operatorer eller en switch-sætning.

Dårligt eksempel:

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

Forbedret eksempel:

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

Alternativt kan du bruge en switch-sætning til at håndtere flere klare grene:

 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}

Undgå at gøre betingede udtryk komplekse

Komplekse betingede udtryk i if-sætninger mindsker læsbarheden. Ekstrahér dem til meningsfulde variabler eller funktioner.

Dårligt eksempel:

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

Forbedret eksempel:

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

Navngivelse af betingelser forbedrer klarheden og gør koden selvbeskrivende.

Brug ternære operatorer til simple betingelser

For simple betingelser gør brugen af ternære operatorer koden kortfattet.

Eksempel:

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

Undgå dog at bruge ternære operatorer til komplekse betingelser, da det mindsker læsbarheden.

Erstat betingelsesafgreninger med arrays eller maps

Når betingelsen blot er en værditilordning, kan brug af arrays eller maps forbedre kode-læseligheden og vedligeholdelsen sammenlignet med switch-udtryk eller komplekse if-else-blokke. I TypeScript kan du udnytte typeoplysninger til at implementere det mere sikkert.

Dårligt eksempel:

 1function getDayName(day: number): string {
 2    switch (day) {
 3        case 0:
 4            return "Sunday";
 5        case 1:
 6            return "Monday";
 7        case 2:
 8            return "Tuesday";
 9        case 3:
10            return "Wednesday";
11        case 4:
12            return "Thursday";
13        case 5:
14            return "Friday";
15        case 6:
16            return "Saturday";
17        default:
18            return "Invalid day";
19    }
20}

Forbedret eksempel: Brug af et array

 1function getDayName(day: number): string {
 2    const days = [
 3        "Sunday",
 4        "Monday",
 5        "Tuesday",
 6        "Wednesday",
 7        "Thursday",
 8        "Friday",
 9        "Saturday"
10    ];
11    return days[day] ?? "Invalid day";
12}

Forbedret eksempel: Brug af et Map

 1function getDayName(day: number): string {
 2    const dayMap = new Map<number, string>([
 3        [0, "Sunday"],
 4        [1, "Monday"],
 5        [2, "Tuesday"],
 6        [3, "Wednesday"],
 7        [4, "Thursday"],
 8        [5, "Friday"],
 9        [6, "Saturday"]
10    ]);
11    return dayMap.get(day) ?? "Invalid day";
12}

Konklusion

Ved at følge disse bedste praksisser kan du gøre if-sætninger i TypeScript klare, effektive og vedligeholdelige. Ved at bruge TypeScript-funktioner såsom type guards, optional chaining og enums, kan du forbedre kodens læsbarhed og robusthed. Ved at følge bedste praksis kan du holde betingelserne korte og klare, hvilket resulterer i kode, der er lettere at forstå og vedligeholde.

Du kan følge med i ovenstående artikel ved hjælp af Visual Studio Code på vores YouTube-kanal. Husk også at tjekke YouTube-kanalen.

YouTube Video