Filtering JSON Array - javascript

I need to add filter option to my grid.I use Fixed Data Table.Here is simple filtering example with that grid.
https://github.com/facebook/fixed-data-table/blob/master/examples/old/FilterExample.js
This example filter the Json array only by first name.But I need to filter by all of the objects in JSON Array.
For example may JSON array is here:
{"id":7,"first_name":"Sarah","last_name":"Hottie",
"country":"Sweden","salary":12000},
{"id":9,"first_name":"Mary","last_name":"Parah",
"country":"Argentina","salary":10000}
When I write "arah" to the general input filter value.I need to show both of the two elements of array.Because "id:7" first name (Sarah) and "id:9" last name (Parah) include my filter value ("arah").
If the country value of the another element of JSON array include "arah" I need to show that too.
So I need to filter the JSON array by all of the values it include.
What do you suggest?

You can utilize the filter prototype of the array. It will be something like this:
var arr = [ {"id":7,"first_name":"Sarah","last_name":"Hottie",
"country":"Sweden","salary":12000}, {"id":9,"first_name":"Mary","last_name":"Parah","country":"Argentina","salary":10000}]
var runFilter = function(arr,searchKey) {
var filterFn = function(obj) {
// Iterate the obj for each key.
for (var k in obj) {
if (typeof obj[k] == "string" && obj[k].indexOf(searchKey) >= 0) {
return true;
}
}
}
return arr.filter(filterFn);
}
var filteredArr = runFilter(arr,'arah')

I suggest to use Array#filter in combination with Array#some and a check of the type.
var data = [{ "id": 7, "first_name": "Sarah", "last_name": "Hottie", "country": "Sweden", "salary": 12000 }, { "id": 9, "first_name": "Mary", "last_name": "Parah", "country": "Argentina", "salary": 10000 }],
search = 'arah',
result = data.filter(function (a) {
return Object.keys(a).some(function (k) {
if (typeof a[k] === 'string' && ~a[k].indexOf(search)) {
return true;
}
if (typeof a[k] === 'number' && ~a[k] === search) {
return true;
}
});
});
document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');

You can find the filter function in line 45 of the example code. It is
return row['firstName'].toLowerCase().indexOf(filterBy.toLowerCase()) >= 0
If you want to look into every part of an Object, you can use a for...in loop:
for(var key in row){
if((row[key] + "").indexOf(filterBy) > -1){
return true;
}
}
return false;
Replace line 45 with the code above and you should be fine.

Try This :
<script type="text/javascript">
var arr = [ {"id":7,"first_name":"Sarah","last_name":"Hottie","country":"Sweden","salary":12000},
{"id":8,"first_name":"Mary","last_name":"Parah","country":"Argentina","salary":10000},
{"id":9,"first_name":"Gold","last_name":"sonam","country":"India","salary":15000}];
var filterKey = 'arah';
function findJsonString(arr,filterKey){
var result = [];
for (var i = arr.length - 1; i >= 0; i--) {
var part1 = arr[i].first_name.indexOf(filterKey);
var part2 = arr[i].last_name.indexOf(filterKey);
// console.log(arr[i]);
// console.log(' part 1 : ' + part1 + ' part 2 : ' + part2);
if(part1 != -1 || part2 != -1)
{
result[+i] = arr[i];
// OR result.push(arr[i]);
}
}
return result;
}
console.log(findJsonString(arr,filterKey));
</script>
OUTPUT :
[Object { id=7, first_name="Sarah", last_name="Hottie", more...}, Object { id=8, first_name="Mary", last_name="Parah", more...}]

Related

get key name and values of a nested JSON object if element is not object

I have an object whose keys I don't know but structure is basically the same. Value can be a string or another object of strings/objects. Here is an example:
d = {
"name": "Sam",
"grade": 9,
"classes": {
"a": 1,
"b": 2
},
"age": null
}
What I want now is if value is not another object, get the key name and its value. If value is null, return empty string. From the above the expected output is:
name=Sam, grade=9, a=1, b=2, age=''
Here since classes is object, it has to be looped again to get keys (a,b) and values (1,2).
I tried the following but it gives if any of the values is null, it returns an error:
Cannot convert undefined or null to object
It works well if there is no null value:
function getKeyValues(data) {
var q = '';
f(data);
function f(s) {
Object.keys(s).forEach(function(key) {
if (typeof s[key] === 'object') {
f(s[key]);
} else {
q = q + key + '=' + (s[key] == null) ? "" : s[key] + '&';
}
});
}
return q;
}
d = {
"name": "Sam",
"grade": 9,
"classes": {
"a": 1,
"b": 2
},
"age": null
}
console.log(getKeyValues(d));
Try this one:
function getKeyValues(data) {
var q = [];
var keys = Object.keys(data);
for (var i = 0; i < keys.length; i++) {
var key = keys[i];
var value = data[key];
if (value == null) {
q.push(key + "=''");
} else if (typeof value == "object") {
q.push(getKeyValues(value));
} else {
q.push(key + "=" + value);
}
}
return q.join(",");
}
Another approach is to use the reduce method. Personally I find it a little bit cleaner.
function getKeyValues(d) {
return Object.keys(d).reduce((memo, key) => {
if (!d[key]) {
memo[key] = '';
} else if (typeof d[key] === 'object') {
Object.keys(d[key]).forEach((subKey) => {
memo[subKey] = d[key][subKey];
})
} else {
memo[key] = d[key];
}
return memo;
}, {})
}
Also, while your question is very clear, I must say that it also makes me a little bit wary. You could find yourself in some difficult debugging situations if property names are ever repeated in nested objects. For example, if
d={"name":"Sam","grade":9,"buddy":{"name":"Jeff","age":12}}
would you expect name be "Sam" or "Jeff"? A function that answers your question could return either, so that is something to be aware of going forward.

How can I find out the array position of an object by searching the array?

If I have an array like this:
var array1 =
[
{"phraseId":"abc",
"keyword":"bb",
"posId":1},
{"phraseId":"def",
"keyword":"bb",
"posId":1},
]
How can I find out that the object with phraseId of "def" has the 2nd position?
You could map your object and only return the target field, and then use the built in indexOf to get the position:
array1.map(item => item.phraseId).indexOf('def')
Use native JavaScript findIndex method.
var array1 = [{
"phraseId": "abc",
"keyword": "bb",
"posId": 1
}, {
"phraseId": "def",
"keyword": "bb",
"posId": 1
}, ];
var pos = array1.findIndex(function(v) {
// set your condition for finding object
return v.phraseId == 'def';
// add `1` since you want to count from `1`
}) + 1;
console.log("Position of the object " + pos);
For older browser check polyfill option.
With ES6 arrow function
var array1 = [{
"phraseId": "abc",
"keyword": "bb",
"posId": 1
}, {
"phraseId": "def",
"keyword": "bb",
"posId": 1
}, ];
var pos = array1.findIndex(v => v.phraseId == 'def') + 1;
console.log("Position of the object " + pos);
It works this way :
array1.forEach((elem, index) => {if (elem.phraseId === "def")
console.log("index = " + index);
});
Assuming that your key is know (that you know you are looking for a phraseId always) then you can simply iterate through the array with a normal for loop if you are using "traditional" JS, or with a forEach if you are using ES6. Here's the simple for implementation.
for (var i = 0; i < array1.length; i++ ){
if(array[i].phraseId === 'def') {
// we know "i" is the index, so do something...
}
}
To make it more generic so you can search any array for any key, make a function of it that returns the index:
function whatIndex (arr, key, val) {
for (var i = 0; i < arr.length; i++) {
if( arr[i][key] === val ) {
return i;
}
}
}

Check if an object with index is in array

$.each(constructions, function(i,v) {
if ($.inArray(v.name, map[ii].buildings) == -1) {//stuff}
};
Where constructions is an array of objects, each with a unique name. map[ii].buildings is an array containing some of these objects. I want to iterate each object in constructions, checking if its name parameter appears in the objects of map[ii].buildings.
The above code works if the each element in the map[ii].buildings array is just the text string of the object name, but not if the element is the entire object.. close, but no dice >.<
Try using $.grep() instead of $.inArray(); you can specify a function to do the filtering for you.
Instead of checking for -1, you check whether the array that $.grep() returns has length == 0
Simple example: (would be easier if you posted the code / example of what "constructions" objects look like)
var constructions = [{
Name: "Mess hall",
SqFt: 5000
}, {
Name: "Infirmary",
SqFt: 2000
}, {
Name: "Bungalow",
SqFt: 2000
}, {
Name: "HQ",
SqFt: 2000
}];
var buildings = [{
Name: "Infirmary",
SqFt: 2000
}, {
Name: "HQ",
SqFt: 2000
}];
// found buildings will be list of items in "constructions" that is not in "buildings"
var foundBuildings = $.grep(constructions, function (constructionsItem) {
return $.grep(buildings, function (buildingsItem) {
return buildingsItem.Name === constructionsItem.Name
}).length == 0; // == 0 means "not in", and > 0 means "in"
});
// this just renders the results all pretty for ya
$.each(foundBuildings, function (idx, item) {
$("#output").append("<div>" + item.Name + "</div>");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id='output'></div>
Example jsFiddle: http://jsfiddle.net/eLeuy9eg/3/
The non-jQuery way of doing this would be to use filter. Something like this:
// pass in an array and the key for which you want values
// it returns an array of those values
function getValues(arr, key) {
return arr.map(function (el) { return el[key]; });
}
function notFoundIn(arr, arr2) {
// grab the names of the buildings
var buildings = getValues(arr2, 'name');
// grab the names from the construction objects and filter
// those that are not in the building array
return getValues(arr, 'name').filter(function (el) {
return buildings.indexOf(el) === -1;
});
}
notFoundIn(constructions, buildings); // eg [ "one", "three" ]
DEMO
You could even add a new method to the array prototype. With this one you can use either simple arrays, or arrays of objects if you pass in a key. Note in this example I've replaced map and filter with loops that perform the same functions, but faster (see comments):
function getValues(arr, key) {
var out = [];
for (var i = 0, l = arr.length; i < l; i++) {
out.push(arr[i][key]);
}
return out;
}
if (!Array.prototype.notFoundIn) {
Array.prototype.notFoundIn = function (inThisArray, key) {
var thisArr = key ? getValues(this, key) : this;
var arrIn = key ? getValues(inThisArray, key) : inThisArray;
var out = [];
for (var i = 0, l = thisArr.length; i < l; i++) {
if (arrIn.indexOf(thisArr[i]) === -1) {
out.push(thisArr[i]);
}
}
return out;
}
}
constructions.notFoundIn(buildings, 'name');
[1, 2, 3].notFoundIn([2]); // [1, 3]
DEMO

Remove duplicate objects from an array using javascript

I am trying to figure out an efficient way to remove objects that are duplicates from an array and looking for the most efficient answer. I looked around the internet everything seems to be using primitive data... or not scalable for large arrays. This is my current implementation which is can be improved and want to try to avoid labels.
Test.prototype.unique = function (arr, artist, title, cb) {
console.log(arr.length);
var n, y, x, i, r;
r = [];
o: for (i = 0, n = arr.length; i < n; i++) {
for (x = 0, y = r.length; x < y; x++) {
if (r[x].artist == arr[i].artist && r[x].title == arr[i].title) {
continue o;
}
}
r.push(arr[i]);
}
cb(r);
};
and the array looks something like this:
[{title: sky, artist: jon}, {title: rain, artist: Paul}, ....]
Order does not matter, but if sorting makes it more efficient then I am up for the challenge...
and for people who do not know o is a label and it is just saying jump back to the loop instead of pushing to the new array.
Pure javascript please no libs.
ANSWERS SO FAR:
The Performance Test for the answers below:
http://jsperf.com/remove-duplicates-for-loops
I see, the problem there is that the complexity is squared. There is one trick to do it, it's simply by using "Associative arrays".
You can get the array, loop over it, and add the value of the array as a key to the associative array. Since it doesn't allow duplicated keys, you will automatically get rid of the duplicates.
Since you are looking for title and artist when comparing, you can actually try to use something like:
var arrResult = {};
for (i = 0, n = arr.length; i < n; i++) {
var item = arr[i];
arrResult[ item.title + " - " + item.artist ] = item;
}
Then you just loop the arrResult again, and recreate the array.
var i = 0;
var nonDuplicatedArray = [];
for(var item in arrResult) {
nonDuplicatedArray[i++] = arrResult[item];
}
Updated to include Paul's comment. Thanks!
Here is a solution that works for me.
Helper functions:
// sorts an array of objects according to one field
// call like this: sortObjArray(myArray, "name" );
// it will modify the input array
sortObjArray = function(arr, field) {
arr.sort(
function compare(a,b) {
if (a[field] < b[field])
return -1;
if (a[field] > b[field])
return 1;
return 0;
}
);
}
// call like this: uniqueDishes = removeDuplicatesFromObjArray(dishes, "dishName");
// it will NOT modify the input array
// input array MUST be sorted by the same field (asc or desc doesn't matter)
removeDuplicatesFromObjArray = function(arr, field) {
var u = [];
arr.reduce(function (a, b) {
if (a[field] !== b[field]) u.push(b);
return b;
}, []);
return u;
}
and then simply call:
sortObjArray(dishes, "name");
dishes = removeDuplicatesFromObjArray(dishes, "name");
Basic sort-then-unique implementation, fiddle HERE:
function unique(arr) {
var comparer = function compareObject(a, b) {
if (a.title == b.title) {
if (a.artist < b.artist) {
return -1;
} else if (a.artist > b.artist) {
return 1;
} else {
return 0;
}
} else {
if (a.title < b.title) {
return -1;
} else {
return 1;
}
}
}
arr.sort(comparer);
console.log("Sorted: " + JSON.stringify(arr));
for (var i = 0; i < arr.length - 1; ++i) {
if (comparer(arr[i], arr[i+1]) === 0) {
arr.splice(i, 1);
console.log("Splicing: " + JSON.stringify(arr));
}
}
return arr;
}
It may or may not be the most efficient, and should be entirely scalable. I've added some console.logs so you can see it as it works.
EDIT
In the interest of saving on the space the function used, I did that for loop at the end, but it seems likely that didn't properly find only unique results (depsite it passing my simple jsfiddle test). Please try replacing my for loop with the following:
var checker;
var uniqueResults = [];
for (var i = 0; i < arr.length; ++i) {
if (!checker || comparer(checker, arr[i]) != 0) {
checker = arr[i];
uniqueResults.push(checker);
}
}
return uniqueResults;
I use this function. its not doing any sorting, but produces result. Cant say about performance as never measure it.
var unique = function(a){
var seen = [], result = [];
for(var len = a.length, i = len-1; i >= 0; i--){
if(!seen[a[i]]){
seen[a[i]] = true;
result.push(a[i]);
}
}
return result;
}
var ar = [1,2,3,1,1,1,1,1,"", "","","", "a", "b"];
console.log(unique(ar));// this will produce [1,2,3,"", "a", "b"] all unique elements.
Below is Henrique Feijo's answer with ample explanation and an example that you can cut and paste:
Goal: Convert an array of objects that contains duplicate objects (like this one)...
[
{
"id": 10620,
"name": "Things to Print"
},
{
"id": 10620,
"name": "Things to Print"
},
{
"id": 4334,
"name": "Interesting"
}
]
... Into an array of objects without duplicate objects (like this one):
[
{
"id": 10620,
"name": "Things to Print"
},
{
"id": 4334,
"name": "Interesting"
}
]
Explanation provided in the comments:
var allContent = [{
"id": 10620,
"name": "Things to Print"
}, {
"id": 10620,
"name": "Things to Print"
}, {
"id": 4334,
"name": "Interesting"
}]
//Put Objects Into As Associative Array. Each key consists of a composite value generated by each set of values from the objects in allContent.
var noDupeObj = {} //Create an associative array. It will not accept duplicate keys.
for (i = 0, n = allContent.length; i < n; i++) {
var item = allContent[i]; //Store each object as a variable. This helps with clarity in the next line.
noDupeObj[item.id + "|" + item.name] = item; //This is the critical step.
//Here, you create an object within the associative array that has a key composed of the two values from the original object.
// Use a delimiter to not have foo+bar handled like fo+obar
//Since the associative array will not allow duplicate keys, and the keys are determined by the content, then all duplicate content are removed.
//The value assigned to each key is the original object which is along for the ride and used to reconstruct the list in the next step.
}
//Recontructs the list with only the unique objects left in the doDupeObj associative array
var i = 0;
var nonDuplicatedArray = [];
for (var item in noDupeObj) {
nonDuplicatedArray[i++] = noDupeObj[item]; //Populate the array with the values from the noDupeObj.
}
console.log(nonDuplicatedArray)
For those who love ES6 and short stuff, here it's one solution:
const arr = [
{ title: "sky", artist: "Jon" },
{ title: "rain", artist: "Paul" },
{ title: "sky", artist: "Jon" }
];
Array.from(arr.reduce((a, o) => a.set(o.title, o), new Map()).values());
const arr = [
{ title: "sky", artist: "Jon" },
{ title: "rain", artist: "Paul" },
{ title: "sky", artist: "Jon" },
{ title: "rain", artist: "Jon" },
{ title: "cry", artist: "Jon" }
];
const unique = Array.from(arr.reduce((a, o) => a.set(o.title, o), new Map()).values());
console.log(`New array length: ${unique.length}`)
console.log(unique)
The above example only works for a unique title or id. Basically, it creates a new map for songs with duplicate titles.
Below code compares object with JSON as String format and removes duplicates and works fine with simple arrays.
Array.prototype.unique=function(a){
return function(){
return this.filter(a)
}
}(
function(a,b,c){
var tmp=[];
c.forEach(function(el){
tmp.push(JSON.stringify(el))
});
return tmp.indexOf(JSON.stringify(a),b+1)<0
})
If you are using underscore js, it is easy to remove duplicate object.
http://underscorejs.org/#uniq
function remove_duplicates(objectsArray) {
var arr = [], collection = [];
$.each(objectsArray, function (index, value) {
if ($.inArray(value.id, arr) == -1) {
arr.push(value.id);
collection.push(value);
}
});
return collection;
}

Count duplicates within an Array of Objects

I have an array of objects as follows within my server side JS:
[
{
"Company": "IBM"
},
{
"Person": "ACORD LOMA"
},
{
"Company": "IBM"
},
{
"Company": "MSFT"
},
{
"Place": "New York"
}
]
I need to iterate through this structure, detect any duplicates and then create a count of a duplicate is found along side each value.
Both of the values must match to qualify as a duplicate e.g. "Company": "IBM" is not a match for "Company": "MSFT".
I have the options of changing the inbound array of objects if needed. I would like the output to be an object, but am really struggling to get this to work.
EDIT: Here is the code I have so far where processArray is the array as listed above.
var returnObj = {};
for(var x=0; x < processArray.length; x++){
//Check if we already have the array item as a key in the return obj
returnObj[processArray[x]] = returnObj[processArray[x]] || processArray[x].toString();
// Setup the count field
returnObj[processArray[x]].count = returnObj[processArray[x]].count || 1;
// Increment the count
returnObj[processArray[x]].count = returnObj[processArray[x]].count + 1;
}
console.log('====================' + JSON.stringify(returnObj));
For example:
counter = {}
yourArray.forEach(function(obj) {
var key = JSON.stringify(obj)
counter[key] = (counter[key] || 0) + 1
})
Docs: Array.forEach, JSON.stringify.
Object.prototype.equals = function(o){
for(var key in o)
if(o.hasOwnProperty(key) && this.hasOwnProperty(key))
if(this[key] != o[key])
return false;
return true;
}
var array = [/*initial array*/],
newArray = [],
ok = true;
for(var i=0,l=array.length-1;i<l;i++)
for(var j=i;j<l+1;j++)
{
if(!array[i].equals(array[j]))
newArray.push(array[i]);
}
We are required to write a JavaScript function that takes in one such array of objects. The function creates and return a new array in which no objects are repeated (by repeated we mean objects having same value for "Country" property.)
Moreover, the function should assign a count property to each object that represents the number of times they appeared in the original array.
const arr = [
{
"Country": "BR",
"New Lv1−Lv2": "#N/A"
},
{
"Country": "BR",
"New Lv1−Lv2": "#N/A"
},
{
"Country": "",
"New Lv1−Lv2": "test"
}];
const convert = (arr) => {
const res = {};
arr.forEach((obj) => {
const key = `${obj.Country}${obj["New Lv1−Lv2"]}`;
if (!res[key]) {
res[key] = { ...obj, count: 0 };
};
res[key].count += 1;
});
return Object.values(res);
};
console.log(convert(arr));
know more
With ES6, one can use Array#reduce with an object to store the counts.
let counts = arr.reduce((acc, curr)=>{
const str = JSON.stringify(curr);
acc[str] = (acc[str] || 0) + 1;
return acc;
}, {});
Demo
To create a new array without duplicates, a Set can be used with Array#filter.
let set = new Set;
let res = arr.filter(x => {
const str = JSON.stringify(x);
return !set.has(str) && set.add(str);
});
Demo

Categories