Передовые практики использования условной логики в 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}

Используйте перечисления или литеральные типы для явных условий

Использование перечислений или литеральных типов уточняет условия и снижает вероятность ошибок.

 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 =
2    user.age > 18 && user.isAdmin && user.permissions.includes("write");
3
4if (isAdultAdminWithWriteAccess) {
5    console.log("User can write.");
6}

Именование условий улучшает ясность и делает код самодокументирующимся.

Используйте тернарные операторы для простых условий

Для простых условий использование тернарных операторов делает код более лаконичным.

Пример:

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

Однако избегайте использования тернарных операторов для сложных условий, так как это снижает читаемость.

Замените условные ветви массивами или картами (Map)

Когда условие является просто сопоставлением значений, использование массивов или карт (Map) может улучшить читаемость и сопровождаемость кода по сравнению с конструкциями switch или сложными блоками if-else. В TypeScript вы можете использовать информацию о типах, чтобы реализовать это более безопасным способом.

Плохой пример:

 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}

Улучшенный пример: использование массива

 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}

Улучшенный пример: использование карты (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}

Заключение

Следуя этим рекомендациям, вы можете сделать конструкции if в TypeScript понятными, эффективными и удобными для сопровождения. Используя возможности TypeScript, такие как защиты типов (type guards), опциональная цепочка и перечисления, вы можете улучшить читаемость и надежность кода. Следуя лучшим практикам, вы можете сделать условия лаконичными и понятными, что приведет к более простому и легкому в поддержке коду.

Вы можете следовать этой статье, используя Visual Studio Code на нашем YouTube-канале. Пожалуйста, также посмотрите наш YouTube-канал.

YouTube Video