What the best practice to filter or reduce an object? I would have done this via for-loop and created a new array but understand that you can do it somehow via filter property in JavaScript?
var myObject = [
{dimensions: [451, 255], margins: [0, 2, 0, 29]},
{dimensions: [222, 390], margins: [0, 5, 0, 37]},
{dimensions: [333, 390], margins: [0, 8, 0, 37]}
];
I would like to filter out separately the dimensions first, property and margins second and fourth, property in a array to have:
var dimension = [ 451, 222, 333 ];
var margins = [ 2, 29, 5, 37, 8, 37 ];
Also if I filter an object and update these variables, is there a way to map them back? Or should I have it as below to map afterwards:
var dimension = [ a: 451, b: 222, c: 333];
var margins = [ a: [2, 29], b : [5, 37], c: [8, 37] ];
You can use reduce
:
var myObject = [{
dimensions: [451, 255],
margins: [0, 2, 0, 29]
}, {
dimensions: [222, 390],
margins: [0, 5, 0, 37]
}, {
dimensions: [333, 390],
margins: [0, 8, 0, 37]
}];
var results = myObject.reduce(function(acc, item) {
acc.dimensions.push(item.dimensions[0]);
acc.margins.push(item.margins[1], item.margins[3]);
return acc;
}, { dimensions: [], margins: [] });
console.log(results); // {dimensions: Array[3], margins: Array[6]}
Working fiddle: https://jsfiddle.net/9ynez03c/
To map back to myObject
:
var dimensions = results.dimensions;
var margins = results.margins;
var updateMyObject = function() {
myObject.forEach(function(item, i) {
item.dimensions[0] = dimensions[i];
item.margins[1] = margins[i * 2];
item.margins[3] = margins[i * 2 + 1];
})
};
updateMyObject();
This is very clunky. I'm not sure how you're using this data, but something tells me that you should be using an object in the first place and then accessing/updating properties as needed instead of creating additional arrays.
New fiddle with update: https://jsfiddle.net/adrice727/g01s80qf/
Filtering works fine, if you only want a subset of an array which meets some conditions (like all numbers greater than 5 from an array of arbitrary numbers). In your case I would definitely go for a loop.
var myObject = [ {dimensions: [451, 255], margins: [0, 2, 0, 29]}, {dimensions: [222, 390], margins: [0, 5, 0, 37]}, {dimensions: [333, 390], margins: [0, 8, 0, 37]} ] var dimensions = []; var margins = []; myObject.forEach(function(item) { dimensions.push(item.dimensions[0]); margins.push(item.margins[1]); margins.push(item.margins[3]); // or by using concat(): // dimensions = dimensions.push(item.dimensions[0]); // margins = margins.concat([item.margins[1], item.margins[3]]); }); console.log("dimensions:", dimensions); console.log("margins:", margins);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.