JavaScript 配列 重複した列を足して返したい

Question

前提・実現したいこと

JavaScriptで配列の変換をしたい

該当のソースコード

最初の配列

let data = [["a","b",10],["a","b",20],["a","c",30],["a","c",40],["a","d",50]];

結果

[["a","b",30],["a","c",70],["a","d",50];

data[0]とdata[1]が一致した時に,data[2]を足した配列を返したいです。

Answer 1

すでにベストアンサーが決まった後に失礼します。

考え方

この回答では、考え方として以下の1.〜 **4. **の考え方によるアプローチを採ります。

**1.**説明の便宜上、data の要素である配列(例： ["a","b",10] )について、
・末尾の要素を除いた配列(例: ["a", "b"] )を、キー配列と呼ぶ。
・末尾の要素(例: 10) のことを、単に 数値 と呼ぶ。

**2.**所与の data から、まず以下の２点を作成
(ⅰ)totals：各キー配列別の数値の合計が格納されたオブジェクト
(ⅱ)keys ： data の要素に出現するキー配列を、出現順に、かつ、重複なく含む配列

**3.**上記2.(ⅰ)のオブジェクト totals には、キー配列が例えば ["a", "b"] である数値の合計（ご質問にあるサンプルだと 30)が totals.a.b に格納されるようにする。
・従って、ご質問の例だと、 totals は以下のようなオブジェクトになる。

// totals の例
{ a: { b: 30, c: 70, d: 50 } }

**4.**オブジェクト totals と keys から、結果として望ましい形式の配列 result を得る。

コード例

以下は、上記の考え方によるコードです。配列やオブジェクトの操作で便利なライブラリ lodash を使用しています。

const [totals, keys] = data.reduce(([obj, keys], ary) => {
  const [k, v] = [_.initial(ary), _.last(ary)];
  if (_.has(obj, k)) {    
    _.set(obj, k, _.get(obj, k) + v);
  }
  else {
    _.set(obj, k, v);
    keys.push(k);
  }
  return [obj, keys];
}, [{}, []]);

const result = keys.map(k => [...k, _.get(totals, k)]);

上記のコードで使っている lodash のメソッドは以下です。

• totalsのキー配列に対する値の取得、設定および存在確認： _.get, _.set, _.has
• 配列から最後の要素を取得： _.last
• 配列から最後の要素を除いた配列の取得： _.initial

　

　

以下は、上記のコードを動作確認するためのサンプルです。動作確認のため、dataに要素を追加しています。

• 動作確認用CodePen: https://codepen.io/jun68ykt/pen/LYVMyMP?editors=0012

以上、参考になれば幸いです。

Answer 2

new Map()と分割代入の練習で作ってみました。

let data = [["a", "b", 10], ["a", "b", 20], ["a", "c", 30], ["a", "c", 40], ["a", "d", 50], ["a", "b", "c", 50], ["a", "b", "c", 50]];
//[["a","b",30],["a","c",70],["a","d",50];

const aggregate = new Map();
data.forEach(keys_value => {
    const value_keys = Array.from(keys_value);
    value_keys.unshift(value_keys.pop());
    const [value, ...keys] = [...value_keys];
    aggregate.set(JSON.stringify(keys), (aggregate.get(JSON.stringify(keys)) || 0) + value);
});

const result = [...aggregate.entries()].map(v => [...JSON.parse(v[0]), v[1]]); //[ [ "a", "b", 30 ], [ "a", "c", 70 ], [ "a", "d", 50 ], [ "a", "b", "c", 100 ] ]
console.log(result);

 [ [ 'a', 'b', 30 ],
  [ 'a', 'c', 70 ],
  [ 'a', 'd', 50 ],
  [ 'a', 'b', 'c', 100 ] ]

Answer 3

複雑なので綺麗に収まりませんね。

const data = [
  ["a","b",10],
  ["a","b",20],
  ["a","c",30],
  ["a","c",40],
  ["a","d",50]
];
const result = Object.entries(
  data
    .map(([k1, k2, num]) => [`${k1}.${k2}`, num])
    .reduce((o, [k, num]) => ({...o, [k]: (o[k] || 0) + num}), {})
).map(([key, num]) => [...key.split('.'), num]);

console.log(JSON.stringify(result, null, 2));

[
  [
    "a",
    "b",
    30
  ],
  [
    "a",
    "c",
    70
  ],
  [
    "a",
    "d",
    50
  ]
]

Comments

[yambejp]

文字列の連結で処理するのは微妙ですね
セパレータを予約語としてきちんと仕様提示しないと
バグに繋がります

[miyabi-sun]

そうですね、プロの現場なら確実に共有・確認しておくべき事項ですね。
私はキー情報候補になる文字列には`.`は使わないみたいなローカルルールを付与することが多いですかね。

`["a", "b"] === ["a", "b"]`の結果が`false`になるような言語ですし、
ガチで作るなら修正欄で死ぬほど詰めまくる必要があります。

じゃあ最初から回答するなよみたいな感じになりますので、
質問文の状況から必要最小限のコードで良いんじゃない？くらいに考えて回答に起こしました。

[yambejp]

微妙なだけで絶対ダメとは思いません。
「配列内にピリオドを含む文字を入れてはいけません」
と注記があれば大丈夫でしょう。
もしくはなんらかのセパレータをユーザーが指定できるようにするとか
調整次第ですかね・・・

Answer 4

const data = [["a","b",10],["a","b",20],["a","c",30],["a","c",40],["a","d",50]];
const o = data.reduce((a,c)=> a[c[0]] ? (a[c[0]][c[1]] ? {...a, [c[0]]:{...a[c[0]],[c[1]]: a[c[0]][c[1]] + c[2]} }: {...a, [c[0]]:{...a[c[0]],[c[1]]:c[2]}}) : {...a, [c[0]]:{[c[1]]:c[2]} },{});
const p = Object.keys(o).reduce((a,c) => a.concat([Object.keys(o[c]).map(e=>[c,e,o[c][e]])]),[]);
console.log(p);

group をつくって、展開すると考えました。

Answer 5

思ったよりグダグダになったので、最適解は他の回答者におまかせします

Comments

[yambejp]

var data = [["a","b",10],["a","b",20],["a","c",30],["a","c",40],["a","d",50]];
var res=[...data.reduce((x,y)=>(x.add(JSON.stringify([y[0],y[1]])),x),new Set())]
.map(x=>JSON.parse(x))
.map(x=>[x[0],x[1],data.filter(y=>x[0]==y[0]&&x[1]==y[1]).reduce((x,y)=>x+y[2],0)]);
console.log(res);

[yambejp]

あとa,bとb,aが一緒かどうかでも結果は変わってきます