Vuejs get data from array and place them in another array [duplicate]

Question

I have this code

let route = res.data.data;
console.log('data to be loop: ', route)

var ddd = [];
for(let i = 0; i < route.length; i++){
  ddd = [...route[i].longitude, ...route[i].latitude]
}
console.log('final data: ', ddd)

The result of code above is:

What I'm trying to do is to get longitude, latitude of each row and place them as separate array into ddd array. something like this:

ddd = [
  0: {
     lat: xxxxx,
     lng: xxxxx
  },
  1: {
     lat: xxxxx,
     lng: xxxxx
  }
]

What should I change in my code to achieve that?

since those properties are not arrays, you wouldn't use ...route[i].longitude - more like ddd.push({lat:route[i].latitude, lng:route[i].longitude} - or better yet var ddd = route.map(({longitude:lng, latitude:lat}) => ({lng, lat})); — Jaromanda X
– Jaromanda X, Commented May 14, 2020 at 3:57
...route[i].longitude is spreading each character of the latitude and longitude string to the array and it is being replaced in each loop — adiga
– adiga, Commented May 14, 2020 at 3:59

João Pedro Henrique · Accepted Answer · 2020-05-14 04:00:40Z

2

Use JavaScript map function. Your code would become:

let route = res.data.data;

const ddd = route.map((element) => {
  return {
    lat: element.latitude,
    lng: element.latitude,
  };
});

answered May 14, 2020 at 4:00

João Pedro Henrique

2462 silver badges4 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Marco · Accepted Answer · 2020-05-14 04:00:59Z

1

Use Array.map:

let route = res.data.data;
console.log('data to be loop: ', route)

let ddd = route.map(x => {
    return {
        lng: x.longitude,
        lat: x.latitude
    }
})

console.log('final data: ', ddd)

answered May 14, 2020 at 4:00

Marco

7,2863 gold badges22 silver badges56 bronze badges

Collectives™ on Stack Overflow

Vuejs get data from array and place them in another array [duplicate]

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related