console.log of array returns undefined

Question

I am trying to take two pieces of data from an object and push it as a new object into an array. The data is being supplied by an API call to my SQL database. That API call is working correctly and displaying the object in a console table. When the script runs a forEach method to extract the data into its own object and then push that new object to a new array, the new array returns "undefined". Code below:

Example data (only one placeholder entry currently, the events array will be seeded with multiple examples in this format)

events = [{location: "Emergency Shelter", latitude: "37.5434", longitude: "-77.4435"}]

Empty arrays declared and API call functioning properly:

let events = [];
let locations = [];

$.get("/api/events", data => {
 for (let i = 0; i < data.length; i++) {
   events.push(data[i]);
 }
});

console.table displays the object correctly and includes the keys "latitude" and "longitude" with the correct corresponding values

forEach method:

locations = events.forEach(location => {
  const coords = {};
  coords.latitude = location.latitude;
  coords.longitude = location.longitude;
  locations.push(coords);
});
console.log("Coordinates list: " + locations);

console.log displays "Coordinates list: undefined"

I feel like I may be missing a return somewhere, but I'm not sure where. I tried adding

return locations;

inside the forEach method but it doesn't change anything (and I believe that would exit my function prior to getting through the entire array). Any help is appreciated!

Answer 1

forEach returns nothing so locations should be undefined . You shouldn't pass return value of forEach to locations

events.forEach(location => {
  const coords = {};
  coords.latitude = location.latitude;
  coords.longitude = location.longitude;
  locations.push(coords);
});
console.log("Coordinates list: " + locations);

Also you can use map function.

 const events = [ { location: 'Emergency Shelter', latitude: '37.5434', longitude: '-77.4435' } ]; const locations = events.map(({ latitude, longitude }) => ({ latitude, longitude })); console.log(locations);

Answer 2

Try a map based approach which also would condense your code to...

 const events = [{ location: "Emergency Shelter", latitude: "37.5434", longitude: "-77.4435" }, { location: "Peopl's Kitchen", latitude: "36", longitude: "-78" }, { location: "Salvation Army", latitude: "38", longitude: "-76" }]; const locations = events.map(({ latitude, longitude }) => ({ latitude, longitude })); console.log("Coordinates list: ", locations); // do not concatenate the result. console.log("Coordinates list: " + locations); console.log("Coordinates list: " + JSON.stringify(locations));

 .as-console-wrapper { min-height: 100%;important: top; 0; }

map creates a new array by iterating another one where each item of the new array equals the return value of the mapping/transforming function which, at each iteration step, does process the current value of the original array.