שיטות עבודה מומלצות ללוגיקה מותנית ב-TypeScript

מאמר זה מסביר את שיטות העבודה המומלצות ללוגיקה מותנית ב-TypeScript.

YouTube Video

שיטות עבודה מומלצות ללוגיקה מותנית ב-TypeScript

הגבלת סוגים עם שומרי סוגים

על ידי ניצול מערכת הסוגים של TypeScript ושימוש בשומרי סוגים בתוך פקודות if, ניתן לשפר את בטיחות הסוגים ואת קריאות הקוד.

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}

שימוש ב-typeof ובשומרי סוגים אחרים מבטיח שקוד בתוך כל בלוק יהיה בטוח בסוג ומתאים לקונטקסט.

הימנעו מפקודות if מקוננות

פקודות if מקוננות לעומק מפחיתות את קריאות הקוד ואת תחזוקתו. במקום זאת, השתמשו בהחזרות מוקדמות, באופרטורים לוגיים או בחילוץ פונקציות.

דוגמה רעה:

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}

דוגמה משופרת:

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}

גישה זו מפשטת את הקוד והופכת את הלוגיקה לברורה יותר.

השתמשו בשלשול אופציונלי

בעת בדיקה של תכונות מקוננות, השתמשו בשלשול אופציונלי (?.) כדי להימנע מתנאים מיותרים של if.

ללא שלשול אופציונלי:

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

שימוש בשלשול אופציונלי:

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

זה מפחית קוד סטנדרטי ומשפר את קריאות הקוד. כאן, קוד סטנדרטי מתייחס לקוד חוזר ונשנה ומשותף שנדרש לעיתים קרובות כדי להשלים משימות מסוימות בתכנות.

השתמשו באופרטורים של השוואה מוחלטת

TypeScript תומך בטיפוס מחמיר, ושימוש בהשוואה מוחלטת (===) או אי-שוויון מוחלט (!==) מסייעת במניעת התאמת סוגים בלתי צפויה.

דוגמה רעה:

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

דוגמה משופרת:

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

השתמשו ב-Enums או בסוגים ליטרליים לתנאים מפורשים

שימוש ב-enums או בסוגים ליטרליים מבהיר תנאים ומפחית את הסיכוי לטעויות.

 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}

על ידי הגדרה של ערכים צפויים, TypeScript יכולה לזהות סוגים ולהבטיח דיוק.

שלב תנאים דומים

כאשר מספר תנאים חולקים את אותה הלוגיקה, שלב אותם תוך שימוש באופרטורים לוגיים או בביטוי switch.

דוגמה רעה:

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

דוגמה משופרת:

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

לחלופין, השתמש בביטוי switch לטיפול בענפים ברורים מרובים:

 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}

הימנע מהפיכת ביטויי תנאי למסובכים

ביטויי תנאי מסובכים במשפטי if מקטינים את הקריאות. חלץ אותם למשתנים או פונקציות בעלי משמעות.

דוגמה רעה:

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

דוגמה משופרת:

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

שמת שמות לתנאים משפרת את הבהירות והופכת את הקוד לתיעודי.

השתמש באופרטורים תנאיים (ternary) לתנאים פשוטים

לתנאים פשוטים, השימוש באופרטורים תנאיים מקצר את הקוד.

דוגמה:

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

עם זאת, הימנע משימוש באופרטורים תנאיים לתנאים מסובכים, מאחר והדבר מקטין את הקריאות.

סיום

על ידי שמירה על שיטות עבודה מומלצות אלו, תוכל להפוך משפטי if ב-TypeScript לברורים, יעילים וניתנים לתחזוקה. נצל תכונות TypeScript כמו שמירת סוגים (type guards), שרשור אופציונלי (optional chaining), ו-enums כדי לשפר את קריאות ועמידות הקוד שלך. שמור על תנאים תמציתיים וברורים, תוך שאיפה לקוד שתמיד קל להבנה ותחזוקה.

תוכלו לעקוב אחר המאמר שלמעלה באמצעות Visual Studio Code בערוץ היוטיוב שלנו. נא לבדוק גם את ערוץ היוטיוב.

YouTube Video