🌍 Вітаю вас, шаноўныя сябры! 🇧🇾

🌍 Вітаю вас, шаноўныя сябры! 🇧🇾

Давно не было про TypeScript и сегодня решил написать об одной интересной вещичке к которой я пришел сам — а как оказалось это уже best practice в мире TS!

🚀 Мотивация

Когда пишешь на TS, часто возникает желание не объявлять явно тип return, а довериться выводу типов.

Как правило всё работает 😃, но иногда как говорил адмирал Акбар It’s a trap! Функция растёт, внутренности меняются, и внезапно её возвращаемое значение становится другим типом, а TypeScript подстроился и молча это скушал ☕️.

Результат: неожиданные баги в местах вызова функции 🔥

🟢 Разбираемся на примере

1️⃣ Условие:

На проекте есть Илья, который ленится 🤪 делать аннотацию типов для возвращаемого значения у функции.
Написал функцию получения скидки и запихал вызов этой функции везде, где только можно.

const getDiscount = (price: number, day: number) => {
  if (day <= 15) {
    return price * 0.8;
  } 
  return price * 0.6; 
};

// result: number 

2️⃣Проблема:

Пришел горячий как пирожок джун Петя 😏, только только закончил курсы и готов покорять Amazon, а из блокеров только задача по фиксу бага.

Бизнес докинул требований, и Петя как самурай у которого только путь, побежал фиксить.

// ❌ без return type

const getDiscount = (price: number, day: number) => {
  if (price < 100) {
    return "no discount"; // строка!
  }
  if (day <= 15) {
    return price * 0.8;
  }
  return price * 0.6;
};

const result = getDiscount(50);

// ⛔️ result: number | string

И тут опачки, возвращаемый тип уже number | string, не забываем что функция shared и раскинута по всему проекту. Таким образом Петьке до амазона осталось пофиксить не одну багу, а уже целую кучу 😲.

3️⃣ Решение:

А всего-то нужно было добавить типок на выходе:

// Явно указываем: функция всегда возвращает number
const getDiscount = (price: number, day: number): number => {
  ...
};

Теперь если кто-то случайно захочет вернуть no discount — TypeScript сразу бросит ошибку. И этот кто-то подумает, а может быть не просто так здесь указан тот или иной тип.

🪙 Бонус:
cursor rule - просьба AI указывать return type.
linter rule - @typescript-eslint/explicit-function-return-type

💬 Делитесь мнением в комментариях👇! Если понравился пост, ставьте лайк и хорошего дня! 👍

#TYPESCRIPT