Проверка двух объектов на идентичность
Есть задача по JavaScript Нужно полностью сравнить два объекта на идентичность их свойств. Порядок свойств в объекте не важен. Если значением какого-то свойства объекта является массив или объект, то начать сверять и их у обоих объектов. Объект в свойстве другого объекта нужно сверять рекурсивно. При сверке объектов — последовательность свойств не важна, но при сверке массивов, важна последовательность элементов, то есть массивы: [1,2,3,4] и [2,1,3,4] не равны, так как, хотя и имеют одинаковые значения, отличаются в последовательности этих значений. Полного сравнения объектов я смог добиться, но если в свойстве объекта массив, то каким бы он не был всегда возвращается true. Свойства сравнивал через valueOf для того случая, если свойством будет дата, что бы она сравнивалась корректно.
function deepEqual (obj1, obj2) < if(obj1 === obj2)< return true; >else < if(Object.keys(obj1).length != Object.keys(obj2).length)< // Проверка на одинаковое количество свойств return false; >for(var propName in obj1) < if (! obj2.hasOwnProperty(propName)) < // Есть ли свойства в обоих объектах return false; >if(obj1[propName].valueOf() !== obj2[propName].valueOf()) < // Одинаковы ли значения свойст if(! deepEqual(obj1[propName], obj2[propName]) )< // проверка объекта в объекте return false; >> > > return true; > Вот данные для проверки Первый объект
var objA = < prop1: 'value1', prop2: 'value2', prop3: 'value3', prop4: < subProp1: 'sub value1', subProp2: < subSubProp1: 'sub sub value1', subSubProp2: [1, 2, , 4, 5] > >, prop5: 1000, prop6: new Date(2016, 2, 10) >;
Второй объект
var objB = < prop5: 1000, prop3: 'value3', prop1: 'value1', prop2: 'value2', prop6: new Date('2016/03/10'), prop4: < subProp2: < subSubProp1: 'sub sub value1', subSubProp2: [1, 2, , 4, 5] >, subProp1: 'sub value1' > >;
В чем ошибка? Нужно ли для проверки массивов создавать новую функцию?
Отслеживать
задан 19 авг 2017 в 9:42
11 1 1 золотой знак 1 1 серебряный знак 1 1 бронзовый знак
Легче всего сравнивать строки, поэтому я в своих проектах просто использую JSON.stringify() и уже получившиеся строки сравниваю
– user182722
19 авг 2017 в 10:01
@Masiama дешево и сердито
Сравните два объекта в JavaScript
В этом посте мы обсудим, как сравнить два объекта в JavaScript. Два объекта считаются равными, если оба объекта одного типа, проходят строгое равенство (===) сравнения, и все их свойства равны.
1. Использование библиотеки Lodash/Underscore
С библиотекой lodash или underscore вы можете использовать _.isEqual метод. Он выполняет глубокое сравнение двух объектов, чтобы определить, эквивалентны ли они. Следующий пример кода демонстрирует его использование:
Как сравнить два объекта js
В отличие от данных примитивных типов данные объектов копируются по ссылке. Что это значит? Рассмотрим следующий пример:
const tom = < name: "Tom">; const bob = tom; // проверяем свойство name у обоих констант console.log(tom.name); // Tom console.log(bob.name); // Tom // меняем свойство name у константы bob bob.name = "Bob"; // повторно проверяем свойство name у обоих констант console.log("После изменения") console.log(tom.name); // Bob console.log(bob.name); // Bob
Вначале определяется обычный объект tom с одним свойством name . Затем присваиваем значение этого объекта константе bob
const bob = tom;
В данном случае константа bob получае ссылку или условно говоря адрес константы tom , поэтому после этого присвоения обе константы по сути указывают на один и тот же объект в памяти. Соответственно изменения, произведенные через одну константу:
bob.name = "Bob";
Затронут и другую константу — tom :
console.log(tom.name); // Bob\
Более того, добавим к объекту новое свойство через одну из констант:
const tom = < name: "Tom">; const bob = tom; // добавляем константе bob новое свойство - age bob.age = 37; // и видим, что для tom тоже добавлено новое свойство console.log(tom.age); // 37
После добавления свойства age константе bob можно увидеть, что у константы tom то же появилось это свойство, потому что опять же обе константы представляют один и тот же объект.
Что же если мы хотим скопировать из свойства объекта, но при этом обе константы или переменных указывали бы на совершенно разные объекты, изменения одного из которых никак бы не затрагивали другой? В этом случае мы можем воспользоваться встроенным методом Object.assign() .
Метод Object.assign
Метод Object.assign() принимает два параметра:
Object.assign(target, . sources)
Первый параметр — target представляет объект, в который надо скопировать свойства. Второй параметр — . sources — набор объектов, из которых надо скопировать свойства (то есть мы можем скопировать свойства сразу из нескольких объектов)
Возвращает метод объект target, в который скопированы свойства из объектов sources .
const tom = < name: "Tom", age: 37>; const bob = Object.assign(<>, tom); bob.name = "Bob"; bob.age = 41; console.log(`Объект tom. Name: $ Age: $`); console.log(`Объект bob. Name: $ Age: $`);
В данном случае вызов Object.assign(<>, tom) означает, что мы копируем данные из объекта tom в пустой объект <> . Результатом этого копирования стал объект bob . Причем это совсем другой объект, нежели tom . И любые изменения с константой bob здесь никак не затронут константу tom .
Консольный вывод программы:
Объект tom. Name: Tom Age: 37 Объект bob. Name: Bob Age: 41
Копирование из нескольких объектов
Подобным образом можно копировать данные из нескольких объектов:
const tom = < name: "Tom">; const sam = < age: 37>; const person = < height: 170>; Object.assign(person, tom, sam); // копируем из tom и sam в person console.log(person); //
Здесь копируются все свойства из объектов tom и sam в объект person. В итоге после копирования объект person будет иметь три свойства.
Копирование одноименных свойств
Если объекты, из которых выполняется копирование, содержат одинаковые свойства, то свойства из последних объектов замещают свойства предыдущих:
const tom = < name: "Tom", age: 37>; const sam = < age: 45>; const person = < height: 170>; Object.assign(person, tom, sam); console.log(person); //
Здесь оба объекта — tom и sam содержат свойство age , но в объекте person свойство age равно 45 — значение из объекта sam, потому что копирование из объекта sam произодится в последнюю очередь.
Копирование свойств-объектов
Несмотря на то, что Object.assign() прекрасно работает для простых объектов, но что будет, если свойство копируемого объекта также представляет объект:
const tom = < name: "Tom", company: >; const bob = Object.assign(<>, tom); bob.name = "Bob"; bob.company.title = "Google"; console.log(tom.name); // Tom console.log(tom.company.title); // Google
Здесь свойство company объекта tom представляет объект с одним свойством. И при копировании объект bob получит не копию значения tom.company , а ссылку на этот объект. Поэтому изменения bob.company затронут и tom.company .
Копирование объекта с помощью spread-оператора
spread-оператор . позволяет разложить объект на различные пары свойство-значение , которые можно передать другому объекту.
const tom = < name: "Tom", age: 37, company: "Google">; const bob = bob.name = «Bob»; console.log(tom); // console.log(bob); //
В данном случае объекту bob передаются копии свойств объекта tom.
Если какие-то свойства нового объекта должны иметь другие значения (как в примере выше свойство name), то их можно указать в конце:
const tom = < name: "Tom", age: 37, company: "Google">; const bob = ; console.log(bob); //
Как видно из предыдущего примера, обе константы после копирования представляют ссылки на разные объекты, и изменения одного из них никак не затронет другой объект.
Тем не менее если объекты содержат вложенные объекты, то эти вложенные объекты при копировании опять же по сути будут представлять ссылки на один и тот же объект:
const tom = < name: "Tom", age: 37, company: >; const bob = bob.name = "Bob"; bob.company.title = "Google"; console.log(`$ - $`); // Tom - Google console.log(`$ - $`); // Bob - Google
Сравнение объектов
Сравним два объекта с помощью стандартных операций сравнения и эквивалентности:
const tom = < name: "Tom">; const bob = < name: "Bob">; console.log(tom == bob); // false console.log(tom === bob); // false
Оба оператора в данном случае возвратят значение false , то есть объекты не равны. Причем даже если значения свойств объектов будет одинаковым, то мы все равно в обоих случаях получим false
const tom = < name: "Tom">; const bob = < name: "Tom">; console.log(tom == bob); // false console.log(tom === bob); // false
Однако, что будет, если обе константы (переменных) хранят ссылку на один и тот же объект:
const tom = < name: "Tom">; const bob = tom; console.log(tom == bob); // true console.log(tom === bob); // true
В этом случае в обоих случаях мы получим true , поскольку значения обоих констант равны, так как по сути это одно и то же значение.
Сравнение объектов в JavaScript
Сравнение объектов в JavaScript может стать сложной задачей для новичков, ведь оно не столь прямолинейно, как сравнение примитивных типов данных, таких как числа или строки.
Рассмотрим типичный пример. Создадим два объекта, которые имеют одинаковые свойства и значения:
var person1 = ; var person2 = ;
Теперь, если мы попытаемся сравнить эти два объекта, используя оператор == или === , мы получим результат false .
console.log(person1 == person2); // false console.log(person1 === person2); // false
Это происходит потому, что в JavaScript два объекта считаются равными только в том случае, если они фактически являются одним и тем же объектом. Даже если все свойства объектов и их значения совпадают, это не делает объекты равными.
Один из способов обойти это — преобразовать каждый объект в строку JSON и сравнить эти строки.
var isEqual = JSON.stringify(person1) === JSON.stringify(person2); console.log(isEqual); // true
Этот метод работает, но имеет свои ограничения. Например, он не будет работать правильно, если порядок свойств в объектах различается.
Более надежный способ — это написать функцию, которая будет проходить через каждое свойство объекта и сравнивать его со свойством другого объекта.
function isDeepEqual(obj1, obj2) < var keys1 = Object.keys(obj1); var keys2 = Object.keys(obj2); if (keys1.length != keys2.length) < return false; >for (var key of keys1) < if (!keys2.includes(key) || !isDeepEqual(obj1[key], obj2[key])) < return false; >> return true; > console.log(isDeepEqual(person1, person2)); // true
Этот подход называется глубоким сравнением, и он позволяет сравнивать объекты на равенство, учитывая их структуру и содержимое.