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

Метод 1: использование Array.prototype.filter()
Метод Array.prototype.filter() — это удобный инструмент для удаления элементов из массива, которые не соответствуют заданным критериям. Чтобы отфильтровать неопределенные значения, вы можете использовать метод filter() в сочетании с простым логическим условием.

const numbers: (number | undefined)[] = [1, 2, undefined, 3, undefined, 4];
const filteredNumbers = numbers.filter((num) => num !== undefined);
console.log(filteredNumbers); // Output: [1, 2, 3, 4]

Метод 2: использование Array.prototype.reduce()
Метод Array.prototype.reduce() позволяет преобразовать массив в одно значение. Используя этот метод, вы можете создать краткое решение для фильтрации неопределенных значений.

const numbers: (number | undefined)[] = [1, 2, undefined, 3, undefined, 4];
const filteredNumbers = numbers.reduce((acc, num) => {
  if (num !== undefined) {
    acc.push(num);
  }
  return acc;
}, []);
console.log(filteredNumbers); // Output: [1, 2, 3, 4]

Метод 3: использование цикла for…of
Если вы предпочитаете более традиционный подход, вы можете использовать цикл for…of для перебора массива и ручной фильтрации неопределенных значений.

const numbers: (number | undefined)[] = [1, 2, undefined, 3, undefined, 4];
const filteredNumbers = [];
for (const num of numbers) {
  if (num !== undefined) {
    filteredNumbers.push(num);
  }
}
console.log(filteredNumbers); // Output: [1, 2, 3, 4]

Метод 4: использование дополнительной цепочки TypeScript
В TypeScript введен необязательный оператор цепочки (?.) для обработки ситуаций, когда свойства или методы могут быть нулевыми или неопределенными. Вы можете использовать этот оператор для фильтрации неопределенных значений в объекте.

interface Person {
  name?: string;
  age?: number;
}
const person: Person = {
  name: "John",
  age: undefined,
};
const filteredPerson: Person = {
  name: person.name,
  age: person.age,
};
console.log(filteredPerson); // Output: { name: "John" }

Фильтрация неопределенных значений — важный навык при работе с TypeScript. В этой статье мы рассмотрели различные методы достижения этой цели, в том числе Array.prototype.filter(), Array.prototype.reduce(), циклы for… и дополнительный оператор цепочки TypeScript. Используя эти методы, вы можете гарантировать, что ваш код останется надежным и свободным от неожиданных ошибок, вызванных неопределенными значениями.