Array.push() в JavaScript: добавление объекта при его отсутствии
Пройдите тест, узнайте какой профессии подходите
Быстрый ответ
Для минимизации дубликатов и поддержки уникальности элементов, применяйте метод includes
до выполнения push
:
let array = [1, 2];
let itemToAdd = 2;
if (!array.includes(itemToAdd)) {
array.push(itemToAdd);
}
// Массив останется таким же: [1, 2]
В случае массивов с объектами, лучше использовать find
или findIndex
, чтобы сравнить свойства объектов перед их вводом:
let objectArray = [{ name: "Alice", text: "Hello" }];
let objectToAdd = { name: "Bob", text: "Hi" };
if (!objectArray.find(obj => obj.name === objectToAdd.name && obj.text === objectToAdd.text)) {
objectArray.push(objectToAdd);
}
// В objectArray появится новый элемент: objectToAdd
Эффективное исправление: Массивы строк и чисел
Устранение повторений
Использование includes
или indexOf
поможет предотвратить дублирование при добавлении уже существующих элементов. Этот способ особенно подходит для обработки строк и чисел.
if (!array.includes(itemToAdd)) {
array.push(itemToAdd);
}
Обеспечение уникальности
Применяйте Set, чтобы обеспечить уникальность элементов в массиве и избежать дубликатов при добавлении.
let uniqueSet = new Set(array);
uniqueSet.add(itemToAdd);
array = [...uniqueSet];
Работа с объектами в массивах
Внимание свойствам
От повторяющихся объектов в массиве можно защититься, проверяя их свойства.
if (!objectArray.some(obj => obj.name === objectToAdd.name && obj.text === objectToAdd.text)) {
objectArray.push(objectToAdd);
}
Функция для повторного применения
Для упрощения повторного использования кода можно вынести проверку на уникальность в функцию pushIfNotExist
.
function pushIfNotExist(array, element, comparer) {
if (!array.some(el => comparer(el, element))) {
array.push(element);
}
}
pushIfNotExist(objectArray, objectToAdd, (a, b) => a.name === b.name && a.text === b.text);
Код на базе ES6
Для производства более лаконичного кода, советуем использовать функциональность ES6, например методы filter
и concat
.
let filteredArray = objectArray.concat(
objectArray.filter(obj =>
!objectArray.some(existingObj => existingObj.name === obj.name)
)
);
Визуализация
Представьте ваш массив как закрытый клуб со списком VIP-персон. Правило простое: допустим только новые лица!
Список VIP: [Alice 👩, Bob 👨, Clara 👩🦰]
Новый гость: Dave 👨🦱
Если он еще не в клубе, впускаем!
if (!vipList.includes("Dave")) {
vipList.push("Dave");
}
В итоге список VIP обновляется новым именем:
Обновленный список VIP: [Alice 👩, Bob 👨, Clara 👩🦰, **Dave 👨🦱**]
Теперь Dave является членом загогулинного сообщества, и он может войти в клуб только один раз!
Уголок ботана: Суеверия о производительности
Анализируйте размер и сложность используемых массивов, когда производительность имеет важное значение. Методы indexOf
, find
и includes
работают с различной скоростью, что является критичным при работе с большими массивами.
Чистота кода и совершенство
Не рекомендуется расширять базовые объекты, например Array.prototype
, чтобы предотвратить потенциальные коллизии. Писание удобного для поддержки кода и создание вспомогательных функций, таких как pushIfNotExist
, упрощают тестирование и чтение кода.