数组的 console.log 返回 undefined

Question

我试图从一个对象中获取两条数据并将其作为一个新对象推送到一个数组中。数据由对我的 SQL 数据库的 API 调用提供。该 API 调用正常工作并在控制台表中显示对象。当脚本运行 forEach 方法将数据提取到自己的对象中，然后将该新对象推送到新数组时，新数组返回“未定义”。代码如下：

示例数据（目前只有一个占位符条目，事件数组将以这种格式植入多个示例）

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

声明的空数组和 API 调用正常运行：

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

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

console.table 正确显示对象并包含具有正确对应值的键“纬度”和“经度”

forEach 方法：

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

console.log 显示“坐标列表：未定义”

我觉得我可能在某个地方错过了退货，但我不确定在哪里。我尝试添加

return locations;

在 forEach 方法中，但它不会改变任何东西（我相信这会在通过整个数组之前退出我的函数）。任何帮助表示赞赏！

Answer 1

forEach 什么都不返回，所以locations 应该是undefined。您不应将 forEach 的返回值传递给 locations

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

你也可以使用map函数。

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

console.log(locations);

Answer 2

尝试基于map 的方法，该方法也可以将您的代码压缩为...

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 通过迭代另一个数组来创建一个新数组，其中新数组的每一项都等于映射/转换函数的返回值，该函数在每个迭代步骤中都会处理原始数组的当前值。