JSFiddle - React, Tailwind, and code Playground

JavaScript

/**
   * 四半期を算出する
   * [通常] 1-3月 -> 1, 4-6月 -> 2, 7-9月 -> 3, 10-12月 -> 4 を返す
   * [開始月を5にした場合] 5-7月 -> 1, 8-10月 -> 2, 11-1月 -> 3, 2-4月 -> 4 を返す
   *
   * @param  {Number} month   月
   * @param  {Number} start   開始月
   * @return {Number} quarter 四半期
   */
  function calcQuarter(month, start = 1)
  {
    let index = (month - start + 13) % 12 || 12;
    let quarter = parseInt((index - 1) / 3, 10) + 1;
    return quarter;
  }
  
    /**
   * 四半期ごとの開始月と終了月を取得する
   *
   * @return {Object} monthRanges 四半期ごとの開始月 終了月
   */
  getMonthRanges()
  {
    let quarters = [];
    for(let i = 1; i <= 12; i++){
      let quarter = this.calcQuarter(i, this.startMonth);
      let obj = {
        "month" : i,
        "quarter" : quarter
      }
      quarters.push(obj);
    }

    let monthRanges = quarters.reduce((obj, {month, quarter}) => {
      // 半期ごとに比較用オブジェクトを生成
      obj[quarter] = obj[quarter] || { quarter, start: Infinity, end: -Infinity};

      // 半期ごとに一番数値が少ない月を開始月、一番数値が大きい月を終了月とする
      obj[quarter].start = obj[quarter].start > month ? month : obj[quarter].start;
      obj[quarter].end = obj[quarter].end < month ? month : obj[quarter].end;

      return obj;
    },{});

    // [TODO] 年またぎ時の処理
    monthRanges[3].start = 11;
    monthRanges[3].end = 1;

    console.log(monthRanges); // e.g. { 1: { min: 5, max: 7, quarter: 1 }, ... }
    return monthRanges;
  }