サーバーから帰ってきたjsonデーターをfilterする方法について

Question

実現したいこと

下記のデータ構造にて、item_idの先頭のデータのみを取得する方法を知りたい

// {id: 1, text: "1週間ごと", week: 1, item_id: 1}
// {id: 2, text: "2週間ごと", week: 2, item_id: 1}
// {id: 3, text: "3週間ごと", week: 3, item_id: 1}
// {id: 4, text: "4週間ごと", week: 4, item_id: 1}
// {id: 5, text: "2週間ごと", week: 2, item_id: 2}
// {id: 6, text: "3週間ごと", week: 3, item_id: 2}
// {id: 7, text: "4週間ごと", week: 4, item_id: 2}

// =>　求めている答え
// {id: 1, text: "1週間ごと", week: 1", item_id: 1}
// {id: 5, text: "2週間ごと", week: 2", item_id: 2}

試したこと

下記のような感じで実装すればいけそうですが、もっとシンプルに書ける方法があれば知りたいです。

let arr = [];
const object = [...上の中身];
for(let i=0;i<object.lenght;i++){
 if(arr.length == 0){
   arr.push(object[i])
 }else if(!arr.map(e=> e.item_id).includes(object[i].item_id)){
   arr.push(object[i])
 }
}

Comments

[yambejp]

id=6がダブっているのは問題ないですか？(idでユニークが担保されるかどうか)
これは最初にでてくるitem_idを拾っているように見えますが
idは小さい順で並ぶ保証はありますか？

[nanase21]

id=6は、私の記述ミスでした。
修正いたします。
idは基本的にsortしたデータが返却されるため、小さい順に出てきます。

Answer 1

結局ほぼ命題とおなじロジックがラクそうですが

  const res=object.reduce((x,y)=>(!x.map(z=>z.item_id).includes(y.item_id)&&x.push(y),x),[]);

Comments

[nanase21]

ご教示いただきありがとうございます。
私の知らないメソッドがいくつかあり、とても勉強になります。
分からないメソッドについては調べてみたいと思います。
ありがとございました。

Answer 2

下記のような感じでどうでしょう？

const object = [ {id: 1, text: "1週間ごと", week: 1, item_id: 1},
{id: 2, text: "2週間ごと", week: 2, item_id: 1},
{id: 3, text: "3週間ごと", week: 3, item_id: 1},
{id: 4, text: "4週間ごと", week: 4, item_id: 1},
{id: 5, text: "2週間ごと", week: 2, item_id: 2},
{id: 6, text: "3週間ごと", week: 3, item_id: 2},
{id: 6, text: "4週間ごと", week: 4, item_id: 2}]

// item_idを重複なしの配列にして
const keys = Array.from(new Set(object.map((o)=>o.item_id)));
// objectからそれぞれのitem_idで最初に見つかった1件を取得し配列化
const target = keys.map((k) => object.find((o) => o.item_id === k));
console.log(target)

Comments

[nanase21]

ご教示いただきありがとうございます。
このようなコードを求めていました。