web-dev-qa-db-ja.com

TypeScriptでアイテムをlodashでグループ化する

オブジェクトのコレクションを日付でグループ化する必要があります。

var meetings =
[
   {date:"2001-01-01 13:00", place:"park"},
   {date:"2001-01-01 14:00", place:"school"},
   {date:"2001-01-02 11:00", place:"house"}
];

したがって、次のようになります。

var groupedMeetings = 
[
   {
      day:"2001-01-01", 
      meetings: 
      [
         {date:"2001-01-01 13:00", place:"park"},
         {date:"2001-01-01 14:00", place:"school"}
      ]
   },
   {
      day:"2001-01-02", 
      meetings: 
      [
         {date:"2001-01-02 11:00", place:"house"}
      ]
   }
]

_.groupByと_.mapでそれらをグループ化することができました

var g = _.groupBy(meetings, function(i){return getDatePart(i.date);});
var groupedMeetings  = _.map(g, function(items,key){return {day:key, meetings:items};});

しかし、TypeScriptで同じことを行うのに問題があります https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/lodash/lodash.d.ts

まず、クラスを宣言しました。

class Meeting
    {
       date: Date,
       place: Meeting[]
    }
class GroupedMeeting
    {
      constructor(private day: Date, private meetings: Meeting[]) {}
    }

GroupByのどのオーバーロードを使用するかわかりませんか？そして、それをグループ化されたアイテムのリストにマップする方法は？

var grouped: _.Dictionary<Meeting[]> = _.groupBy(meetings, (i: Meeting) => { return this.getDatePart(i.date); });

var groupedMeetings : GroupedMeeting[] = _.map(grouped, (items: Meeting[], key: Date) => { return new GroupedMeeting (key, items); });
typescriptlodashdefinitelytyped
6
jlp

_.groupBy() メソッドを利用して、グループ化に必要な値（日付の年、月、日の部分）を返すコールバックを追加できます。次に、 _.map() を使用して必要な値を設定できます。

以下の例ではES6を使用しています。

var meetings =
[
   {date:"2001-01-01 13:00", place:"park"},
   {date:"2001-01-01 14:00", place:"school"},
   {date:"2001-01-02 11:00", place:"house"}
];

var result = _(meetings)
  .groupBy(meeting => meeting.date.split(' ').shift())
  .map((meetings, day) => ({ day, meetings }))
  .value();

document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');
<script src="https://cdn.jsdelivr.net/lodash/4.11.2/lodash.min.js"></script>

ES5バージョンは次のとおりです。

var meetings =
[
   {date:"2001-01-01 13:00", place:"park"},
   {date:"2001-01-01 14:00", place:"school"},
   {date:"2001-01-02 11:00", place:"house"}
];

var result = _(meetings)
  .groupBy(function(meeting) { return meeting.date.split(' ').shift(); })
  .map(function(meetings, day) { return { day: day, meetings: meetings }; })
  .value();

document.write('<pre>' + JSON.stringify(result, 0, 4) + '</pre>');
<script src="https://cdn.jsdelivr.net/lodash/4.11.2/lodash.min.js"></script>
4
ryeballar

すでにすべてのツールを持っているのに、なぜライブラリを使用するのですか？ :)

const dateMap  = meetings
    .reduce(
    (m, v) => {
        const day = v.date.substring(0,10)
        const entry = m[day]
        if (typeof entry === 'undefined') {
            m[day] = [v] 
        }
        else {
            entry.Push(v)
        }
        return m
    },
    {}    
)

const groupedMeetings = Object.keys(dateMap).map(d => {
    return {
        day: d,
        meetings: dateMap[d]
    }
})

TypeScriptで実行されていることを確認してください playground

3
Bruno Grieder

Lodashの型があれば（TypeScriptの新しいバージョンでは_npm i --save-dev @types/lodash_を実行します）、_。groupByや_.keyByなどのメソッドはジェネリック型を受け入れます。

例：_.groupBy<TypeEachGroupCarries>(expression)は、タイプTypeEachGroupCarriesのアイテムを含む配列の配列を返します。

3
arg20