Question

我有两个不同的数组。一个是关于国家公园的名称，以及我可以从中使用的其他数据，另一个是来自整个NPS系统的警报。我比较了这两个数组，它们的共同点是 parkCode 。我该如何按国家公园对它们进行分组...例如：

黄石国家公园 -来自黄石的警报
拱门国家公园 -来自拱门的警报

这是我正在使用的数据。

国家公园名称：

 0:
 description: "."
 designation: "National Park"
 directionsInfo: "From Boston take I-95 north to Augusta, Maine, then 
 Route 3 east to Ellsworth, and on to Mount Desert Island. For an 
 alternate route, continue on I-95 north to Bangor, Maine, then take 
 Route 1A east to Ellsworth. In Ellsworth, take Route 3 to Mount Desert 
 Island."
 directionsUrl: "http://www.nps.gov/acad/planyourvisit/directions.htm"
 fullName: "Acadia National Park"
 id: "6DA17C86-088E-4B4D-B862-7C1BD5CF236B"
 latLong: "lat:44.30777545, long:-68.30063316"
 name: "Acadia"
 **parkCode: "acad"**
 states: "ME"
 url: "https://www.nps.gov/acad/index.htm"

示例警报：

113:
category: "Park Closure"
description: "The Elwha area is closed indefinitely to vehicle traffic 
beyond Madison Falls parking lot due to extensive flood damage to the 
Olympic Hot Springs Road. There is limited parking and turnaround space 
at the Madison Falls parking area."
id: "84646EA9-1DD8-B71B-0BD7AECDC56BD8AE"
**parkCode: "acad"**
title: "Elwha (Olympic Hot Springs) Road Closed to Vehicle Access"
url: "https://www.nps.gov/olym/planyourvisit/current-road-conditions.htm"

Answer 1

假设将警报作为JavaScript对象存储在名为alerts的数组中，则可以通过将其停泊在这样的对象中来对它们进行“分组”：

const alertsByPark = {};
alerts.forEach(alert => {
  // If there are no alerts recorded for the park yet, add the park as a key to the alertsByPark object
  if (!alertsByPark[alert.parkCode]) alertsByPark[alert.parkCode] = [];
  alertsByPark[alert.parkCode].push(alert);
});

这会将alertsByPark设置为如下所示的数据格式：

{
  acad: [...],
  ...
}

带有每个parkCode的键和该公园所有警报的数组。

要以问题中显示的格式输出数据，其中每个警报均以其parkCode \中引用的公园的正式名称显示，您可以在公园阵列上使用find以获得完整的信息存放警报中引用的parkCode的数据。

alerts.forEach((alert, i) => {
  // Locate the park with the parkCode matching the alert parkCode
  const park = parks.find(({ parkCode }) => parkCode === alert.parkCode);
  console.log(`${i}. ${park.fullName} - ${alert.description}`);
})

这再次假设您将警报放置在名为alerts的对象数组中，并将停放的对象放置在名为parks的对象数组中。它将输出类似

的列表

1. Acadia National Park - The Elwha area is closed indefinitely to...
2. park name - alert description

等

Answer 2

parks.map(park => {
 park.alerts = alerts.filter(alert => alert.parkCode === park.parkCode)
 return park
})

这将返回包含prop'alerts'（警报数组）的parks数组

示例：

const parks = [
 { name: 'Yellowstone', parkCode: 'ys' },
 { name: 'Arcadia', parkCode: 'ar' },
 { name: 'Arches', parkCode: 'arch' },
 { name: 'A park without alerts', parkCode: 'PARK' }
 ]

const alerts = [
 { description: 'Alert 1', parkCode: 'ys' },
 { description: 'Alert 2', parkCode: 'ys' },
 { description: 'Alert 3 ', parkCode: 'ys' },
 { description: 'Alert 4', parkCode: 'ys' },
 { description: 'Alert 5', parkCode: 'arch' },
 { description: 'Alert 6', parkCode: 'ar' },
 { description: 'Alert 7', parkCode: 'ys' },
 { description: 'Alert 8', parkCode: 'arch' },
 { description: 'Alert 9', parkCode: 'ys' },
 { description: 'Alert 10', parkCode: 'ys' },
 { description: 'Alert 11', parkCode: 'ar' },
 { description: 'Alert 12', parkCode: 'ys' },
 { description: 'Alert 13', parkCode: 'ar' },
 { description: 'Alert 14', parkCode: 'ar' },
 { description: 'Alert 15', parkCode: 'ys' },
 { description: 'An alert to unknown park', parkCode: 'ALERT' }
 ]

 let parksWithAlerts = parks.map(park => {
   park.alerts = alerts.filter(alert => alert.parkCode === park.parkCode)
   return park
 })

 console.dir(parksWithAlerts[0])

{ name: 'Yellowstone',
  parkCode: 'ys',
  alerts:
   [ { description: 'Alert 1', parkCode: 'ys' },
   { description: 'Alert 2', parkCode: 'ys' },
   { description: 'Alert 3 ', parkCode: 'ys' },
   { description: 'Alert 4', parkCode: 'ys' },
   { description: 'Alert 7', parkCode: 'ys' },
   { description: 'Alert 9', parkCode: 'ys' },
   { description: 'Alert 10', parkCode: 'ys' },
   { description: 'Alert 12', parkCode: 'ys' },
   { description: 'Alert 15', parkCode: 'ys' } ] }

已加入的警报

let parksWithAlerts = parks.map(park => {
   park.alerts = alerts.filter(alert => alert.parkCode === park.parkCode)
   return park
 }).map(park =>{
    park.alerts = park.alerts.map(alert => alert.description).join(' - ')
    return park
 })



console.dir(parksWithAlerts[0])

{ name: 'Yellowstone',
  parkCode: 'ys',
  alerts: 'Alert 1 - Alert 2 - Alert 3  - Alert 4 - Alert 7 - Alert 9 - Alert 10 - Alert 12 - Alert 15' }

如何通过一个公共变量将两个不同的数组分组？

2 个答案: