Bästa praxis för villkorslogik i TypeScript

Denna artikel förklarar bästa praxis för villkorslogik i TypeScript.

YouTube Video

Bästa praxis för villkorslogik i TypeScript

Begränsa typer med typvakter

Genom att använda TypeScripts typsystem och använda typvakter inom if-satser kan du förbättra typsäkerheten och läsbarheten.

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}

Genom att använda typeof och andra typvakter säkerställer du att koden inom varje block är typsäker och kontextuellt relevant.

Undvik nästlade if-satser

Djupet av nästlade if-satser minskar kodens läsbarhet och underhållbarhet. Använd istället tidiga returvärden, logiska operatorer eller externa funktioner.

Dåligt exempel:

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}

Förbättrat exempel:

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}

Denna metod plattar till koden och gör logiken mer begriplig.

Utnyttja valfri kedjning

När du kontrollerar nästlade egenskaper, använd valfri kedjning (?.) för att undvika onödiga if-villkor.

Utan valfri kedjning:

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

Med valfri kedjning:

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

Detta minskar boilerplate-kod och förbättrar läsbarheten. Här avser boilerplate-kod repetitiv, standardiserad kod som ofta krävs för att utföra specifika uppgifter i programmering.

Använd strikta likhetsoperatorer

TypeScript stöder strikt typning, och användning av strikt likhet (===) eller strikt olikhet (!==) hjälper till att förhindra oväntad type coercion.

Dåligt exempel:

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

Förbättrat exempel:

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

Använd enums eller bokstavstyper för explicita villkor

Användning av enums eller bokstavstyper klargör villkor och minskar risken för fel.

 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}

Genom att definiera förväntade värden kan TypeScript upptäcka typer och säkerställa noggrannhet.

Kombinera liknande villkor

När flera villkor delar samma logik, konsolidera dem med logiska operatorer eller ett switch-uttalande.

Dåligt exempel:

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

Förbättrat exempel:

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

Alternativt, använd ett switch-uttalande för att hantera flera tydliga grenar:

 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}

Undvik att göra villkorsuttryck komplexa

Komplexa villkorsuttryck i if-satser minskar läsbarheten. Extrahera dem till meningsfulla variabler eller funktioner.

Dåligt exempel:

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

Förbättrat exempel:

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

Att namnge villkoren förbättrar tydligheten och gör koden självförklarande.

Använd ternära operatorer för enkla villkor

För enkla villkor gör ternära operatorer koden kortfattad.

Exempel:

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

Undvik dock att använda ternära operatorer för komplexa villkor eftersom det minskar läsbarheten.

Slutsats

Genom att följa dessa bästa metoder kan du göra if-satser i TypeScript tydliga, effektiva och underhållbara. Utnyttja TypeScript-funktioner som typkontroller, valfri kedjning och uppräkningar för att förbättra läsbarheten och robustheten i din kod. Gör villkor kortfattade och tydliga, sträva efter kod som alltid är lätt att förstå och underhålla.

Du kan följa med i artikeln ovan med hjälp av Visual Studio Code på vår YouTube-kanal. Vänligen kolla även in YouTube-kanalen.

YouTube Video