We Keep Coding

Javascript Array and Object

I have two arrays of objects.Where each object has different properties, Like this
let array1=[
{id:121122,name:"Matt Jeff"},
{id:121123,name:"Philip Jeff"},
{id:121124,name:"Paul Jeff"}]
let array2=[
{owner_id:121122,id:1211443,value:18},
{owner_id:121127,id:1211428,value:22}]
How can I check if the owner_id in the array2 is equal to the id in array1 then return the new array like this
let newArray=[
{owner_id:121122,id:1211443,value:18}
]
Where the owner_id in array2 is equal to the id in array1.

If I correctly understand what you need, you could do like this:
let array1 = [{
id: 121122,
name: "Matt Jeff"
}, {
id: 121123,
name: "Philip Jeff"
}, {
id: 121124,
name: "Paul Jeff"
}
]
let array2 = [{
owner_id: 121122,
id: 1211443,
value: 18
}, {
owner_id: 121127,
id: 1211428,
value: 22
}
]
const result = array2.filter(({ owner_id }) => array1.some(({ id }) => id === owner_id));
console.log(result);

You could try with nested for like:
let array1=[
{id:121122,name:"Matt Jeff"},
{id:121123,name:"Philip Jeff"},
{id:121124,name:"Paul Jeff"}]
let array2=[
{owner_id:121122,id:1211443,value:18},
{owner_id:121127,id:1211428,value:22}];
let result = [];
for(let i = 0; i < array1.length; i++) {
for(let j = 0; j < array2.length; j++) {
if (array1[i].id === array2[j].owner_id) {
result.push(array2[j]);
}
}
}
console.log(result)

EFFICIENT WAY: Using Set and filter
O(m) - Iterating on array1 and Storing the id in Set
O(n) - Iterating on the array2 and filtering the result which include O(1) to search in Set;
let array1 = [
{ id: 121122, name: "Matt Jeff" },
{ id: 121123, name: "Philip Jeff" },
{ id: 121124, name: "Paul Jeff" },
];
let array2 = [
{ owner_id: 121122, id: 1211443, value: 18 },
{ owner_id: 121127, id: 1211428, value: 22 },
];
const dict = new Set();
array1.forEach((o) => dict.add(o.id));
const result = array2.filter((o) => dict.has(o.owner_id));
console.log(result);

Find all values by specific key in a deep nested object

How would I find all values by specific key in a deep nested object?
For example, if I have an object like this:
const myObj = {
id: 1,
children: [
{
id: 2,
children: [
{
id: 3
}
]
},
{
id: 4,
children: [
{
id: 5,
children: [
{
id: 6,
children: [
{
id: 7,
}
]
}
]
}
]
},
]
}
How would I get an array of all values throughout all nests of this obj by the key of id.
Note: children is a consistent name, and id's won't exist outside of a children object.
So from the obj, I would like to produce an array like this:
const idArray = [1, 2, 3, 4, 5, 6, 7]

This is a bit late but for anyone else finding this, here is a clean, generic recursive function:
function findAllByKey(obj, keyToFind) {
return Object.entries(obj)
.reduce((acc, [key, value]) => (key === keyToFind)
? acc.concat(value)
: (typeof value === 'object')
? acc.concat(findAllByKey(value, keyToFind))
: acc
, [])
}
// USAGE
findAllByKey(myObj, 'id')

You could make a recursive function like this:
idArray = []
function func(obj) {
idArray.push(obj.id)
if (!obj.children) {
return
}
obj.children.forEach(child => func(child))
}
Snippet for your sample:
const myObj = {
id: 1,
children: [{
id: 2,
children: [{
id: 3
}]
},
{
id: 4,
children: [{
id: 5,
children: [{
id: 6,
children: [{
id: 7,
}]
}]
}]
},
]
}
idArray = []
function func(obj) {
idArray.push(obj.id)
if (!obj.children) {
return
}
obj.children.forEach(child => func(child))
}
func(myObj)
console.log(idArray)

I found steve's answer to be most suited for my needs in extrapolating this out and creating a general recursive function. That said, I encountered issues when dealing with nulls and undefined values, so I extended the condition to accommodate for this. This approach uses:
Array.reduce() - It uses an accumulator function which appends the value's onto the result array. It also splits each object into it's key:value pair which allows you to take the following steps:
Have you've found the key? If so, add it to the array;
If not, have I found an object with values? If so, the key is possibly within there. Keep digging by calling the function on this object and append the result onto the result array; and
Finally, if this is not an object, return the result array unchanged.
Hope it helps!
const myObj = {
id: 1,
children: [{
id: 2,
children: [{
id: 3
}]
},
{
id: 4,
children: [{
id: 5,
children: [{
id: 6,
children: [{
id: 7,
}]
}]
}]
},
]
}
function findAllByKey(obj, keyToFind) {
return Object.entries(obj)
.reduce((acc, [key, value]) => (key === keyToFind)
? acc.concat(value)
: (typeof value === 'object' && value)
? acc.concat(findAllByKey(value, keyToFind))
: acc
, []) || [];
}
const ids = findAllByKey(myObj, 'id');
console.log(ids)

You can make a generic recursive function that works with any property and any object.
This uses Object.entries(), Object.keys(), Array.reduce(), Array.isArray(), Array.map() and Array.flat().
The stopping condition is when the object passed in is empty:
const myObj = {
id: 1,
anyProp: [{
id: 2,
thing: { a: 1, id: 10 },
children: [{ id: 3 }]
}, {
id: 4,
children: [{
id: 5,
children: [{
id: 6,
children: [{ id: 7 }]
}]
}]
}]
};
const getValues = prop => obj => {
if (!Object.keys(obj).length) { return []; }
return Object.entries(obj).reduce((acc, [key, val]) => {
if (key === prop) {
acc.push(val);
} else {
acc.push(Array.isArray(val) ? val.map(getIds).flat() : getIds(val));
}
return acc.flat();
}, []);
}
const getIds = getValues('id');
console.log(getIds(myObj));

Note: children is a consistent name, and id's wont exist outside
of a children object.
So from the obj, I would like to produce an array like this:
const idArray = [1, 2, 3, 4, 5, 6, 7]
Given that the question does not contain any restrictions on how the output is derived from the input and that the input is consistent, where the value of property "id" is a digit and id property is defined only within "children" property, save for case of the first "id" in the object, the input JavaScript plain object can be converted to a JSON string using JSON.stringify(), RegExp /"id":\d+/g matches the "id" property and one or more digit characters following the property name, which is then mapped to .match() the digit portion of the previous match using Regexp \d+ and convert the array value to a JavaScript number using addition operator +
const myObject = {"id":1,"children":[{"id":2,"children":[{"id":3}]},{"id":4,"children":[{"id":5,"children":[{"id":6,"children":[{"id":7}]}]}]}]};
let res = JSON.stringify(myObject).match(/"id":\d+/g).map(m => +m.match(/\d+/));
console.log(res);
JSON.stringify() replacer function can alternatively be used to .push() the value of every "id" property name within the object to an array
const myObject = {"id":1,"children":[{"id":2,"children":[{"id":3}]},{"id":4,"children":[{"id":5,"children":[{"id":6,"children":[{"id":7}]}]}]}]};
const getPropValues = (o, prop) =>
(res => (JSON.stringify(o, (key, value) =>
(key === prop && res.push(value), value)), res))([]);
let res = getPropValues(myObject, "id");
console.log(res);
Since the property values of the input to be matched are digits, all the JavaScript object can be converted to a string and RegExp \D can be used to replace all characters that are not digits, spread resulting string to array, and .map() digits to JavaScript numbers
let res = [...JSON.stringify(myObj).replace(/\D/g,"")].map(Number)

Using recursion.
const myObj = { id: 1, children: [ { id: 2, children: [ { id: 3 } ] }, { id: 4, children: [ { id: 5, children: [ { id: 6, children: [ { id: 7, } ] } ] } ] }, ]},
loop = (array, key, obj) => {
if (!obj.children) return;
obj.children.forEach(c => {
if (c[key]) array.push(c[key]); // is not present, skip!
loop(array, key, c);
});
},
arr = myObj["id"] ? [myObj["id"]] : [];
loop(arr, "id", myObj);
console.log(arr);
.as-console-wrapper { max-height: 100% !important; top: 0; }

You can make a recursive function with Object.entries like so:
const myObj = {
id: 1,
children: [{
id: 2,
children: [{
id: 3
}]
},
{
id: 4,
children: [{
id: 5,
children: [{
id: 6,
children: [{
id: 7,
}]
}]
}]
},
]
};
function findIds(obj) {
const entries = Object.entries(obj);
let result = entries.map(e => {
if (e[0] == "children") {
return e[1].map(child => findIds(child));
} else {
return e[1];
}
});
function flatten(arr, flat = []) {
for (let i = 0, length = arr.length; i < length; i++) {
const value = arr[i];
if (Array.isArray(value)) {
flatten(value, flat);
} else {
flat.push(value);
}
}
return flat;
}
return flatten(result);
}
var ids = findIds(myObj);
console.log(ids);
Flattening function from this answer
ES5 syntax:
var myObj = {
id: 1,
children: [{
id: 2,
children: [{
id: 3
}]
},
{
id: 4,
children: [{
id: 5,
children: [{
id: 6,
children: [{
id: 7,
}]
}]
}]
},
]
};
function findIds(obj) {
const entries = Object.entries(obj);
let result = entries.map(function(e) {
if (e[0] == "children") {
return e[1].map(function(child) {
return findIds(child)
});
} else {
return e[1];
}
});
function flatten(arr, flat = []) {
for (let i = 0, length = arr.length; i < length; i++) {
const value = arr[i];
if (Array.isArray(value)) {
flatten(value, flat);
} else {
flat.push(value);
}
}
return flat;
}
return flatten(result);
}
var ids = findIds(myObj);
console.log(ids);

let str = JSON.stringify(myObj);
let array = str.match(/\d+/g).map(v => v * 1);
console.log(array); // [1, 2, 3, 4, 5, 6, 7]

We use object-scan for a lot of our data processing needs now. It makes the code much more maintainable, but does take a moment to wrap your head around. Here is how you could use it to answer your question
// const objectScan = require('object-scan');
const find = (data, needle) => objectScan([needle], { rtn: 'value' })(data);
const myObj = { id: 1, children: [{ id: 2, children: [ { id: 3 } ] }, { id: 4, children: [ { id: 5, children: [ { id: 6, children: [ { id: 7 } ] } ] } ] }] };
console.log(find(myObj, '**.id'));
// => [ 7, 6, 5, 4, 3, 2, 1 ]
.as-console-wrapper {max-height: 100% !important; top: 0}
<script src="https://bundle.run/object-scan#13.7.1"></script>
Disclaimer: I'm the author of object-scan

import {flattenDeep} from 'lodash';
/**
* Extracts all values from an object (also nested objects)
* into a single array
*
* #param obj
* #returns
*
* #example
* const test = {
* alpha: 'foo',
* beta: {
* gamma: 'bar',
* lambda: 'baz'
* }
* }
*
* objectFlatten(test) // ['foo', 'bar', 'baz']
*/
export function objectFlatten(obj: {}) {
const result = [];
for (const prop in obj) {
const value = obj[prop];
if (typeof value === 'object') {
result.push(objectFlatten(value));
} else {
result.push(value);
}
}
return flattenDeep(result);
}

Below solution is generic which will return all values by matching nested keys as well e.g for below json object
{
"a":1,
"b":{
"a":{
"a":"red"
}
},
"c":{
"d":2
}
}
to find all values matching key "a" output should be return
[1,{a:"red"},"red"]
const findkey = (obj, key) => {
let arr = [];
if (isPrimitive(obj)) return obj;
for (let [k, val] of Object.entries(obj)) {
if (k === key) arr.push(val);
if (!isPrimitive(val)) arr = [...arr, ...findkey(val, key)];
}
return arr;
};
const isPrimitive = (val) => {
return val !== Object(val);
};

How to create array of array by grouping ids

I have an array:
let array = [{id: 1, name:'a'}, {id: 2, name: 'b'},{id: 1, name:'c'}];
I want an array like
arr2 = [[{id: 1, name:'a'}, {id: 1, name:'c'}], [{id: 2, name: 'b'}]]
I tried this but I cant find which array to add to:
$scope.journalsArray = response.data.body.Data;
$scope.newArray = [];
let idsArray = [];
for (let i = 0; i < $scope.journalsArray.length; i++) {
if(idsArray.indexOf($scope.journalsArray[i].journal_id) != -1){
$scope.newArray.push($scope.journalsArray[i]);
}else{
$scope.idsArray.push($scope.journalsArray[i].journal_id);
}
}

Array.reduce over your original array.
If a group exists that has an item with the same id, push into it.
Otherwise create the group.
let array = [{id: 1, name:'a'}, {id: 2, name: 'b'},{id: 1, name:'c'}]
let result = array.reduce((acc, item) => {
const group = acc.find(group => group.find(inner => inner.id === item.id))
if (group)
group.push(item)
else
acc.push([item])
return acc
}, [])
console.log(result)

Using reduce(), find() and filter() methods we can achieve this
let array = [
{id: 1, name:'a'},
{id: 2, name: 'b'},
{id: 1, name:'c'}
];
const results = arr => {
return arr.reduce((result, item ) => {
if (!result.find(obj => obj[0].id === item.id)) {
result.push(array.filter(val => val.id == item.id))
}
return result;
}, [])
}
console.log(results(array));
// ​​​​​[ [ { id: 1, name: 'a' }, { id: 1, name: 'c' } ], [ { id: 2, name: 'b' } ] ]​​

You could take a Map and collect the objects in the same group. Then get the values of each group as result.
var array = [{ id: 1, name:'a' }, { id: 2, name: 'b' },{ id: 1, name:'c' }],
result = Array.from(
array
.reduce((m, o) => m.set(o.id, [...(m.get(o.id) || []), o]), new Map)
.values()
);
console.log(result);
.as-console-wrapper { max-height: 100% !important; top: 0; }

Using Array#reduce, Map, destructuring and Array#concat.
const data = [{id: 1, name:'a'}, {id: 2, name: 'b'},{id: 1, name:'c'}];
const res = data.reduce((a,{id,name})=>{
return a.set(id, [{id,name}].concat(a.get(id)||[]));
}, new Map()).values();
console.log([...res]);

let array = [{id: 1, name:'a'}, {id: 2, name: 'b'},{id: 1, name:'c'}]
let result = array.reduce((acc, item) => {
const group = acc.find(group => group.find(inner => inner.id === item.id))
if (group)
group.push(item)
else
acc.push([item])
return acc
}, [])
console.log(result)
let array = [{id: 1, name:'a'}, {id: 2, name: 'b'},{id: 1, name:'c'}]
let result = array.reduce((acc, item) => {
const group = acc.find(group => group.find(inner => inner.id === item.id))
if (group)
group.push(item)
else
acc.push([item])
return acc
}, [])
console.log(result)

How to check if an id (inside a list of ids) exists in an array of objects with ids?

List1:
[1,2,3,4]
List2:
[{id:1,name:hi},{id:3,name:hi},{id:5,name:hi}]
How can I check which items from List1 is missing from List2?

You can do something like this with help of map() and filter()
var list1 = [1, 2, 3, 4],
list2 = [{
id: 1,
name: 'hi'
}, {
id: 3,
name: 'hi'
}, {
id: 5,
name: 'hi'
}];
// get array of id's
var ids = list2.map(function(v) {
return v.id;
})
// get missing elements
var miss = list1.filter(function(v) {
// check element in id's array
return ids.indexOf(v) == -1;
});
document.write('<pre>' + JSON.stringify(miss, null, 3) + '</pre>');
Using ES6 arrow function
var list1 = [1, 2, 3, 4],
list2 = [{
id: 1,
name: 'hi'
}, {
id: 3,
name: 'hi'
}, {
id: 5,
name: 'hi'
}];
// get array of id's
var ids = list2.map(v => v.id);
// get missing elements
var miss = list1.filter(v => ids.indexOf(v) == -1);
document.write('<pre>' + JSON.stringify(miss, null, 3) + '</pre>');

Use Array.prototype.filter
var list1 = [1,2,3,4];
var list2 = [{id:1,name:'hi'},{id:3,name:'hi'},{id:5,name:'hi'}];
var t = list2.map(e => e.id); // get all 'ids' from 'list2'
var result = list1.filter(e => t.indexOf(e) == -1);
document.write(JSON.stringify(result));

I would try to reduce list2 to array of missing ids. Maybe like this:
var data = [{id: 1, name: 'hi'}, {id: 3, name: 'hi'}, {id: 5, name: 'hi'}]
var ids = [1, 2, 3, 4]
var missing = data.reduce(function(prev, curr) {
return prev.filter(function(id) { return id !== curr.id })
}, ids.slice())
document.write(missing)

A solution with linear complexity for sorted arrays.
var list1 = [1, 2, 4, 30],
list2 = [{ id: 1, name: 'hi' }, { id: 3, name: 'hi' }, { id: 5, name: 'hi' }],
missing = list1.filter(function (a) {
while (list2[this.index] && list2[this.index].id < a) {
this.index++;
}
return !list2[this.index] || list2[this.index].id !== a;
}, { index: 0 });
document.write('<pre>' + JSON.stringify(missing, 0, 4) + '</pre>');

Combine Array methods filter and some:
var list1 = [1,2,3,4];
var list2 = [{id:1,name:'hi'},{id:3,name:'hi'},{id:5,name:'hi'}];
return list2.filter(function(o) {
return !list1.some(function(id) { return o.id === id; })
})
which yields the objects from list2 whose ids are not in list1.
The converse, as I saw many people post, is this:
return list1.filter(function(id) {
return !list2.some(function(o) { return o.id === id; });
});
which yields the ids from list1 that do not have corresponding objects in list2

JavaScript filter array by data from another

I have an array object:
[
{ id:1, name: 'Pedro'},
{ id:2, name: 'Miko'},
{ id:3, name: 'Bear'},
{ id:4, name: 'Teddy'},
{ id:5, name: 'Mouse'}
]
And I have an array with ids [1, 3, 5],
How can I filter the array object to leave records only with id's from the second one?

If Array.includes() is supported, you can use it with Array.filter() to get the items:
const array = [
{ id: 1, name: 'Pedro'},
{ id: 2, name: 'Miko'},
{ id: 3, name: 'Bear'},
{ id: 4, name: 'Teddy'},
{ id: 5, name: 'Mouse'}
];
const filterArray = [1,3,5];
const result = array.filter(({ id }) => filterArray.includes(id));
console.log(result);
If includes is not supported, you can use Array.indexOf() instead:
var array = [
{ id: 1, name: 'Pedro'},
{ id: 2, name: 'Miko'},
{ id: 3, name: 'Bear'},
{ id: 4, name: 'Teddy'},
{ id: 5, name: 'Mouse'}
];
var filterArray = [1,3,5];
var result = array.filter(function(item) {
return filterArray.indexOf(item.id) !== -1;
});
console.log(result);

Maybe take a Array.prototype.reduce in combination with an Array.prototype.some. This keeps the order of the given array need.
var data = [
{ id: 3, name: 'Bear' },
{ id: 4, name: 'Teddy' },
{ id: 5, name: 'Mouse' },
{ id: 1, name: 'Pedro' },
{ id: 2, name: 'Miko' },
],
need = [1, 3, 5],
filtered = need.reduce(function (r, a) {
data.some(function (el) {
return a === el.id && r.push(el);
});
return r;
}, []);
document.write('<pre>' + JSON.stringify(filtered, 0, 4) + '</pre>');
To keep the order of data you can use Array.prototype.filter:
var data = [
{ id: 3, name: 'Bear' },
{ id: 4, name: 'Teddy' },
{ id: 5, name: 'Mouse' },
{ id: 1, name: 'Pedro' },
{ id: 2, name: 'Miko' },
],
need = [1, 3, 5],
filtered = data.filter(function (a) {
return ~need.indexOf(a.id);
});
document.write('<pre>' + JSON.stringify(filtered, 0, 4) + '</pre>');

In case the data set is small, you are ok with any of the offered solution (ones that use indexOf).
However, these solutions are O(n^2) ones, therefore, given the data set big enough, the lag can become noticeable. In this case, you should build an index prior to selecting elements.
Example:
function filterFast(data, ids) {
var index = ids.reduce(function(a,b) {a[b] = 1; return a;}, {});
return data.filter(function(item) {
return index[item.id] === 1;
});
}
And some benchmarking can be tested here.

You can use the filter method on your Array:
var data = [
{ id:1, name: 'Pedro'},
{ id:2, name: 'Miko'},
{ id:3, name: 'Bear'},
{ id:4, name: 'Teddy'},
{ id:5, name: 'Mouse'}
];
var ids = [1, 3, 5];
var filteredData = filterData(data, 'id', ids[1]);
function filterData(data, prop, values) {
return data.filter(function(item) {
return ~values.indexOf(item[prop]); // ~ returns 0 if indexOf returns -1
});
}
See it in action in this JSFiddle.

Or if you are using jQuery, another option may be:
var arr1 = [1, 3, 5],
arr2 = [{ id: 1, name: 'Pedro' },
{ id: 2, name: 'Miko' },
{ id: 3, name: 'Bear' },
{ id: 4, name: 'Teddy' },
{ id: 5, name: 'Mouse' }],
filtered = $.grep(arr2, function (item) {
if (arr1.indexOf(item.id) > -1) {
return true;
}
});

You can use a for loop on the object array and check hasOwnProperty in another for loop for each ids in [1,3,5] (break out of the loop once an id found). (And break out of the bigger for-loop once all ids are found) If your array object is ordered (e.g. elements sorted from smallest id to biggest id) and so are your list, this solution should be quite efficient.
var c = 0;
for(var i =0; i< objects.length; i++){
for(var v =0; v< list.length; v++)
if(objects[i].hasOwnProperty(list[v])){
delete objects[i]; c++; break;
}
if(c===list.length) break;
}
or use array.splice( i, 1 ); if you don't want an empty slot.

Using filter and indexOf will do the trick:
var filteredArray = dataArray.filter(function(obj) {
return idsArray.indexOf(obj.id) > -1;
});
However, indexOf has linear performance, and it will be called lots of times.
In ES6 you can use a set instead, whose has call has sublinear performance (on average):
var idsSet = new Set(idsArray),
filteredArray = dataArray.filter(obj => idsSet.has(obj.id));
Assuming the toString method of your ids is injective, you can achieve something similar in ES5:
var idsHash = Object.create(null);
idsArray.forEach(function(id) {
idsHash[id] = true;
});
var filteredArray = dataArray.filter(function(obj) {
return idsHash[obj.id];
});