連想配列内で重複しているものを、文章の中ですべて表示させたい

Question

前提

jQueryで「今日は何の日」かを表示させるプログラムを作りたいです。
同じ日に複数のイベントがある場合にはそれらすべてを文章中に表示させたいのですが、調べても方法が分かりませんでした。

現状と実現したいこと

現状：8月26日に「8月26日は楽しい日！」と表示できます
実現したいこと：8月26日に「8月26日はなんでもない日と楽しい日！」と表示したいです

該当のソースコード

<p class="l_event"></p>

let now = new Date();
    let Month = now.getMonth() + 1;
    let Dat = now.getDate();
    
    const event = [
      { mon: '5', date:'6', detail:'ゴムの日' },
      { mon: '2', date:'22', detail:'猫の日' },
      { mon: '11', date:'11', detail:'ポッキーの日' },
      { mon: '8', date:'26', detail:'なんでもない日' },
      { mon: '8', date:'26', detail:'楽しい日' }
    ];

    for(i=0; i<event.length; i++){
      if(event[i].mon == Month && event[i].date == Dat){
        $('.l_event').html(Month + '月' + Dat + '日は' + event[i].detail + '！');
      };
    };

Answer 1

const event = [
  { mon: '5', date:'6', detail:'ゴムの日' },
  { mon: '2', date:'22', detail:'猫の日' },
  { mon: '11', date:'11', detail:'ポッキーの日' },
  { mon: '8', date:'26', detail:'なんでもない日' },
  { mon: '8', date:'26', detail:'楽しい日' }
  ];
const func=(m,d)=>`${m}月${d}日は${(str=event.filter(x=>x.mon==m&&x.date==d).map(x=>x.detail).join('と'))?str+'！':'不明'}`;
console.log(func(5,6));
console.log(func(8,26));
console.log(func(1,1));

Comments

[omiyage100]

ありがとうございます！
書き方がとても勉強になりました。