Пейджер

🌍 Привет мир! 👋

🌍 Привет мир! 👋

Ребята сегодня будет необычный пост, не про код и библиотеки, так бывает 🤷‍♀️, но от этого вам не должно стать менее интересно.

Вы знаете что такое ложная полнота? Я вот только недавно узнал что это и понял, оказывается я всегда это понимал на каком-то сознательном уровне, но не знал как это называется.

🍿 Рассказываю

Ложная полнота — это иллюзия того, что вы полностью покрыли кодом и(или) тестами все сценарии. На самом деле могут оставаться неучтённые случаи, которые затем проявляют себя в самый неподходящий момент.

🔖 Примеры:

🚩 Вы пыхтите над реализацией авторизации и у вас есть определенный перечень типов пользователей:

type UserType = 'admin' | 'guest';

function greetUser(userType: UserType) {
  if (userType === 'admin') return 'Привет, Админ';
  else return 'Привет, гость';
}


Кажется, всё логично и прекрасно, но тут появляется новый тип пользователя: 'moderator'. И вот код уже работает некорректно.

Вот вам еще кейсик, а что если на вход функции пришло значение null ?

greetUser(null);


В таком случае мы получим ответ Привет, гость, что тоже будет некорректно.

В таких случаях необходимо рассматривать каждый тип отдельно, и не забывайте про default-case который в идеале должен быть варнингом или ошибкой.

function greetUser(userType) {

  if (userType === 'admin') {
    return 'Привет, Админ'
  };
  
  if (userType === 'guest') {
    return 'Привет, гость'
  };
  
  throw new Error("уууу пахнет багой")
}


🚩 Деление на ноль, тоже очень наглядный пример

Вроде бы все классно, элементарная функция:

function divide(a: number, b: number) {
  return a / b;
}


Но, а что если вторым аргументом будет передан 0:

divide(10, 0); // Infinity


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

🚩 И еще интересный пример с мутацией состояния

У нас react, мы пытаемcя обновить состояние:

const [items, setItems] = useState([]);

function addItem(newItem) {
  items.push(newItem);
  setItems(items);
}


Всё вроде бы работает, но интерфейс не обновляется, потому что забыли про иммутабельность:

function addItem(newItem) {
  setItems([...items, newItem]);
}


Кстати я писал классный пост про баг в React, тоже отличный пример ложной полноты

Как избегать ложной полноты?

✏️ Cтарайтесь думать об edge-cases, негативных сценариях.

✏️ Применяйте exhaustive-checks в TypeScript (про этот способ расскажу в следующем посте).

✏️ Используйте strict режимы.

✏️ Не доверяйте UI — даже если всё четенько, проверяйте, откуда и как приходят данные.

✏️ При покрытии тестами не ограничивайтесь стандартным флоу — проверяйте невалидные входы и отсутствие данных.

✏️ Воспринимайте неполные данные как норму: undefined, null, [], {} — это не исключение, а ожидаемая реальность.

✏️ Проектируйте функции и API так, чтобы они явно сигнализировали об ошибках или пустых значениях.

✏️ Регулярно делайте рефлексии по багам — где вы допустили ложное ощущение "всё работает".

Хорошего вам дня и легких багов (нет смысла желать их отсутствия, это точно не сбудется 🥺)

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

#BESTPRACTICES
Медиа 1
Хотите больше таких постов?
Подпишитесь на канал и читайте продолжение в Telegram.
Подписаться на @ivanchikovitclub Открыть пост в Telegram