Пересечение массивов в JavaScript: простые методы и примеры кода

[hannadev]

Пересечение массивов в JavaScript — это поиск общих элементов между двумя наборами данных. Эта задача часто возникает при фильтрации списков, обработке пользовательских данных или сравнении коллекций. Мы разберём простые способы реализации, чтобы вы могли быстро применить их в проекте.

Зачем это нужно? Пересечение помогает оптимизировать код, избегая дубликатов и ускоряя работу с большими массивами. Вы узнаете методы на основе filter, Set и циклов, с примерами и сравнениями производительности. Это сэкономит время на отладку и сделает код чище.

Базовый метод с filter и includes

Метод filter в комбинации с includes — самый простой способ найти пересечение. Он проходит по первому массиву и оставляет только те элементы, которые есть во втором. Это элегантное решение в одну строку, идеальное для небольших массивов.

Рассмотрим пример: у нас есть arrayA = [1, 3, 4, 5] и arrayB = [1, 2, 5, 6, 7]. Результат будет [1, 5]. Код работает быстро для примитивов, но учтите, что includes использует строгий поиск по значению. Если массив содержит дубликаты, они сохранятся в результате.

Вот базовая реализация:

• filter(value => arrayB.includes(value)) — основной паттерн для примитивов.
• Для строк и чисел это работает из коробки.
• Нюанс: метод чувствителен к типу данных, NaN не найдётся.

Массив A	Массив B	Пересечение
[1,3,4,5]	[1,2,5,6]	[1,5]
[‘a’,‘b’]	[‘b’,‘c’]	[‘b’]
[1,2,2]	[2,2]	[2,2]

Работа с объектами и уникальными значениями

При работе с объектами простой includes не сработает, так как сравнивает ссылки. Нужно использовать some с кастомным условием, например, по id. Это расширяет базовый метод для реальных сценариев вроде сравнения пользователей или товаров.

Пример: objectArray1 = [{id:1}, {id:2}], objectArray2 = [{id:1}, {id:3}]. Пересечение по id даст [{id:1}]. Такой подход полезен в базах данных или API-ответах. Для уникальности добавьте Set, чтобы исключить повторы.

Ключевые варианты:

• objectArray1.filter(obj1 => objectArray2.some(obj2 => obj1.id === obj2.id))
• Для уникальных: […new Set(array1.filter(…))]
• Важно: some останавливается на первом совпадении, что ускоряет поиск.

Сравнение подходов для объектов:

Метод	Преимущества	Недостатки
some по id	Точное сравнение	Требует свойства id
JSON.stringify	Универсально	Медленно, порядок важен
Lodash intersectionBy	Готовое решение	Зависимость

Эффективные алгоритмы для больших массивов

Для больших данных filter с includes становится медленным из-за O(n^2) сложности. Лучше отсортировать массивы и использовать два указателя. Это классический алгоритм, как в intersectSortedArrays, с линейной сложностью O(n + m).

Функция проходит по обоим массивам одновременно: если элементы равны — добавляем, если меньше — сдвигаем первый указатель. Пример для отсортированных [1,2,3,4] и [2,4,6] даст [2,4]. Подходит для производственных задач с тысячами элементов.

Варианты реализации:

1. Два указателя для отсортированных массивов.
2. Set для быстрого поиска: new Set(arrayB), затем filter.
3. Set быстрее includes на 10-20 раз для больших наборов.

Код для Set:

const intersection = [...new Set(array1.filter(x => setB.has(x)))];

Современные методы с Set.intersection

В новых версиях JavaScript появился метод Set.intersection(). Он возвращает новый Set с общими элементами, итерация идёт по меньшему набору. Это чистое решение без фильтров, с сохранением порядка.

Пример: const setA = new Set([1,2,3]), setB = new Set([2,3,4]). Результат — Set(2,3). Преобразование в массив делается через spread. Метод эффективен и читаем, но требует ES2024+.

Преимущества:

• Автоматическая уникальность.
• Линейная сложность.
• Работает с Set-подобными объектами.

Поддержка: проверьте caniuse.com для браузеров.

Когда пересечение выходит за рамки простоты

Мы разобрали от базовых filter до Set.intersection, но остались нюансы вроде обработки вложенных структур или потоковых данных. Стоит поэкспериментировать с производительностью на ваших данных и выбрать метод под задачу. Далее можно углубиться в комбинации с разностью или симметричным пересечением для полных операций над множествами.