We Keep Coding

Search for element in array of objects [duplicate]

This question already has answers here:
How to find a node in a tree with JavaScript
(19 answers)
Closed 3 months ago.
I need to search the elements containing the searched text in a parent and child structure, similar to this:
[
{
"id": "1",
"name": "Apple",
"value": "1",
"children": [
{
"id": "4",
"name": "iPhone",
"value": "4",
}
]
},
{
"id": "2",
"name": "Samsung",
"value": "2",
"children": [
{
"id": "5",
"name": "Android",
"value": "5",
}
]
},
{
"id": "3",
"name": "AppleX",
"value": "3",
}
]
An example: the user searched for the string "Apple", he would need to filter all the elements of this structure that contain this string "Apple".
The search is always based on the object name.

It also gives nth level depth search result :
let arr = [
{
id: "1",
name: "Name 1",
value: "1",
children: [
{
id: "4",
name: "Name one",
value: "4",
children: [
{
id: "41",
name: "Name one",
value: "41",
},
],
},
],
},
{
id: "2",
name: "Name 2",
value: "2",
children: [
{
id: "5",
name: "Name 5 three one",
value: "5",
},
],
},
{
id: "3",
name: "Name 3",
value: "3",
},
];
let str = "one";
let stack = arr;
let result = [];
while (stack.length) {
let elem = stack.shift();
if (elem.children && elem.children.length > 0) {
stack.push(...elem.children);
}
//
let keys = Object.keys(elem).filter((v) => v != "children");
keys.map((m) => {
if (elem[m].includes(str)) {
delete elem["children"];
result.push(elem);
}
});
//
}
console.log(result);

How to traverse data according to an array?

I am trying to traverse the data according to the show array and print the data to see if it is correct. To traverse the list array corresponding to the show array as follows
I want the effect as follows:
[
{
"name": "A",
"age": "10",
},
{
"name": "B",
"age": "20",
}
]
const data = [{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "A",
"age": "10",
"logo": "aa.png",
"note": "aa"
}, {
"name": "B",
"age": "20",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
}]
function init() {
data.map(res => {
if (res.code == 200) {
console.log(res.data.list)
}
})
}
init();

By iterating show (rather than hard-coding name and age), this code would work also if you change the structure of your template:
const data = [{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "A",
"age": "10",
"logo": "aa.png",
"note": "aa"
}, {
"name": "B",
"age": "20",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
}];
var ans = data[0].data.list.map(item => {
var curr = {};
data[0].data.show.forEach(prop => {
curr[prop] = item[prop];
});
return curr;
});
console.log(ans);

You can use reduce in a shorter way:
const data = [
{
code: "200",
msg: "success",
data: {
list: [
{
name: "A",
age: "10",
logo: "aa.png",
note: "aa"
},
{
name: "B",
age: "20",
logo: "bb.png",
note: "bb"
}
],
show: ["name", "age"]
}
}
];
console.log(data[0].data.list.map(x =>
data[0].data.show.reduce((p, c) => ((p[c] = x[c]), p), {})
));

const data = [{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "A",
"age": "10",
"logo": "aa.png",
"note": "aa"
}, {
"name": "B",
"age": "20",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
}];
function init() {
data.map(res => {
if (res.code == 200) {
console.log(res.data.list.map(function(listValue) {
var ret = {};
res.data.show.forEach(function(idx) {
ret[idx] = listValue[idx]
});
return ret;
}));
}
})
}
init();

You can use .map on your data and return false if the code isn't 200, if it is 200, you can return a mapped version of your list array. You can map this array to a subset of each object in your list. The subset is defined by your show array, and so you can use .reduce() on this array to build your mapped object.
See example below:
const data = [{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "A",
"age": "10",
"logo": "aa.png",
"note": "aa"
}, {
"name": "B",
"age": "20",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
}];
function init() {
return data.map(res => {
if (res.code == 200) {
return res.data.list.map((obj) => {
return res.data.show.reduce((acc, prop) => ({...acc, [prop]: obj[prop]}), {});
});
}
return false;
}).filter(Boolean); // filter out any `false` returns
}
console.log(init());
Alternatively, a better approach than mapping your original data would be to use .reduce(). This will create a one-dimensional array of results:
const data = [{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "A",
"age": "10",
"logo": "aa.png",
"note": "aa"
}, {
"name": "B",
"age": "20",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
},
{
"code": "200",
"msg": "success",
"data": {
"list": [{
"name": "C",
"age": "30",
"logo": "aa.png",
"note": "aa"
}, {
"name": "D",
"age": "40",
"logo": "bb.png",
"note": "bb"
}],
"show": [
"name",
"age"
]
}
}];
function init() {
return data.reduce((acc, res) => {
if (res.code == 200) {
return [...acc, ...res.data.list.map((obj) => {
return res.data.show.reduce((acc, prop) => ({...acc, [prop]: obj[prop]}), {});
})];
}
return acc;
}, []);
}
console.log(init());

If you want to show only name and age as
[
{
"name": "A",
"age": "10",
},
{
"name": "B",
"age": "20",
}
]
Array.map can be used
and then you can write your code this way
const data = [
{
code: '200',
msg: 'success',
data: {
list: [
{
name: 'A',
age: '10',
logo: 'aa.png',
note: 'aa'
},
{
name: 'B',
age: '20',
logo: 'bb.png',
note: 'bb'
}
],
show: ['name', 'age']
}
}
]
function init() {
data.map(res => {
if (res.code == 200) {
console.log(
res.data.list.map(item => {
return {
name: item.name,
age: item.age
}
})
)
}
})
}
init()
Does this answer your question?

javascript convert into parent-child array

Can anyone help converting the following list of parent-child objects:
I have below array of objects, Need to convert it into parent child order. each 'Members' attribute in object may have 1 or n objects inside it. In 'Members' array the 1st object is parent of 2nd one and 2nd is parent of third object.
So in 1st Member
'Video' is parent of 'West' and 'West' is parent of 'India' and so on..
I have tried to loop through the elements one by one but could not reach the desired outcome.
Any help with the logic or code would be really helpful.
Input :
[
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [
{
"Name": "Machinery"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [
{
"Name": "Electronics"
},
{
"Name": "Midwest"
},
{
"Name": "Arab"
}
]
},
{
"Members": [
{
"Name": "Machinery"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [
{
"Name": "Electronics"
},
{
"Name": "NorthEast"
},
{
"Name": "Japan"
}
]
},
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "Japan"
}
]
}
]
Expected Output :
[
{
"name": "Videos",
"children": [
{
"name": "West",
"children": [
{
"name": "India",
"children": []
},
{
"name": "Japan",
"children": []
}
]
},
{
"name": "South",
"children": [
{
"name": "Australia",
"children": []
}
]
}
]
},
{
"name": "Machinery",
"children": [
{
"name": "South",
"children": [
{
"name": "Australia",
"children": []
}
]
},
{
"name": "West",
"children": [
{
"name": "India",
"children": []
}
]
}
]
},
{
"name": "Electronics",
"children": [
{
"name": "Midwest",
"children": [
{
"name": "Arab",
"children": []
}
]
},
{
"name": "NorthEast",
"children": [
{
"name": "Japan",
"children": []
}
]
}
]
}
]
```

Man this took too long. But it works with larger datasets. Note to OP, never use this data structure. Ever. It's horrible. I lost many braincells making this solution:
var arr = [
{Members: [{ Name: "Videos" }, { Name: "West" }, { Name: "India" }, {Name: 'Testing'}]},
{Members: [{ Name: "Machinery" }, { Name: "South" }, { Name: "Australia" }]},
{Members: [{ Name: "Electronics" }, { Name: "Midwest" }, { Name: "Arab" }]},
{Members: [{ Name: "Machinery" }, { Name: "West" }, { Name: "India" }]},
{Members: [{ Name: "Electronics" }, { Name: "NorthEast" }, { Name: "Japan" }]},
{Members: [{ Name: "Videos" }, { Name: "South" }, { Name: "Australia" }]},
{Members: [{ Name: "Videos" }, { Name: "West" }, { Name: "Japan" }]}
];
const addRelation = (obj, m, i) => ({...obj, parent: i === 0 ? null : m.slice(0, i).map(el => el.Name).join('.'), level: i, children: []})
const arrayToTree = (arr) => {
arr = arr.map(({ Members: m }) => m.map((obj, i) => addRelation(obj, m, i))).reduce((acc, arr) => {
arr.map(obj => acc.push(obj))
return acc
}, []).sort((a, b) => b.level - a.level)
var temp = [...arr].filter((o, index, self) =>
index === self.findIndex((t) => (
t.Name === o.Name && t.parent === o.parent
))
)
arr.forEach(() => {
if (temp[0].level === 0) return
var parentIndex = temp.findIndex(o => {
var str = temp[0].parent
var rest = str.substring(0, str.lastIndexOf("."));
var last = str.substring(str.lastIndexOf(".") + 1, str.length);
var parents = [rest, last]
return parents[0] !== ''
? o.Name === parents[1] && o.parent === parents[0]
: o.Name === temp[0].parent
})
const { Name, children } = temp[0]
temp[parentIndex].children.push({Name, children})
temp.shift()
})
return temp.map(({ Name, children }) => ({ Name, children }))
}
arr = arrayToTree(arr)
console.log(arr)

This might not be the best way to go about this and this only works for 3 levels.
var data = [
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [
{
"Name": "Machinery"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [
{
"Name": "Electronics"
},
{
"Name": "Midwest"
},
{
"Name": "Arab"
}
]
},
{
"Members": [
{
"Name": "Machinery"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [
{
"Name": "Electronics"
},
{
"Name": "NorthEast"
},
{
"Name": "Japan"
}
]
},
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [
{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "Japan"
}
]
}
];
function organize(dataBefore){
var dataAfter = [];
dataAfter.push({
name: dataBefore[0].Members[0].Name,
children: []
});
for(var i = 1; i < dataBefore.length; i++){
if(!doesExist(dataAfter, dataBefore[i].Members[0].Name)){
dataAfter.push({
name: dataBefore[i].Members[0].Name,
children: []
});
}
}
dataAfter[0].children.push({
name: dataBefore[0].Members[1].Name,
children: []
});
for(var i = 1; i < dataBefore.length; i++){
for(var j = 0; j < dataAfter.length; j++){
if(dataAfter[j].name == dataBefore[i].Members[0].Name){
if(!doesExist(dataAfter[j].children, dataBefore[i].Members[1].Name)){
dataAfter[j].children.push({
name: dataBefore[i].Members[1].Name,
children: []
});
}
}
}
}
dataAfter[0].children[0].children.push({
name: dataBefore[0].Members[2].Name,
children: []
});
for(var i = 1; i < dataBefore.length; i++){
for(var j = 0; j < dataAfter.length; j++){
if(dataAfter[j].name == dataBefore[i].Members[0].Name){
for(var k = 0; k < dataAfter[j].children.length; k++){
if(dataAfter[j].children[k].name == dataBefore[i].Members[1].Name){
if(!doesExist(dataAfter[j].children[k].children, dataBefore[i].Members[2].Name)){
dataAfter[j].children[k].children.push({
name: dataBefore[i].Members[2].Name,
children: []
});
}
}
}
}
}
}
return dataAfter;
}
function doesExist(checkThisData, searchValue){
for(var i = 0; i < checkThisData.length; i++){
if(searchValue == checkThisData[i].name){
return true;
}
}
return false;
}
console.log(organize(data));

I would advise to use map + reduce combination:
const data = [{
"Members": [{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [{
"Name": "Machinery"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [{
"Name": "Electronics"
},
{
"Name": "Midwest"
},
{
"Name": "Arab"
}
]
},
{
"Members": [{
"Name": "Machinery"
},
{
"Name": "West"
},
{
"Name": "India"
}
]
},
{
"Members": [{
"Name": "Electronics"
},
{
"Name": "NorthEast"
},
{
"Name": "Japan"
}
]
},
{
"Members": [{
"Name": "Videos"
},
{
"Name": "South"
},
{
"Name": "Australia"
}
]
},
{
"Members": [{
"Name": "Videos"
},
{
"Name": "West"
},
{
"Name": "Japan"
}
]
}
];
const ar = data.map((el, i) => {
let a = el['Members'].reduce((acc, member, index) => {
if (index === 0) {
acc[index] = {
name: member.Name,
children: []
};
} else {
debugger;
if (acc[0].children.length === 0) {
acc[0].children.push({
name: member.Name,
children: []
});
} else {
acc[0].children[0].children.push({
name: member.Name,
children: []
});
}
}
return acc;
}, []);
return a;
});
console.log(ar);

Changing arrays using map in javascript

This is my json object:
{
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
}
I want my output like this:
{
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"cats": [1,2] // this 1 and 2 is coming from categoriesservices array inside the category object i have id
}
How to do this using map function? I am new to javascript, which is good approach map or forloop?

See destructuring assignment, Array.prototype.map(), and JSON for more info.
// Input.
const input = {
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
}
// Categories => Objects to Cats => Ids.
const output = (input) => JSON.parse(JSON.stringify({
...input,
cats: input.categoryservices.map(({category: {id}}) => id),
categoryservices: undefined
}))
// Log.
console.log(output(input))

If you are not worried about original object immutability, then try this
obj['cats'] = obj['categoryservices'].map(cat => cat.category.id);
delete obj['categoryservices'];
console.log(obj);

I just use .map() on categoryservices array:
var output = {
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
};
output.cats = output.categoryservices.map((element) =>
element.category.id);
delete output.categoryservices;
console.log(JSON.stringify(output));

use .map() , it return value as array ! You want to change is categoryservices key only ! So delete that after you get wanted value ..
var output = {
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
};
output.cats = output.categoryservices.map(i => i.category.id );
delete output.categoryservices;
console.log(output);

Try this working demo :
var jsonObj = {
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
};
var arr = jsonObj.categoryservices.map(item => item.category.id)
jsonObj.cats = arr;
delete jsonObj.categoryservices;
console.log(jsonObj);

Try this
var testData={
"id": 2,
"service": "mobile",
"min": "20",
"per": "10",
"tax": "1",
"categoryservices": [
{
"category": {
"id": 1,
"name": "laptop"
}
},
{
"category": {
"id": 2,
"name": "software"
}
}
]
}
testData.cats=[];
testData.categoryservices.forEach(function (item) {
testData.cats.push(item.category.id);
});
delete testData.categoryservices;
console.log(testData);

You can try using jquery each:
<div id="log"></div>
var conversation = {
'John': {
1: 'Test message 1',
2: 'Test message 2',
'Reply': {
3: 'Test message 3',
4: 'Test message 4'
}
},
'Jack': {
5: 'Test message 5',
6: 'Test message 6'
}
};
function iterate(obj) {
if (typeof obj === 'string') {
$('#log').append((obj + '<br/>'));
}
if (typeof obj === 'object') {
$.each(obj, function(key, value) {
iterate(value);
});
}
}
iterate(conversation);

Comparing two array of objects in javascript

This is my static values which is having id with names:
var staticValues = [
{ "id": "1", "name": "PEKKA" },
{ "id": "2", "name": "Golem" },
{ "id": "3", "name": "Vigilane" },
{ "id": "4", "name": "SpiderMan" },
{ "id": "5", "name": "Archer" },
{ "id": "6", "name": "SuperMan" }
]
This is is my returned value from my method:
var myReturnedValues = [
[ [ "2", "4" ] ],
[ [ "5", "5" ] ],
[ [ "1", "3" ] ],
[ [ "4", "3" ] ]
]
My output needs to be like this:
var myReturnedValues = [
[ [ "Golem", "SpiderMan" ] ],
[ [ "Archer", "Archer" ] ],
[ [ "PEKKA", "Vigilante" ] ],
[ [ "SpiderMan", "Vigilante" ] ]
]
What am trying to do here is I have to compare staticValues and myReturnedValues and return names with respect to their ids instead of returning only ids alone. I tried some more ways with underscore.js but failed. Can someone give me idea about that?
This is how my method looks like:
var staticValues = [ /* here I have the whole static data */ ];
$scope.getCategories = function() {
var myReturnedValues = mainSteps.map(x => [x.steps.map(y => y.category)]);
return myReturnedValues;
}
Code After edited ,
$scope.getCategories =function(){
var myReturnedValues =mainSteps.map(x => [x.steps.map(y => y.category+"\n"+"\n"+"\n")]);
//return myReturnedValues;
console.log('meeee before',angular.toJson(myReturnedValues));
newval = {};
$.each(staticValues ,function(i,v) {
console.log('meeee staticCategories',angular.toJson(staticValues ));
newval[v.id] = v.name;
});
$.each(myReturnedValues,function(i,v){
$.each(v[0],function(x,t){
myReturnedValues[i][0][x] = newval[t];
});
});
console.log('meeee after',angular.toJson(myReturnedValues));
return myReturnedValues;
}

Start by converting staticValues to a key => value object:
names = {}
staticValues.forEach(obj => names[obj.id] = obj.name);
Then iterate myReturedValues and replace ids with names as you go:
var staticValues = [
{ "id": "1", "name": "PEKKA" },
{ "id": "2", "name": "Golem" },
{ "id": "3", "name": "Vigilane" },
{ "id": "4", "name": "SpiderMan" },
{ "id": "5", "name": "Archer" },
{ "id": "6", "name": "SuperMan" }
]
var myReturnedValues = [
[ [ "2", "4" ] ],
[ [ "5", "5" ] ],
[ [ "1", "3" ] ],
[ [ "4", "3" ] ]
]
names = {}
staticValues.forEach(x => names[x.id] = x.name)
res = myReturnedValues.map(sub =>
[sub[0].map(id => names[id])]
)
console.log(res)

Try the following loops:
newval = {};
$.each(staticValues,function(i,v) {
newval[v.id] = v.name;
});
var myReturedValues = [
[ [ "2", "4" ] ],
[ [ "5", "5" ] ],
[ [ "1", "3" ] ],
[ [ "4", "3" ] ]
];
$.each(myReturedValues,function(i,v){
$.each(v[0],function(x,t){
myReturedValues[i][0][x] = newval[t];
});
});
demo: https://jsfiddle.net/cgk478g8/

With underscore you can try like this:
var staticValues = [
{ "id": "1", "name": "PEKKA" },
{ "id": "2", "name": "Golem" },
{ "id": "3", "name": "Vigilane" },
{ "id": "4", "name": "SpiderMan" },
{ "id": "5", "name": "Archer" },
{ "id": "6", "name": "SuperMan" }
];
var myReturedValues = [
[ [ "2", "4" ] ],
[ [ "5", "5" ] ],
[ [ "1", "3" ] ],
[ [ "4", "3" ] ]
];
var data = _.chain(myReturedValues).map(function(d) {
//map the myReturedValues
return d[0].map(function(id) {
//use underscore to search in the staticValues and return name
return _.find(staticValues, function(svalue) {
return svalue.id == id
}).name
});
}).value();
console.log(data)
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>