Develop Reference

Compare 2 Object and list out Missing key and Change in Value Recursively [duplicate]

This question already has answers here:
How to compare two objects and get key-value pairs of their differences?
(7 answers)
Closed 4 months ago.
want to compare 2 out and miss out missing field and change in value recursively
obj1 = {
"val1": "test",
"stream": {
"key": true,
"value": false
},
"val2": "test",
"val3": "test",
}
obj2 = {
"val1": "test",
"stream": {
"key": false,
"value": false
}
}
I need 2 outputs as below
output1 = {
"val2": "test",
"val3": "test"
}
output2 = {
"stream": {
"key": true
}
}

It is some version of deep comparing objects. I combined both outputs into one function since they both represent a different attribute.
var obj1 = {
"val1": "test",
"stream": {
"key": true,
"value": false
},
"val2": "test",
"val3": "test",
}
var obj2 = {
"val1": "test",
"stream": {
"key": false,
"value": false
}
}
function diffCompare(obj1, obj2) {
var list = [];
function is_obj(obj) {
return typeof obj === 'object' && obj !== null
}
function iterate(obj1, obj2, path) {
path = path || []
Object.keys(obj1).forEach(function(key) {
if (obj1[key] != obj2[key]) {
if (is_obj(obj1[key]) && is_obj(obj2[key])) {
iterate(obj1[key], obj2[key], path.concat(key))
} else {
list.push({
path: path.concat(key),
value: obj1[key]
})
}
}
})
}
iterate(obj1, obj2)
// console.log(list)
// building result object:
var result = list.reduce(function(agg, {path, value}) {
var pointer = agg;
while (path.length) {
var part = path.shift();
pointer[part] = pointer[part] || {}
if (path.length) {
pointer = pointer[part]
} else {
pointer[part] = value;
}
}
return agg;
}, {});
return result;
}
console.log(diffCompare(obj1, obj2))
.as-console-wrapper {
max-height: 100% !important
}

How to get the parent object value using child value

I have value "b" with me and I want to get the item "3648" using that how can I do that using JavaScript?
{
"someID": "16385421",
"items": {
"9836": {
"id": "a"
},
"3648": {
"id": "b"
},
"7738": {
"id": "c"
}
}
}
o/p
"3648": {
"id": "b"
}

Edited after your comment:
getByItemId = ( val ) => {
let result;
for( let elem in data.items ){
const check = data.items[ elem ];
if( check.id == val ) result = check;
}
console.log( result )
return result;
}
getByItemId( "b" )

You could do it with some code that resembled the following.
First we get all of the object keys in the obj.items object.
Next we iterate through them.
At each step, we check to see if the desired ID is contained within the sub-object indexed by the current key in the array. If it's found, we update the result object.
We then return an empty object if the key isn't present, and something like the following if it was found: {key: '3648', id: 'b'}.
"use strict";
function byId(id){return document.getElementById(id)}
function qs(sel,parent=document){return parent.querySelector(sel)}
function qsa(sel,parent=document){return parent.querySelectorAll(sel)}
window.addEventListener('load', onLoaded, false);
var rawData = {
"someID": "16385421",
"items": {
"9836": {
"id": "a"
},
"3648": {
"id": "b"
},
"7738": {
"id": "c"
}
}
};
function getIDs(data, searchItemId)
{
let keys = Object.keys(data.items);
let result = {};
keys.forEach( keyFunc );
return result;
function keyFunc(elem, index, collection)
{
if (data.items[elem].id == searchItemId)
{
result.key = elem;
result.id = searchItemId;
}
}
}
function onLoaded(evt)
{
console.log( getIDs(rawData, "b") );
}

You can do:
const obj = {
someID: '16385421',
items: {
9836: {
id: 'a',
},
3648: {
id: 'b',
},
7738: {
id: 'c',
},
},
}
const getParentObjectByValue = (obj, value) => {
const key = Object.keys(obj.items).find((k) => obj.items[k].id === value)
return key ? { [key]: obj.items[key].id } : undefined
}
console.log(getParentObjectByValue(obj, 'b'))
console.log(getParentObjectByValue(obj, 'zz'))

javascript how to compare only keys and not values of json

I have two nested JSON objects
//Json object1
{
"version": "1",
"user": {
"id": 123
}
}
//Json object2 =
{
"version": "1",
"user": {
"i": 123
}
}
1)It should only check for keys and not values during comparison.
So above should return false and below should return true
2) It should also follow the structure say user.id is not the same as just id.
//Json object1
{
"version": "1",
"user": {
"id": 123
}
}
//Json object2
{
"version": "1",
"user": {
"id": 12
}
}
I have tried the code below but to no avail
exports.compareObjects = async(model, response) => {
switch (Object.prototype.toString.call(model)) {
case '[object]':
var x;
var mKeys = Object.keys(model);
for (x in mKeys) {
return this.compareObjects(Object.keys(model)[x], Object.keys(response)[x]);
}
break;
case '[object Object]':
var x1;
var mKeys1 = Object.keys(model);
for (x1 in mKeys1) {
return this.compareObjects(Object.keys(model)[x1], Object.keys(response)[x1]);
}
break;
case '[object Array]':
return this.compareObjects(model[0], response[0]);
// case '[object String]':
// return model === response;
default:
return true;
}
};

This uses a recursive key search to build out an array of keys in each object you want to compare.
It tests fairly strict equality (no extra keys in either object)
let obj1 = JSON.parse(`{
"version": "1",
"user": {
"id": 123
}
}`);
let obj2 = JSON.parse(`{
"version": "1",
"user": {
"i": 123
}
}`);
let obj3 = JSON.parse(`{
"version": "1",
"user": {
"id": 123
}
}`);
let obj4 = JSON.parse(`{
"version": "1",
"user": {
"id": 12
}
}`);
let test1 = structureIsEqual(obj1, obj2);
let test2 = structureIsEqual(obj3, obj4);
console.log('Structure of first two match: ' + test1);
console.log('Structure of second two match: ' + test2);
function structureIsEqual(obj1, obj2) {
let tree1 = getKeys(obj1).sort();
let tree2 = getKeys(obj2).sort();
if(tree1.length !== tree2.length)
return false;
let mismatch = tree1.find((x, idx) => tree2[idx] !== x);
return !mismatch;
}
function getKeys(obj) {
return recursiveKeys(obj, [], []);
}
function recursiveKeys(obj, result, todo, root = '') {
Object.keys(obj).forEach(key => {
if(typeof obj[key] === 'object') {
result.push(root + key);
todo.push({ obj: obj[key], root: root + key + '.' });
} else {
result.push(root + key);
}
});
if(todo.length > 0) {
let todoItem = todo.pop();
return recursiveKeys(todoItem.obj, result, todo, todoItem.root);
}else {
return result;
}
}

Could be you could fix it by this line
return this.compareObjects(Object.keys(model)[x1], Object.keys(response)[x1]);
Instead do
return this.compareObjects(model[x1], response[x1]);
I would do it like this
1. you only need to compare objects (all other dont have keys)
2. recurse if value is also object
function compare(obj,model){
let keys=Object.keys(model)
let thisLevelOK=true
for (let key in keys.length){
if (obj[key]===undefined){
thisLevelOK=false
break
} else if (model[key].toString()=="[object Object]" && compare(obj[key],model[key])==false){
thisLevelOK=false
break
}
}
//in case obj has more keys then model
thisLevelOK=thisLevelOK && compare(model,obj)
return thisLevelOK
}

var compareObjects = (model, response) => {
switch (Object.prototype.toString.call(model)) {
case '[object]':
var x;
var mKeys = Object.keys(model);
for (x in mKeys) {
return this.compareObjects(Object.keys(model)[x], Object.keys(response)[x]);
}
break;
case '[object Object]':
var x1;
var mKeys1 = Object.keys(model);
for (x1 in mKeys1) {
let t = this.compareObjects(Object.keys(model)[x1], Object.keys(response)[x1]);
if(!t){
return false
}
if(typeof model[mKeys1[x1]] == "object"){
return this.compareObjects(model[mKeys1[x1]], response[mKeys1[x1]])
}
}
case '[object Array]':
return this.compareObjects(model[0], response[0]);
case '[object String]':
return model === response;
default:
return true;
}
};
let a = {
"version": "1",
"user": {
"id": 123,
"n":"d",
"j":{
"ns":"m"
}
}
}
let b = {
"version": "1",
"user": {
"id": 123,
"n":"d",
"j":{
"ns":"m"
}
}
}
var t = compareObjects(a,b)
console.log(t)

Getting bug in recursive functions?

I am using an array with nested object of array. Assigning the values in array's values according to input line index, values are passed into the array's indexed value. I have checked the condition that if in array object is there, it converts it into array and call the recursive function and it calls recursion until the object's array's value is full but don't know why it is not working properly. Please help me in this bug
(function($) {
var xmlOutput = document.querySelector(".xmlOutput");
let templateStore = [];
let preservedEntriesValue = [];
let selectedTemplate = [];
function generateDOMDropdown(selectedID) {
let optionTemplate = templateStore.map(function(entry) {
return `<option value="${
entry.id
}" ${entry.id === selectedID ? "selected" : ""}>${entry.name}</option>`;
});
$("#select").html(optionTemplate);
}
function processEntries(entries) {
let output = "";
for (const entry of entries) {
output += entry;
}
return output;
}
function parseJSONToXML(input) {
const domStructure = input.entriesValue.map(function(tagObj) {
if (typeof tagObj === "string") {
return `<${tagObj}></${tagObj}>`;
} else if (Array.isArray(tagObj)) {
if (tagObj.length > 1) {
return `<${tagObj[0]}>${tagObj[1]}</${tagObj[0]}>`;
} else if (tagObj.length == 1) {
return `<${tagObj[0]}></${tagObj[0]}>`;
}
} else {
const outerTag = Object.keys(tagObj).pop();
const innerDOM = parseJSONToXML({ entriesValue: tagObj[outerTag] });
return `<${outerTag}>${processEntries(innerDOM)}</${outerTag}>`;
}
});
return domStructure;
}
function preFillSelected() {
const root = selectedTemplate.root;
const domStructure = parseJSONToXML(selectedTemplate);
xmlOutput.innerText = vkbeautify.xml(
`<?xml version="1.0" encoding="UTF-8"?><${root}>${processEntries(
domStructure
)}</${root}>`,
5
);
}
$.ajax({
type: "get",
url: window.location.origin + "/templates.json",
success: function(data) {
templateStore = data;
if (data.length > 0) {
selectedTemplate = data[0];
generateDOMDropdown(selectedTemplate.id);
preservedEntriesValue = selectedTemplate.entriesValue;
preFillSelected();
$("#select")
.off("change")
.on("change", function() {
selectedTemplate = templateStore[$("#select").val()];
preservedEntriesValue = selectedTemplate.entriesValue;
preFillSelected();
window.template = selectedTemplate;
});
}
}
});
function generateValueJSON(
template,
lines,
inputLen,
templateLen,
flatLen,
cidx
) {
cidx = cidx || 0;
// console.log('Entry', lines, template, cidx);
return Array.from(template.entriesValue.entries()).map(([idx, entry]) => {
console.log("Lines", lines);
if (idx < lines.length) {
if (Array.isArray(entry)) {
return [entry[0], lines[idx]];
} else if (typeof entry === "object") {
// debugger;
const outerTag = Object.keys(entry).pop();
const innerLength = entry[outerTag].length;
if (cidx === 0) cidx = idx;
const outerIdx = cidx + innerLength;
// console.log((flatLen - templateLen - inputLen));
// console.log({ flatLen, templateLen, inputLen, outerIdx, cidx, idx });
const innerObj = generateValueJSON(
{ entriesValue: entry[outerTag] },
lines.slice(idx, outerIdx),
inputLen,
templateLen,
flatLen,
idx
);
// cidx = 0;
entry[outerTag] = innerObj;
return entry;
}
return [entry, lines[idx]];
}
return entry;
});
}
function mapLength(template) {
return template.entriesValue
.map((entry) => {
return typeof entry === "object"
? [Object.keys(entry), Object.values(entry)]
: entry;
})
.flat(3).length;
}
$("#txtInput").on("keyup", function() {
const lines = $(this)
.val()
.split("\n\n")
.map((v) => v.trim().replace(/\n/g, "<br/>"));
// console.log(preservedEntriesValue);
selectedTemplate.entriesValue = preservedEntriesValue;
templateLength = mapLength(selectedTemplate);
const newEntriesValue = generateValueJSON(
selectedTemplate,
lines,
lines.length,
selectedTemplate.entriesValue.length,
templateLength
);
// console.log(newEntriesValue);
selectedTemplate.entriesValue = newEntriesValue;
preFillSelected();
});
})(window.jQuery, Node);
//here is the data array
[{
"id": "1",
"name": "Template Name 2",
"root": "media",
"entriesValue": [
"mediaid",
"category",
"provider",
"date",
"caption_photo_1",
{
"image": [
"imageid",
"type",
"width",
"hfive"
]
},
{
"video": [
"name",
"type",
"bitrate",
"size",
"width",
"hfive",
"headline",
"summary"
]
}
]
},
{
"id": "0",
"name": "Template Name 1",
"root": "article",
"entriesValue": [
"author",
"headline",
"cats",
"subcats",
"image",
"video",
"tags",
"summary",
"content"
]
},
{
"id": "2",
"name": "Template Name 3",
"root": "article",
"entriesValue": [
"author",
"headline",
"cats",
"subcats",
"image",
"video",
"summary",
"content",
"keyword"
]
},
{
"id": "3",
"name": "Template Name 4",
"root": "root",
"entriesValue": [
"description",
"title",
"languageId",
"categoryIds"
]
}
]
At first input it work properly but in second input it passes the value in in both object
<image>
<imageid>Correct</imageid>
<type>bug</type>
<width>bug</width>
<hfive></hfive>``
</image>
<video>
<name>bug</name>
<type>bug</type>
<bitrate></bitrate>
<size></size>
<width></width>
<hfive></hfive>
<headline></headline>
<summary></summary>
</video>

How can I filter a JSON object in JavaScript?

I've got the following JSON string:
{
"Alarm":{
"Hello":48,
"World":3,
"Orange":1
},
"Rapid":{
"Total":746084,
"Fake":20970,
"Cancel":9985,
"Word": 2343
},
"Flow":{
"Support":746084,
"About":0,
"Learn":0
}
}
Then I load the above string and convert it to json object:
jsonStr = '{"Alarm":{"Hello":48,"World":3,"Orange":1},"Rapid":{"Total":746084,"Fake":20970,"Cancel":9985},"Flow":{"Support":746084,"About":0,"Learn":0}}';
var jsonObj = JSON.parse(jsonStr);
Now, how can I filter this json object by key name?
E.g., if the filter was "ange", the filtered object would be:
{
"Alarm":{
"Orange":1
}
}
If the filter was "flo", the filtered object would become:
{
"Flow":{
"Support":746084,
"About":0,
"Learn":0
}
}
And if the filter was "wor", the result would be:
{
"Alarm":{
"World": 3,
},
"Rapid":{
"Word": 2343
}
}
Is it possible to achieve this filtering using the filter method?

Beside the given solutions, you could use a recursive style to check the keys.
This proposal gives the opportunity to have more nested objects inside and get only the filtered parts.
function filterBy(val) {
function iter(o, r) {
return Object.keys(o).reduce(function (b, k) {
var temp = {};
if (k.toLowerCase().indexOf(val.toLowerCase()) !== -1) {
r[k] = o[k];
return true;
}
if (o[k] !== null && typeof o[k] === 'object' && iter(o[k], temp)) {
r[k] = temp;
return true;
}
return b;
}, false);
}
var result = {};
iter(obj, result);
return result;
}
var obj = { Alarm: { Hello: 48, "World": 3, Orange: 1 }, Rapid: { Total: 746084, Fake: 20970, Cancel: 9985, Word: 2343 }, Flow: { Support: 746084, About: 0, Learn: 0 }, test: { test1: { test2: { world: 42 } } } };
console.log(filterBy('ange'));
console.log(filterBy('flo'));
console.log(filterBy('wor'));
.as-console-wrapper { max-height: 100% !important; top: 0; }

You can create a function using reduce() and Object.keys() that will check key names with indexOf() and return the desired result.
var obj = {
"Alarm": {
"Hello": 48,
"World": 3,
"Orange": 1
},
"Rapid": {
"Total": 746084,
"Fake": 20970,
"Cancel": 9985,
"Word": 2343
},
"Flow": {
"Support": 746084,
"About": 0,
"Learn": 0
}
}
function filterBy(val) {
var result = Object.keys(obj).reduce(function(r, e) {
if (e.toLowerCase().indexOf(val) != -1) {
r[e] = obj[e];
} else {
Object.keys(obj[e]).forEach(function(k) {
if (k.toLowerCase().indexOf(val) != -1) {
var object = {}
object[k] = obj[e][k];
r[e] = object;
}
})
}
return r;
}, {})
return result;
}
console.log(filterBy('ange'))
console.log(filterBy('flo'))
console.log(filterBy('wor'))

With the filter method I think you mean the Array#filter function. This doesn't work for objects.
Anyway, a solution for your input data could look like this:
function filterObjects(objects, filter) {
filter = filter.toLowerCase();
var filtered = {};
var keys = Object.keys(objects);
for (var i = 0; i < keys.length; i++) {
var key = keys[i];
if (objects.hasOwnProperty(key) === true) {
var object = objects[key];
var objectAsString = JSON.stringify(object).toLowerCase();
if (key.toLowerCase().indexOf(filter) > -1 || objectAsString.indexOf(filter) > -1) {
filtered[key] = object;
}
}
}
return filtered;
}