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

Question

我有两个不同的数组。一个是国家公园的名称和其他我可以使用的数据，另一个是来自整个NPS系统的警报。我比较了这两个数组，它们的一个不同之处就是parkCode。我如何按照国家park...example对它们进行分组：

1. 黄石国家公园-alert来自黄石公园
2. 拱门国家公园-alert拱门

这是我正在处理的数据。

国家公园名称：

 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
})

这将返回带有道具“警报”(警报数组)的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' }