We Keep Coding

Find the difference inside the same object based on certain properties

I have an object where at global level I have the changed values and inside one property called initialData I have the initial value, so what I am trying to do is, based on the array mentioned values I need to find whether the initialData has been changed or not.
const eligibleFields = ['address_line_1', "is_new"]
const object = {
"id": "1",
"isGetting": false,
"address_line_1": "Washington DC",
"address_line_2": "Newyork",
"isOpen": false,
"comment": "Changed Data",
"initialData": {
"id": 1,
"is_new": true,
"address": {
"address_line_1": "Washington",
"address_line_2": "Newyork",
},
"comment": "Initial Data"
}
}
Here first I need to loop through the mentioned fields like address_line_1 and take the value as Washington, now compare it outer not inside initialData, so outer its Washington DC, so there is a change.
Now I need to return a boolean value.
This is working, but is there a simple way?
const eligibleFields = ['address_line_2', "is_new"]
const object = {
"id": "1",
"isGetting": false,
"address_line_1": "Washington DC",
"address_line_2": "Newyork",
"isOpen": false,
"comment": "Changed Data",
"initialData": {
"id": 1,
"is_new": true,
"address": {
"address_line_1": "Washington",
"address_line_2": "Newyork",
},
"comment": "Initial Data"
}
}
function findVal(obj, key) {
var seen = new Set,
active = [obj];
while (active.length) {
var new_active = [],
found = [];
for (var i = 0; i < active.length; i++) {
Object.keys(active[i]).forEach(function(k) {
var x = active[i][k];
if (k === key) {
found.push(x);
} else if (x && typeof x === "object" &&
!seen.has(x)) {
seen.add(x);
new_active.push(x);
}
});
}
if (found.length) return found;
active = new_active;
}
return null;
}
let isChanged = eligibleFields.some(field => {
let initialValue = findVal(object.initialData, field)?.[0]
if (initialValue) {
let changedValue = findVal(object, field)?.[0]
if (changedValue != initialValue) {
console.log("changedValue =>",changedValue, ",", "initialValue =>",initialValue)
return true
}
}
})
console.log(isChanged)

This seems simpler to me:
const eligibleFields = ['address_line_1', "is_new"]
const object = {
"id": "1",
"isGetting": false,
"address_line_1": "Washington DC",
"address_line_2": "Newyork",
"isOpen": false,
"comment": "Changed Data",
"initialData": {
"id": 1,
"is_new": true,
"address": {
"address_line_1": "Washington",
"address_line_2": "Newyork",
},
"comment": "Initial Data"
}
}
const recursiveSearch = (obj, searchKey) => {
for (const [key, value] of Object.entries(obj)) {
if (key === searchKey && typeof value !== 'object') {
return value;
} else if (typeof value === 'object') {
return recursiveSearch(value, searchKey);
}
}
return undefined;
};
let isChanged = eligibleFields.some(field => {
if (!(field in object)) return false;
let initialValue = recursiveSearch(object.initialData, field);
let changedValue = object[field];
if (changedValue !== initialValue) {
console.log(`"${field}" was changed from ${initialValue} to ${changedValue}`)
return true
}
})
console.log(isChanged)
This assumes that only initialData has nested values, as the example provided implies. Anyways you should consider changing your JSON schema to match the initial data and the changed data.

If initialData does not have duplicate key names inside, I suggest to flaten the initialData first into an array of key value pairs so you can access it later by key names.
In below code first we are doing the conversion from this
{
"id": 1,
"is_new": true,
"address": {
"address_line_1": "Washington",
"address_line_2": "Newyork"
},
"comment": "Initial Data"
}
to this
{
"id": 1,
"is_new": true,
"address_line_1": "Washington",
"address_line_2": "Newyork",
"comment": "Initial Data"
}
by this code
function flatenInitialData(obj, res = {}){
for(let key in obj){
if(typeof obj[key] == 'object'){
flatenInitialData(obj[key], res);
} else {
res[key] = obj[key];
}
}
return res;
}
which goes into deepest level and takes the key value and adds it into a new key and value pair array
finally we just do one for loop only for eligibleFields which loops 2 times
Please note in below example if eligibleFields has a entry such as "is_new" but "is_new" is not in the outer array it will still count it as not changed but you can change this in the condition part inside the for loop code
const eligibleFields = ['address_line_2', "is_new"]
const object = {
"id": "1",
"isGetting": false,
"address_line_1": "Washington DC",
"address_line_2": "Newyork",
"isOpen": false,
"comment": "Changed Data",
"initialData": {
"id": 1,
"is_new": true,
"address": {
"address_line_1": "Washington",
"address_line_2": "Newyork",
},
"comment": "Initial Data"
}
}
function flatenInitialData(obj, res = {}){
for(let key in obj){
if(typeof obj[key] == 'object'){
flatenInitialData(obj[key], res);
} else {
res[key] = obj[key];
}
}
return res;
}
var flatInitialData = flatenInitialData(object["initialData"]);
function isChanged(){
var hasChanged = false;
for(var i = 0; i < eligibleFields.length; i++){
if(object[eligibleFields[i]]){
if(object[eligibleFields[i]] != flatInitialData[eligibleFields[i]]){
hasChanged = true;
}
}
}
return hasChanged;
}
console.log(isChanged())

How to search for a value in an array of objects that contain nested objects

I want to develop this functionality for searching/filtering a list. Basically, I'll get a search term from an input box and then I have to get all the items that include the search term from an array.
Here's what I've tried so far, it works for root level properties but doesn't work with nested arrays/objects:
// Filter List
this.filterList = query => {
if (typeof query === "string") {
// transform query to lowercase
query = query.toLowerCase();
// clear the current list being displayed
this.filteredList = [];
// filter the lsit and store the results with
// matching criteria in "filteredList" array
let filteredResults = _.filter(this.itemList, item => {
if (item && typeof item === "object") {
// loop over the item object
for (let property in item) {
if (item.hasOwnProperty(property)) {
let key = item[property];
// address, phone and emails
if (typeof key === "object" && _.isArray(key)) {
_.filter(key, element => {
if (typeof element === "object") {
for (let nestedProperty in element) {
let nestedKey = element[nestedProperty];
if (nestedKey) {
nestedKey = nestedKey.toString().toLowerCase();
}
if (nestedKey && nestedKey.includes(query)) {
return item;
}
}
}
});
} else {
if (key) key = key.toString().toLowerCase();
if (key && key.includes(query)) return item;
}
}
}
}
});
// assign the filtered results to the list being displayed
this.filteredList = [...filteredResults];
} else {
// if query is empty or null or anything other than string
// revert all changes and assign the original list to display list
this.filteredList = this.itemList;
}
};
If it helps, here's an object from the array that I am looping over:
[
{
"id": "number",
"dealerCode": "string",
"name": "string",
"gstin": "string",
"pan": "string",
"cin": "string",
"emails": [
{
"name": "string",
"address": "string",
"isPrimary": "boolean"
}
],
"phoneNumbers": [
{
"countryCode": "number",
"number": "number",
"isPrimary": "boolean"
}
],
"addresses": [
{
"addressLine1": "string",
"addressLine2": "string",
"addressLine3": "string",
"country": "string",
"state": "string",
"city": "string",
"postalCode": "number",
"isPrimary": "boolean"
}
],
"status": "string",
"statusId": "number"
}
]
I am doing this in AngularJS and using Lodash as well.

For a problem like this where you need to compare a heterogenous list of primitives and object/arrays, a recursive named function is usually the best way to go. This should probably solve what you're looking for, based on the following assumptions:
All entries by a user as treated as strings. So 99 and "99" are the same. I'll comment in the code where this assumption is made
All entries are case insensitive (all converted toLowercase)
There is no set depth of the nested objects/arrays; the solution below works recursively for any depth of a heterogeneous list
If anything matches in any leaf node, the entire object will be returned
The way the solution works below is:
Filter through the top level list and call matchesEntryInTree on each dataItem, compared to the userEntry
matchesEntryInTree will check each dataItem and see if it's an array or object
If the dataItem is an array/object, we drill into them again by calling matchesEntryInTree recursively
If it isn't, we call compareValues to see if the entry matches the current dataItem
With the recursive pattern above, all leaf nodes (regardless of the shape of the tree) will be compared to the initial userEntry
// test data for trial runs
const testData = [
{
id: 123488,
dealerCode: "ACb3",
name: "Some Name",
gstin: "string",
pan: "string",
cin: "string",
emails: [
{
name: "Some Email name",
address: "anemail.domain.com",
isPrimary: "boolean"
}
],
phoneNumbers: [
{
countryCode: "9398",
number: "number",
isPrimary: "boolean"
}
],
addresses: [
{
addressLine1: "Florida",
addressLine2: "Street place",
addressLine3: "string",
country: "string",
state: "string",
city: "string",
postalCode: "number",
isPrimary: "boolean"
}
],
status: "string",
statusId: "number"
},
{
id: 88888,
dealerCode: "NMC",
name: "Some Other",
gstin: "string",
pan: "string",
cin: "string",
emails: [
{
name: "An Email thing",
address: "athing.somewhere.org",
isPrimary: "boolean"
}
],
phoneNumbers: [
{
countryCode: "93948",
number: "number",
isPrimary: "boolean"
}
],
addresses: [
{
addressLine1: "Denver",
addressLine2: "Street place",
addressLine3: "string",
country: "string",
state: "string",
city: "string",
postalCode: "number",
isPrimary: "boolean"
}
],
status: "string",
statusId: "number"
}
];
// broke these into separate helper functions, but you can combine all of them except the recursive one if you'd like
const returnFilterResults = (userEntry, dataItems) => {
const compareValues = (entry, dataValue) => {
if ( _.isBoolean(dataValue)) {
return entry === dataValue;
} else if (_.isNumber(dataValue)) {
// if the dataValue is a number, we convert both it and the user's entry (which probably already is a string) to a string to compare
// you can make this comparison more strict if desired
return _.includes(_.toLower(_.toString(dataValue)), _.toLower(entry));
} else if (_.isString(dataValue)) {
return _.includes(_.toLower(dataValue), _.toLower(entry));
} else {
return false;
}
};
const matchesEntryInTree = (entry, dataItem) => {
// if this dataItem is an object or array, let's drill back in again
if (_.isObject(dataItem) || _.isArray(dataItem)) {
// as we recursively move through the tree, check to see if *any* of the entries match, using 'some'
return _.some(dataItem, innerDataItem => {
return matchesEntryInTree(entry, innerDataItem);
});
} else {
// if it's a primitive, then let's compare directly
return compareValues(entry, dataItem);
}
};
// I created a results variable so we could console log here in this snippet
// but you can just return from the filter directly
const results = _.filter(dataItems, dataItem => {
return matchesEntryInTree(userEntry, dataItem);
});
console.log(userEntry, results);
return results;
};
returnFilterResults("place", testData);
// both entries return
returnFilterResults("Denver", testData);
// second entry is returned
returnFilterResults(48, testData);
// both entries return - ID in first, countryCode in second
returnFilterResults(12, testData);
// first entry is returned
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.js"></script>

Why don't you use a flatten function to flatten your object/JSON then search for your value? An example for this is the following:
var flattenObject = function(ob) {
var toReturn = {};
for (var i in ob) {
if (!ob.hasOwnProperty(i)) continue;
if ((typeof ob[i]) == 'object') {
var flatObject = flattenObject(ob[i]);
for (var x in flatObject) {
if (!flatObject.hasOwnProperty(x)) continue;
toReturn[i + '.' + x] = flatObject[x];
}
} else {
toReturn[i] = ob[i];
}
}
return toReturn;
};
For a nested object, let's say
{
A : {
B: {
C: "V"
}
}
}
you'll get an object with the key A.B.C and the value "V". This way, you'll only have one level to search your value in.
Hope this helps!
Cheers!

How can I remove blank fields from a json?

So I am given a json and I have to clean it up, by removing all the 'blank' fields. The fields that are considered blank are:
empty arrays or objects,
strings with whitespace ("" or " "),
null values.
This is what I have so far:
const isBlank = (val) => {
if(val === null ) {
return true
}
if(typeof val === 'string'){
return val.trim().length === 0;
}
return val.length === 0
};
function clean(jsonInput) {
Object.keys(jsonInput).forEach( key => {
if(typeof jsonInput[key] === 'object' && !isEmpty(jsonInput[key])){
clean(jsonInput[key])
}else {
isEmpty(jsonInput[key_field]) && delete jsonInput[key]
}
})
}
This is the jsonInput I am working with:
{
"print": "notBlank",
"this": "notBlank",
"example": "notBlank",
"blank": null,
"allBlanks": [
{
"from": "",
"blank0": null
}
],
"att2": {
"blank1": "",
"blank2": []
},
"att3": {
"one": "1",
"two": "2",
"three": "3",
"blank3": " "
}
}
This should be the output:
{
"print": "notBlank",
"this": "notBlank",
"example": "notBlank",
"att3": {
"one": "1",
"two": "2",
"three": "3"
}
}
Instead I am getting this:
{
"print": "notBlank",
"this": "notBlank",
"example": "notBlank",
"allBlanks": [{ }],
"att2": {},
"att3": {
"one": "1",
"two": "2",
"three": "3",
}
}
It seams like I am unable to remove the objects... Any ideas what I am doing wrong? Any way I can fix it.
Also is there a way to do this so that I don't change the original object and instead I make a duplicate, maybe with map or filter?

The main issue here is that [{}] was not defined as "empty" because it was an array of length 1 with an object in it. However, because you would like empty objects to be considered empty, and thus arrays with empty objects to be empty, you need to also recurse inside of your isEmpty function to cover these angles.
Note the two recursive calls for arrays and objects added to isEmpty.
As for as copying goes, the quick dirty way would be to first stringify then parse the json. You can see this towards the bottom of the code with the line
var jsonCopy = JSON.parse(JSON.stringify(json));
There are more complex ways of deep copying as well, please read What is the most efficient way to deep clone an object in JavaScript? for more information there.
const isEmpty = (val) => {
if(val === null ) {
return true
}
if(typeof val === 'string'){
return val.trim().length === 0;
}
if(val instanceof Array){
if( val.length === 0 ) return true;
return val.every( v =>
isEmpty(v)
);
}
if(val === Object(val)){
if(Object.keys(val).length == 0) return true;
return Object.values(val).every(
v => isEmpty(v)
);
}
return val.length === 0;
};
function clean(jsonInput) {
Object.keys(jsonInput).forEach( key => {
if(typeof jsonInput[key] === 'object' && !isEmpty(jsonInput[key])){
clean(jsonInput[key])
}else {
isEmpty(jsonInput[key]) && delete jsonInput[key]
}
})
}
var json = {
"print": "notBlank",
"this": "notBlank",
"example": "notBlank",
"blank": null,
"allBlanks": [
{
"from": "",
"blank0": null
}
],
"att2": {
"blank1": "",
"blank2": []
},
"att3": {
"one": "1",
"two": "2",
"three": "3",
"blank3": " "
}
};
var jsonCopy = JSON.parse(JSON.stringify(json));
clean(jsonCopy);
console.log(jsonCopy);

Some features like this already exist in the lodash
https://lodash.com/docs/4.17.10#omitBy
Avoid using delete in javascript, its slow and not a good pratice
Example:
var _ = require("lodash")
var oldObj = {a:1, b:2, c:null, d:"aa"}
var newObj = _.omitBy(oldObj, (value, key) =>
_.isNull(value) ||
(_.isString(value) && _.isEmpty(value)) ||
(_.isArray(value) && _.isEmpty(value)) );
console.log("Final", newObj) //Final { a: 1, b: 2, d: 'aa' }
isEmpty return true if value is a number https://lodash.com/docs/4.17.10#isEmpty
Edit:
The keyword delete throws an exception in strict mode https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/delete

How to remove JSON elements which are "" (Empty Strings)?

I have a JSON in javascript. That contains such values as {id:""}. I need to drop those kind of values from the JSON object. Is there a simple way to do it?

A Json object is tree-like. You can use such a recursive function to walk and clean it:
function walkclean(x) {
var type = typeof x;
if (x instanceof Array) {
type = 'array';
}
if ((type == 'array') || (type == 'object')) {
for (k in x) {
var v = x[k];
if ((v === '') && (type == 'object')) {
delete x[k];
} else {
walkclean(v);
}
}
}
}
How to use the above code within the MongoDB shell:
var test = {
a: "foo",
b: [ "hi", "you", "", "ouch", "", "again!"],
c: [ { nasty: "me", hit: "", whatever: [ "yeah" ] },
{ ha: { my: "", oh: "yeah", foo: ""}} ],
d: "",
e: 42
};
printjson(test);
walkclean(test);
print('=>');
printjson(test);
Result:
snippets/walkclean$ mongo walkclean.js
MongoDB shell version: 2.4.10
connecting to: test
{
"a" : "foo",
"b" : [
"hi",
"you",
"",
"ouch",
"",
"again!"
],
"c" : [
{
"nasty" : "me",
"hit" : "",
"whatever" : [
"yeah"
]
},
{
"ha" : {
"my" : "",
"oh" : "yeah",
"foo" : ""
}
}
],
"d" : "",
"e" : 42
}
=>
{
"a" : "foo",
"b" : [
"hi",
"you",
"",
"ouch",
"",
"again!"
],
"c" : [
{
"nasty" : "me",
"whatever" : [
"yeah"
]
},
{
"ha" : {
"oh" : "yeah"
}
}
],
"e" : 42
}

You can use the delete command.
delete obj.id;
From the documentation:
delete
The delete operator removes a property from an object.
What you would want to do is iterate over all the objects in your JSON and when you detect an empty id attribute obj.id == "", you'll execute the delete command.
If you have multiple properties that you want to delete, you'll have to iterate over each one and test it against an empty string. If you are not sure how many attributes you'll want to remove then you'll simply have to iterate over each attribute for each object.

Concatenate two json object

is there any way to Aggregation two json object together and assign the result to the first object
i have tow Json object and i want to Aggregation them into one object
<script type="text/javascript">
$(document).ready(function () {
var FirstObject= [
{ "label": "salem", "actor": "" },
{ "label": "Aragorn", "actor": "Viggo Mortensen" },
{ "label": "Arwen", "actor": "Liv Tyler" },
{ "label": "Bilbo Baggins", "actor": "Ian Holm" },
{ "label": "Boromir", "actor": "Sean Bean" },
{ "label": "Frodo Baggins", "actor": "Elijah Wood" },
{ "label": "Gandalf", "actor": "Ian McKellen" },
{ "label": "Gimli", "actor": "John Rhys-Davies" },
{ "label": "Gollum", "actor": "Andy Serkis" },
{ "label": "Legolas", "actor": "Orlando Bloom" },
{ "label": "Meriadoc Merry Brandybuck", "actor": "Dominic Monaghan" },
{ "label": "Peregrin Pippin Took", "actor": "Billy Boyd" },
{ "label": "Samwise Gamgee", "actor": "Sean Astin" }
];
$("#search").keyup(function () {
$.ajax({
type: "POST",
dataType: "json",
contentType: "application/json",
url: "WebService1.asmx/GetDocumentNames",
data: '{ }',
success: function (data) {
**FirstObject =data.d**
},
error: function () { aler("Salem Error"); }
}
);
});
});
</script>
so on the statement FirstObject =data.d i want the Aggregation

Use jQuery extend like this:
// first argument tells jQuery's extend to deep copy the properties
$.extend( true, FirstObject, data.d );
quote from jQuery documentation:
Merge two objects recursively, modifying the first.

Your variable FirstObject is actually an array, and assuming what you receive is not an Array but a JSON Object to append or aggregate it to the array, you just need to call the Array's method push.
FirstObject.push(data.d);
If what you're receiving is a JSON Array rather that a JSON Object, you could use the concat method in the array.
FirstObject.concat(data.d);

Take a look in below example:
var jsonArray1 = [{'name': "doug", 'id':5}, {'name': "dofug", 'id':23}];
var jsonArray2 = [{'name': "goud", 'id':1}, {'name': "doaaug", 'id':52}];
jsonArray1 = jsonArray1.concat(jsonArray2);

If you want to merge the JSON objects and maintain the common keys.
var object1 = {
'key1': 10,
'key2': 'Hello ',
'key3': [
'I',
'am'
],
'key4': {
'key5': 'Hi',
'key6': 11
}
};
var object2 = {
'key1': 11,
'key2': 'World',
'key3': [
'an',
'Array'
],
'key4': {
'key5': ' there',
'key6': '#SomeRandomString'
}
};
function isArray(value) {
return Object.prototype.toString.call(value) === '[object Array]';
}
function isObject(value) {
return Object.prototype.toString.call(value) === '[object Object]';
}
var result = {};
for (var key in object1) {
if (object1.hasOwnProperty(key) && object2.hasOwnProperty(key)) {
//check if the value is of type array (works for key 3)
if (isArray(object1[key]) && isArray(object2[key])) {
result[key] = [];
for (var i in object1[key]) {
result[key].push(object1[key][i])
}
for (var i in object2[key]) {
result[key].push(object2[key][i])
}
}
//check if the value is of type object (works for key 4)
else if (isObject(object1[key])) {
result[key] = {};
for (var key_inner in object1[key]) {
if (object1[key].hasOwnProperty(key_inner) && object2[key].hasOwnProperty(key_inner)) {
result[key][key_inner] = object1[key][key_inner] + object2[key][key_inner];
}
}
} else {
result[key] = object1[key] + object2[key];
}
}
}
//console.log(JSON.stringify(result));
console.log(result);

You can use Object.assign() method to concatenate a json object. The Object.assign() method is used to copy the values of all enumerable own properties from one or more source objects to a target object.[1]
var o1 = { a: 1 }, o2 = { b: 2 }, o3 = { c: 3 };
var obj = Object.assign(o1, o2, o3);
console.log(obj); // { a: 1, b: 2, c: 3 }