Почему вы должны инкапсулировать свои условия Javascript в функцию

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

Один из способов улучшить читаемость условных операторов — инкапсулировать их в функцию. Делая это, вы можете присвоить условному выражению имя, которое обеспечивает необходимый контекст для того, кто просматривает код. Имя должно объяснять, что оценивает условное выражение и какие данные оно использует.

// Original code
if (user.isAdmin && user.hasAccess && (user.role === 'Manager' || user.role === 'Developer')) {
  // Perform some action
}

// Refactored code
function hasPermission(user) {
  return user.isAdmin && user.hasAccess && (user.role === 'Manager' || user.role === 'Developer');
}

if (hasPermission(user)) {
  // Perform some action
}

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

function isAgeGreaterOrEqualTo18(age) {
  return age >= 18;
}

function isMaleOrFemale(gender) {
  return gender === 'male' || gender === 'female';
}

function isLocationNewYorkOrCalifornia(location) {
  return location === 'New York' || location === 'California';
}

Как видите, даже самые лучшие условные предложения не очень хорошо сканируются. Вы должны остановиться и внимательно прочитать условное выражение и оценить его контекст, чтобы понять, что оно на самом деле делает.

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

// Create a function that checks if a number is divisible by 3
function isDivisibleByThree(num) {
  return num % 3 === 0;
}

// Create a function that checks if a number is divisible by 5
function isDivisibleByFive(num) {
  return num % 5 === 0;
}

// Create a function that checks if a number is divisible by both 3 and 5
function isDivisibleByBoth(num) {
  return isDivisibleByThree(num) && isDivisibleByFive(num);
}

// Create a function that checks if a number is divisible by either 3 or 5
function isDivisibleByEither(num) {
  return divisibleByThree(num) || divisibleByFive(num);
}

// Call the functions
isDivisibleByBoth(15); // prints "15 is divisible by both 3 and 5"
isDivisibleByEither(14); // prints "14 is divisible by either 3 or 5"

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

Если вы тестируете, инкапсуляция упрощает тестирование каждого условия в вашем приложении.

const isNumberGreaterThan10 = (num) => {
  return num > 10;
};

test('isNumberGreaterThan10 function should return true if the number is greater than 10', () => {
  expect(isNumberGreaterThan10(11)).toBe(true);
});

Инкапсулируйте свои условные операторы

Это один из советов по чистому коду, который я редко вижу на самом деле в Интернете, и я думаю, что люди действительно упускают простой способ сделать свой код более читабельным, добавив немного больше кода и усилий.