I have a json array like this:
(3) [{…}, {…}, {…}]
0: {Id: 1, Name: "bask"}
1: {Id: 2, Name: "voll"}
2: {Id: 3, Name: "badminton"}
I want to turn it into something like this:
{1:"bask",2:"voll",3:"badminton"}
You can use reduce to loop through array and build a object of desired key/value pair
let data = [{Id: 1, Name: "bask"},{Id: 2, Name: "voll"},{Id: 3, Name: "badminton"}]
let output = data.reduce((op, {Id, Name}) => {
op[Id] = Name
return op
},{})
console.log(output)
You could take Object.fromEntries with the maped key/value pairs.
var array = [{ Id: 1, Name: "bask" }, { Id: 2, Name: "voll" }, { Id: 3, Name: "badminton" }],
object = Object.fromEntries(array.map(({ Id, Name }) => [Id, Name]));
console.log(object);
You can check out the reduce() function!
let array = [
{Id: 1, Name: "bask"},
{Id: 2, Name: "voll"},
{Id: 3, Name: "badminton"}
];
console.log(_.reduce(array, function(result, obj){
result[obj.Id] = obj.Name;
return result;
}, {}));
You can checkout lodash an awesome library with many other such utilities!
You can do this with reduce():
var a = [
{Id: 1, Name: "bask"},
{Id: 2, Name: "voll"},
{Id: 3, Name: "badminton"}
]
b = a.reduce((acc, item) => {
acc[item.Id] = item.Name;
return acc;
}
console.log(b);
You can do it in different ways, here one of them.
let dataArray = [
{id: 1, name: 'bask'},
{id: 2, name: 'voll'},
{id: 3, name: 'badminton'}
]
let ouputObject = {}
dataArray.map(data => {
ouputObject[`${data.id}`] = data.name
})
console.log(ouputObject)
outputObject will be
Object {
1: "bask",
2: "voll",
3: "badminton"
}
Using Array.reduce() :
var arr = [{
Id: 1,
Name: "bask"
}, {
Id: 2,
Name: "voll"
}, {
Id: 3,
Name: "badminton"
}];
var reduceObj = arr.reduce(function(result, currentElement) {
result[currentElement.Id] = currentElement.Name;
return result;
}, {});
console.log(reduceObj);
Using Array.map() :
var arr = [{
Id: 1,
Name: "bask"
}, {
Id: 2,
Name: "voll"
}, {
Id: 3,
Name: "badminton"
}];
var mapObject = {}
arr.map(obj => {
mapObject[obj.Id] = obj.Name
})
console.log(mapObject);
Related
I have 2 objects where I want the second one to be in the same order as the first one.
Ex:
const obj1 = [
{ key: 1, id: 1, name: "John" },
{ key: 2, id: 2, name: "Ann" },
{ key: 3, id: 3, name: "Kate" }
];
const obj2 = [
{ key: 2, id: 2, name: "Ann" },
{ key: 1, id: 1, name: "John" },
{ key: 3, id: 3, name: "Kate" }
];
The purpose is to have obj2 in same order as obj1, but only sort with keys. I'm trying to make an helper function which will pass 3 argument:
function helper(obj1, obj2, key) {
// return new object with sorted array do not modify existing
}
I can sort one of this, but cant combine 2object together
My idea is to use hash map to store key obj2, then loop through key obj1 to sort obj2
const obj1 = [
{key: 1, id: 5, name: 'John'},
{key: 2, id: 5, name: 'John'},
{key: 3, id: 5, name: 'John'}
]
const obj2 = [
{key: 2, id: 5, name: 'John'},
{key: 1, id: 5, name: 'John'},
{key: 3, id: 5, name: 'John'}
]
function help(obj1, obj2, key) {
const hashKeyObj2 = obj2.reduce((val, item) => {
val[item[key]] = item;
return val;
}, {});
return obj1.map((item) => hashKeyObj2[item[key]]);
}
console.log(help(obj1, obj2, 'key'))
One-liner
let sorted = obj1.map(a => obj2.find(b => a.key === b.key))
This snippet will sort obj2 from obj1 order:
const obj1 = [
{ key: 1, id: 5, name: 'John' },
{ key: 3, id: 5, name: 'John' },
{ key: 2, id: 5, name: 'John' },
]
const obj2 = [
{ key: 2, id: 5, name: 'John' },
{ key: 1, id: 5, name: 'Jane' },
{ key: 3, id: 5, name: 'Tom' },
]
function helper(obj1, obj2, key) {
const findIndex = (refValue) => obj1.findIndex((candidate) => candidate[key] === refValue)
const comparator = (item1, item2) => findIndex(item1[key]) - findIndex(item2[key])
return [...obj2].sort(comparator)
}
const result = helper(obj1, obj2, 'key')
console.log('result :', result)
An Approach using lodash
function sortArrayBasedOnKeys(
array1: Record<string, number | string>[],
array2: Record<string, number | string>[],
key: string
) {
const order = _.map(array1, key);
return _.sortBy(array2, (item) => _.indexOf(order, item[key]));
}
First we are getting order in which objects in the array1 are placed and then using that order to sort the next array.
I have an array that looks like this:
const myArray = [
[
{id: 1, name: 'Liam'},
{id: 2, name: 'Oliver'},
{id: 3, name: 'Jake'},
],
[
{id: 1, name: 'Liam'},
{id: 2, name: 'Oliver'},
{id: 4, name: 'Joe'},
],
]
I need to find common elements by id, and return them in an array that would look something like this:
[
{id: 1, name: 'Liam'},
{id: 2, name: 'Oliver'},
]
If there isn't any way to do it with lodash, just JS could work too.
Note that I do not know how many of these arrays I will have inside, so it should work for any number.
You can use lodash's _.intersectionBy(). You'll need to spread myArray because _intersectionBy() expect arrays as arguments, and not a single array of array:
const myArray = [[{"id":1,"name":"Liam"},{"id":2,"name":"Oliver"},{"id":3,"name":"Jake"}],[{"id":1,"name":"Liam"},{"id":2,"name":"Oliver"},{"id":4,"name":"Joe"}]]
const result = _.intersectionBy(...myArray, 'id')
console.log(result)
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"></script>
A vanilla solution can be as simple as a filter() call on the first element of the array checking to see that every() subsequent element contains some() elements that match.
const [srcElement, ...compArray] = [...myArray];
const intersection = srcElement.filter(o => (
compArray.every(arr => arr.some(p => p.id === o.id)))
);
console.log(intersection)
.as-console-wrapper { max-height: 100% !important; top: 0; }
<script>
const myArray = [
[{ id: 1, name: 'Liam' }, { id: 2, name: 'Oliver' }, { id: 3, name: 'Jake' }],
[{ id: 1, name: 'Liam' }, { id: 2, name: 'Oliver' }, { id: 4, name: 'Joe' }],
[{ id: 1, name: 'Liam' }, { id: 2, name: 'Oliver' }, { id: 5, name: 'Dean' }, { id: 6, name: 'Mara' }]
]
</script>
Use nested forEach loops and Set. Go over each sub-array and find out the common items so far.
const intersection = ([firstArr, ...restArr]) => {
let common = new Set(firstArr.map(({ id }) => id));
restArr.forEach((arr) => {
const newCommon = new Set();
arr.forEach(({ id }) => common.has(id) && newCommon.add(id));
common = newCommon;
});
return firstArr.filter(({ id }) => common.has(id));
};
const myArray = [
[
{ id: 1, name: "Liam" },
{ id: 2, name: "Oliver" },
{ id: 3, name: "Jake" },
],
[
{ id: 1, name: "Liam" },
{ id: 2, name: "Oliver" },
{ id: 4, name: "Joe" },
],
[
{ id: 2, name: "Oliver" },
{ id: 4, name: "Joe" },
],
];
console.log(intersection(myArray));
Nowadays vanilla ES is pretty powerful to work with collections in a functional way even without the help of utility libraries.
You can use regular Array's methods to get a pure JS solution.
I've created two examples with pure JS.
Of course, there could be more approaches as well. And if you already use Lodash in your application, probably it would be better to just use its high-level implementation in form of _.intersectionBy() proposed above to reduce the code complexity.
const myArray = [
[
{id: 1, name: 'Liam'},
{id: 2, name: 'Oliver'},
{id: 3, name: 'Jake'},
],
[
{id: 1, name: 'Liam'},
{id: 2, name: 'Oliver'},
{id: 4, name: 'Joe'},
],
];
// Regular functional filter-reduce
const reducer = (accum, x) => {
return accum.findIndex(y => x.id == y.id) < 0
? [...accum, x]
: accum;
};
const resultFilterReduce = myArray
.flat()
.filter(x => myArray.every(y => y.findIndex(obj => obj.id === x.id) > -1))
.reduce(reducer, []);
console.log(resultFilterReduce);
// Filter-reduce with using of "HashMap" to remove duplicates
const resultWithHashMap = Object.values(
myArray
.flat()
.filter(x => myArray.every(y => y.findIndex(obj => obj.id === x.id) > -1))
.reduce((accum, x) => {
accum[x.id] = x;
return accum;
}, {})
);
console.log(resultWithHashMap);
I want to return matching proprieties of two arrays of objects. But I got undefined from map function.
let fruits1 = [
{id: 1, name: "apple"},
{id: 2, name: "dragon fruit"},
{id: 3, name: "banana"},
{id: 4, name: "kiwi"},
{id: 5, name: "pineapple"},
{id: 6, name: "watermelon"},
{id: 7, name: "pear"},
]
let fruits2 = [
{id: 7, name: "pear"},
{id: 10, name: "avocado"},
{id: 5, name: "pineapple"},
]
fruits1.forEach((fruit1) => {
fruits2.filter((fruit2) => {
return fruit1.name === fruit2.name;
}).map((newFruit) => {
//console.log(newFruit.name);
return newFruit.name;
})
})
What are you looking for is an array intersection:
// Generic helper function that can be used for the three operations:
const operation = (list1, list2, isUnion = false) =>
list1.filter( a => isUnion === list2.some( b => a.name === b.name ) );
// Following functions are to be used:
const inBoth = (list1, list2) => operation(list1, list2, true),
inFirstOnly = operation,
inSecondOnly = (list1, list2) => inFirstOnly(list2, list1);
Usage:
console.log('inBoth:', inBoth(list1, list2));
Working Example:
// Generic helper function that can be used for the three operations:
const operation = (list1, list2, isUnion = false) =>
list1.filter( a => isUnion === list2.some( b => a.name === b.name ) );
// Following functions are to be used:
const inBoth = (list1, list2) => operation(list1, list2, true),
inFirstOnly = operation,
inSecondOnly = (list1, list2) => inFirstOnly(list2, list1);
let fruits1 = [
{id: 1, name: "apple"},
{id: 2, name: "dragon fruit"},
{id: 3, name: "banana"},
{id: 4, name: "kiwi"},
{id: 5, name: "pineapple"},
{id: 6, name: "watermelon"},
{id: 7, name: "pear"},
]
let fruits2 = [
{id: 7, name: "pear"},
{id: 10, name: "avocado"},
{id: 5, name: "pineapple"},
]
console.log('inBoth:', inBoth(fruits1, fruits2));
You could use a Set and filter the names.
const names = ({ name }) => name;
var fruits1 = [{ id: 1, name: "apple" }, { id: 2, name: "dragon fruit" }, { id: 3, name: "banana" }, { id: 4, name: "kiwi" }, { id: 5, name: "pineapple" }, { id: 6, name: "watermelon" }, { id: 7, name: "pear" }],
fruits2 = [{ id: 7, name: "pear" }, { id: 10, name: "avocado" }, { id: 5, name: "pineapple" }],
common = fruits1
.map(names)
.filter(Set.prototype.has, new Set(fruits2.map(names)));
console.log(common);
What you want to do is this:
/* first we filter fruits1 (arbitrary) */
let matchingFruits = fruits1.filter(f1 => {
/* then we filter the frut if it exists in frtuis2 */
return fruits2.find(f2 => f2.name === f1.name)
}).map(fruit => fruit.name) // and now we map if we only want the name strings
If you're not using a polyfill Array.find will not work in IE. The alternative would be using Array.indexOf (thanks for pointing this out #JakobE).
Be aware that Array.forEach return value is undefined and that, in order to actually use the Array.map correctly, one has to consume the returned value somehow or assign it to a variable, as we just did with matchingFruits.
I am trying to merge data from json that comes in array of objects. I was using the underscore solution from here merge two json object based on key value in javascript, but it turns out it doesnt override existing items which I need to do as well now.
The result should be all items of array 1 in the same order, overriden by array 2 where id = id. Items in array 2 that does not exist in array 1 should be pushed to the end of the result.
First array:
[
{id: 8, category: "A"}
{id: 2, category: "D"}
{id: 5, category: "C"}
{id: 9, category: "B"}
]
Second array:
[
{id: 1, category: "X"}
{id: 2, category: "Y"}
]
Expected result:
[
{id: 8, category: "A"}
{id: 2, category: "Y"}
{id: 5, category: "C"}
{id: 9, category: "B"}
{id: 1, category: "X"}
]
Use filter, find and concat
Given that
var arr1 = [
{id: 8, category: "A"},
{id: 2, category: "D"},
{id: 5, category: "C"},
{id: 9, category: "B"}
];
var arr2 = [
{id: 12, category: "X"},
{id: 2, category: "Y"}
];
If the order is not important
var output = arr2.concat(
arr1.filter( s =>
!arr2.find( t => t.id == s.id )
)//end filter
);//end concat
Demo
var arr1 = [{
id: 8,
category: "A"
},
{
id: 2,
category: "D"
},
{
id: 5,
category: "C"
},
{
id: 9,
category: "B"
}
];
var arr2 = [{
id: 12,
category: "X"
},
{
id: 2,
category: "Y"
}
];
var output = arr2.concat(
arr1.filter(s =>
!arr2.find(t => t.id == s.id)
) //end filter
); //end concat
console.log(output);
If the order is important
var output = arr1.map(
s => arr2.find(
t => t.id == s.id ) || s
).concat( //end map of arr1
arr2.filter(
s => !arr1.find( t => t.id == s.id )
) //end filter
);//end concat
Demo
var arr1 = [{
id: 8,
category: "A"
},
{
id: 2,
category: "D"
},
{
id: 5,
category: "C"
},
{
id: 9,
category: "B"
}
];
var arr2 = [{
id: 12,
category: "X"
},
{
id: 2,
category: "Y"
}
];
var output = arr1.map(
s => arr2.find(
t => t.id == s.id) || s
).concat( //end map of arr1
arr2.filter(
s => !arr1.find(t => t.id == s.id)
) //end filter
); //end concat
console.log(output);
You could use a Map as closure and store the index of the result array for this id.
var first = [{ id: 8, category: "A" }, { id: 2, category: "D" }, { id: 5, category: "C" }, { id: 9, category: "B" }],
second = [{ id: 12, category: "X" }, { id: 2, category: "Y" }],
result = [first, second].reduce((m => (r, a) => {
a.forEach(o => {
if (m.has(o.id)) {
r[m.get(o.id)] = o;
return;
}
m.set(o.id, r.push(o) - 1);
});
return r;
})(new Map), []);
console.log(result);
You can set a loop on your secondArray and check each object with id value against object with id of firstArray. If you find a match then simply replace the object else push the object:
var firstArray = [
{id: 8, category: "A"},
{id: 2, category: "D"},
{id: 5, category: "C"},
{id: 9, category: "B"}
];
var secondArray = [
{id: 12, category: "X"},
{id: 2, category: "Y"}
];
secondArray.forEach((obj)=>{
var match = false;
for(var i=0; i<firstArray.length; i++){
if(firstArray[i].id === obj.id){
match = true;
firstArray[i] = obj;
break;
}
}
if(!match){
firstArray.push(obj);
}
});
console.log(firstArray);
You can use a forEach to iterate through second array. For each object with the same id in the first array, update the category otherwise push in the new array.
const first = [{id: 8, category: "A"},{id: 2, category: "D"},{id: 5, category: "C"},{id: 9, category: "B"}],
second = [{id: 12, category: "X"},{id: 2, category: "Y"}],
merged = [...first];
second.forEach(o => {
let obj = first.find(({id,category}) => id === o.id);
obj ? obj.category = o.category : merged.push({...o});
});
console.log(merged);
I think reduce is better
first.reduce((res, item) => res.filter(i => i.id !== item.id).concat(item), second);
Using underscore I managed to come up with this answer my own question. It is probably not the most efficent
const newarr = _.map(arr1, obj1 => {
const r = _.find(arr2, obj2 => {
return obj1[match] === obj2[match]
})
if (typeof r === 'undefined') {
return obj1
} else {
return r
}
})
_.each(arr2, obj => {
if (_.indexOf(arr1, _.findWhere(arr1, {id: obj.id})) === -1) {
newarr.push(obj)
}
})
This should work:
const newArr = second.reduce((res, item) => res.filter(i => i.id !== item.id).concat(item), first);
I have an array of objects, each with an 'id' and a 'name'. I'm retrieving an 'id' from the server and need to reorder the array starting from this id.
Example code:
var myList = [
{
id: 0,
name: 'Joe'
},
{
id: 1,
name: 'Sally'
},
{
id: 2,
name: 'Chris'
},
{
id: 3,
name: 'Tiffany'
},
{
id: 4,
name: 'Kerry'
}
];
Given an 'id' of 2, how can I reorder the array so my output is as follows:
var newList = [
{
id: 2,
name: 'Chris'
},
{
id: 3,
name: 'Tiffany'
},
{
id: 4,
name: 'Kerry'
},
{
id: 0,
name: 'Joe'
},
{
id: 1,
name: 'Sally'
}
];
Try this:
function orderList(list, id){
return list.slice(id).concat(list.slice(0,id));
}
Link to demo
You could slice the array at given index and return a new array using spread syntax.
const myList = [{id:0,name:'Joe'},{id:1,name:'Sally'},{id:2,name:'Chris'},{id:3,name:'Tiffany'},{id:4,name:'Kerry'}];
const slice = (arr, num) => [...arr.slice(num), ...arr.slice(0, num)];
console.log(slice(myList, 2));
myList.sort(function(a,b){
return a.id>2===b.id>2?a.id-b.id:b.id-a.id;
});
newList=myList;
http://jsbin.com/kenobunali/edit?console
You could splice the wanted part and use splice to insert it at the end of the array.
var myList = [{ id: 0, name: 'Joe' }, { id: 1, name: 'Sally' }, { id: 2, name: 'Chris' }, { id: 3, name: 'Tiffany' }, { id: 4, name: 'Kerry' }],
id = 2;
myList.splice(myList.length, 0, myList.splice(0, myList.findIndex(o => o.id === id)));
console.log(myList);
using es6 spread syntax
var myList = [{ id: 0, name: 'Joe' }, { id: 1, name: 'Sally' }, { id: 2, name: 'Chris' }, { id: 3, name: 'Tiffany' }, { id: 4, name: 'Kerry' }],
id = 2;
var index = myList.findIndex(o => o.id == id);
var arr = myList.splice(0, index);
var result = [...myList, ...arr];
console.log(result);