Указание типа параметра в функции JavaScript: решение

Быстрый ответ

Для определения типов параметров функций используйте TypeScript. Это будет обеспечивать строгую типизацию.

Пример:

function add(num1: number, num2: number): number {
  return num1 + num2; // ведь без математики никуда! 🤘
}

Таким образом, функция add будет жёстко ожидать два параметра типа number.

Помимо TypeScript, доступны другие способы обеспечения типовой безопасности и четкости кода. Давайте их рассмотрим.

Практическое применение библиотек для проверки типов

PropTypes – настоящий спасатель для React

В React для проверки типов передаваемых свойств часто используется PropTypes, который также можно применять для проверки типов параметров функций.

function greeting(name) {
  console.log(`Привет, ${name}!`);
}
greeting.propTypes = {
  name: PropTypes.string.isRequired, // Иначе может получиться что-то странное! 👽
};

Подробнее об этом расскажет наш спикер на видео

Создание собственных функций проверки типов

Без использования библиотек вроде PropTypes можно создать свои функции для проверки типов:

function checkNumber(value) {
  if (typeof value !== 'number') throw new Error('Ожидали число!'); // Это серьезно! 😬
}

function multiply(a, b) {
  checkNumber(a);
  checkNumber(b);
  return a * b; // и вот у нас есть результат! 🌞
}

Такие функции позволяют проверять типы в процессе выполнения кода и предотвратить ошибки типов.

Реализуйте полный потенциал вашего кода с JSDoc

JSDoc для точной аннотации

С использованием JSDoc вы можете указывать ожидаемые типы в комментариях, что улучшает качество разработки:

/**
 * Операция сложения двух чисел.
 * @param {number} num1 – Первое слагаемое.
 * @param {number} num2 – Второе слагаемое. Не забудьте, нам нужны два числа! 😝 
 * @returns {number} Результат сложения num1 и num2.
 */
function add(num1, num2) {
  return num1 + num2;
}

Среды разработки, такие как Visual Studio Code, поддерживают JSDoc, упрощая процесс разработки за счет автодополнения и проверки типов без использования TypeScript.

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

Когда аргументы функции представлены объектами, деструктуризация показывает их структуру более явно:

/**
 * На основе предоставленных данных создаётся пользователь.
 * @param {{ name: string, age: number }} userProfile – Информация о пользователе: имя и возраст. 
 */
function createUser({ name, age }) {
  // Узнаем, что нас приготовил Боб. 🎁
}

Деструктуризация улучшает читаемость и облегчает понимание кода.

Дополнительные методы контроля типов данных

Google Closure Compiler – незаменимый ассистент

Если TypeScript вам не по назначению, попробуйте использовать аннотации типов Google Closure Compiler, они также могут применяться в JavaScript:

/**
 * Функция вычитания двух чисел.
 * @param {number} num1 Это уменьшаемое число.
 * @param {number} num2 Это вычитаемое число.
 * @return {number} Результат вычитания num1 и num2.
 */
function subtract(num1, num2) {
  return num1 – num2;
}

Включив расширенный режим Google Closure Compiler, вы получите JavaScript, в котором строго соблюдается типизация.

Flow от Facebook – для идеальной работы

Flow от Facebook — еще один эффективный инструмент для достижения типовой безопасности:

// @flow
function divide(x: number, y: number): number {
  return x / y; // Разделим пирог на порции! 🍕
}

Установите Flow и проверьте свой код — вы быстро обнаружите проблемы в типах данных. Гарантируйте четкое соответствие типов в вашем коде.

Строгая типизация "под ключ"

Игра с приведением типов

Иногда мы можем использовать преобразование типов, когда точная типизация невозможна:

function logLength(value) {
  let stringValue = String(value); // Преобразуем значение в строку
  console.log(stringValue.length); // И выводим длину этой строки
}

Убедитесь, что все операции выполняются с требуемыми типами данных.

Умная функция typedFunction

Можно обернуть проверку типов функцией typedFunction, чтобы код был чистым и отвечал требованиям типовой безопасности:

function typedFunction(types, func) {
  return function(...args) {
    types.forEach((type, index) => {
      if (typeof args[index] !== type) {
        throw new TypeError(`Аргумент ${index} должен быть ${type}! 🙅‍♂️`);
      }
    });
    return func(...args); // Вот и функция, которая защищена от ошибок в типах!
  };
}

const safeAdd = typedFunction(['number', 'number'], add); // Наконец, функция add без угрозы ошибок в типах! 🍪

Благодаря этому ваш код будет полностью защищен от ошибок, связанных с типами.

Полезные материалы

1. Функции – JavaScript | MDN – Обширный ресурс, посвященный параметрам функций в JavaScript.
2. TypeScript: Документация – Подробнее о функциях – Детальное изучение работы с функциями в TypeScript.
3. Функции | Flow – Разбираемся с аннотацией типов в Flow для улучшения ваших JavaScript-функций.
4. Продвинутое использование функций — Глубокое погружение в продвинутые концепции функций в JavaScript.
5. valid-jsdoc – ESLint – Параметрически настроенный линтер JavaScript — Правила ESLint для поддержания лучших практик в ваших JSDoc-комментариях.
6. Использование JSDoc — Ваш ключ к эффективной документации параметров функций с высоким уровнем мастерства.
7. @babel/plugin-syntax-flow · Babel — Плагин Babel для поддержки синтаксиса в сочетании с Flow.