javascriptのfilterを使って要素の合計数を求める

Question

前提・実現したいこと

zenkokuコンポーネントの地域名と、kantoコンポーネントの地域名が一致したデータの中から、
各地域のareuserの合計数を求めたいですが、わかんなくてどなたかご教授お願いします。。

発生している問題・エラーメッセージ

現在のコンソールは、空で帰ってきてます。

[]

該当のソースコード

const zenkoku = [
    {
      key: 0,
      areaUser: '66',
      cityName: 'Tokyo',
    },
    {
      key: 1,
      areaUser: '38',
      cityName: 'Kanagawa',
    },
    {
      key: 2,
      areaUser: '16',
      cityName: 'Okinawa',
    },
  ]

  const kanto = [
    'Ibaraki',
    'Tochigi',
    'Gunma',
    'Saitama',
    'Chiba',
    'Tokyo',
    'Kanagawa',
  ]
  const kantoResult = zenkoku.filter((area) => area.cityName === kanto)
console.log(kantoResult)

試したこと

補足情報（FW/ツールのバージョンなど）

Answer 1

合計する部分はこれから書くのですよね？

  const kantoResult = zenkoku.filter((area) => kanto.includes(area.cityName));

includes() メソッドは、特定の要素が配列に含まれているかどうかを true または false で返します。

Array.prototype.includes() - JavaScript | MDN

Comments

[kaoru_tujimiya]

ありがとうございます！お陰様でできました。

Answer 2

const kantoResult = zenkoku.filter(x=> kanto.indexOf(x.cityName)>-1).map(x=>parseInt(x.areaUser)).reduce((x,y)=>x+y);

Comments

[kaoru_tujimiya]

ありがとうございます！お陰様でできました。

[yambejp]

よく考えたらreduceだけで行けそうな気も・・・

const kantoResult = zenkoku.reduce((x,y)=>x+kanto.includes(y.cityName)*y.areaUser,0);

[kaoru_tujimiya]

こちらでもいけました！こっちのほうがシンプルで分かりやすかったです。