配列をグループ化し、アイテムをカウントして、JavaScriptのグループに基づいて新しい配列を作成します
このようなオブジェクトの配列があるとします-
const arr = [ { region: "Africa", fruit: "Orange", user: "Gary" }, { region: "Africa", fruit: "Apple", user: "Steve" }, { region: "Europe", fruit: "Orange", user: "John" }, { region: "Europe", fruit: "Apple", user: "bob" }, { region: "Asia", fruit: "Orange", user: "Ian" }, { region: "Asia", fruit: "Apple", user: "Angelo" }, { region: "Africa", fruit: "Orange", user: "Gary" } ];
そのような配列を1つ取り込むJavaScript関数を作成する必要があります。関数は、オブジェクトの「area」プロパティに基づいてデータをグループ化するオブジェクトの新しい配列を準備する必要があります。
この関数は、特定の領域のユニークユーザーの数も保持する必要があります。
したがって、上記の配列の場合、出力は次のようになります-
const output = [ { "region": "Africa", "count": 2 }, { "region": "Europe", "count": 2 }, { "region": "Asia", "count": 2 } ];
例
このためのコードは-
になりますconst arr = [ { region: "Africa", fruit: "Orange", user: "Gary" }, { region: "Africa", fruit: "Apple", user: "Steve" }, { region: "Europe", fruit: "Orange", user: "John" }, { region: "Europe", fruit: "Apple", user: "bob" }, { region: "Asia", fruit: "Orange", user: "Ian" }, { region: "Asia", fruit: "Apple", user: "Angelo" }, { region: "Africa", fruit: "Orange", user: "Gary" } ]; const groupByArea = (arr = []) => { const res = []; arr.forEach(el => { let key = [el.region, el.user].join('|'); if (!this[el.region]) { this[el.region] = { region: el.region, count: 0 }; res.push(this[el.region]); }; if (!this[key]) { this[key] = true; this[el.region].count++; }; }, Object.create(null)); return res; } console.log(groupByArea(arr));
出力
そして、コンソールの出力は-
になります[ { region: 'Africa', count: 2 }, { region: 'Europe', count: 2 }, { region: 'Asia', count: 2 } ]
-
新しいキーワードでJavaScript配列を作成します。
以下は、新しいキーワードを使用してJavaScript配列を作成するためのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style&
-
JavaScriptオブジェクトを新しい配列にフォーマットする
以下は、JavaScriptオブジェクトを新しい配列にフォーマットするためのコードです- 例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style