一天24小时拆分成24点、48点、96点、288点

某些时候我们要对一天24小时进行一个拆分，比如每隔5分钟，15分钟，半小时，一小时就拆分一次，就形成了一个288点，96点，48点，24点的数组，可能会用于循环生成表格表头，或者下拉框的options选项。

24点

export function get24TimePoints(start = 0, end = 24) {
  const data = [];
  for (let i = start; i <= end; i++) {
    let tmp1 = "";
    if (i <= 9) {
      tmp1 = "0" + i + ":00";
    } else if (i <= 24) {
      tmp1 = i + ":00";
    }
    if (tmp1) {
      data.push(tmp1);
    }
  }
  return data;
}

接收两个参数，分别是开始时间和结束时间，如果不传参数就默认0点到24点，这么一来就会生成有25个元素的数组（包含0点），如果想要1点到24点，就传参1和24。或者用get24TimePoints().splice(1)。

下面这是默认的效果：

48点

export function get48TimePoints() {
  const data = [];
  for (let i = 0; i <= 24; i++) {
    let tmp1 = "";
    if (i <= 9) {
      for (let j = 0; j < 2; j++) {
        const value = j * 30 < 10 ? `0${j * 30}` : `${j * 30}`;
        tmp1 = "0" + i + `:${value}`;
        data.push(tmp1);
      }
    } else if (i <= 23) {
      for (let j = 0; j < 2; j++) {
        const value = j * 30 < 10 ? `0${j * 30}` : `${j * 30}`;
        tmp1 = i + `:${value}`;
        data.push(tmp1);
      }
    } else if (i == 24) {
      tmp1 = i + ":00";
      data.push(tmp1);
    }
  }
  return data;
}

获取0点到24点中每隔半小时拆分一次的数组，共有49个元素（包含了0点），如果不想要就get48TimePoints().splice(1)。

这是默认效果：

96点

这个可能用的比较多一点，因为工作需求会频繁用于表格表头的渲染，所以我会给它带一个prop。

    export function get96TimePoints(key = "p", key2 = "", number = 0, number1 = 3) {
  const dataList = [];
  let count = number;
  for (let i = 0; i <= 24; i++) {
    if (i < 10) {
      if (i === 0) {
        for (let j = 1; j < 4; j++) {
          count += 1;
          const data = `0${i}:${j * 15}`;
          dataList.push({
            label: data,
            prop: `${key}${count * number1}${key2}`,
          });
        }
      } else {
        for (let j = 0; j < 4; j++) {
          count += 1;
          let data = "";
          if (j === 0) {
            data = `0${i}:00`;
          } else {
            data = `0${i}:${j * 15}`;
          }
          dataList.push({
            label: data,
            prop: `${key}${count * number1}${key2}`,
          });
        }
      }
    } else if (i < 24) {
      for (let j = 0; j < 4; j++) {
        count += 1;
        let data = "";
        if (j === 0) {
          data = `${i}:00`;
        } else {
          data = `${i}:${j * 15}`;
        }
        dataList.push({
          label: data,
          prop: `${key}${count * number1}${key2}`,
        });
      }
    } else {
      count += 1;
      dataList.push({
        label: `24:00`,
        prop: `${key}${count * number1}${key2}`,
      });
    }
  }
  return dataList;
}

这是默认效果：

为什么是p3而不是p1是有时候会和288点联动，到时候说到288点就知道了，想从p1开始也行，这个方法有配置参数，第一个参数和第二个参数是前后的文字的，第三个参数是从多少数字开始，第四个参数是计数的倍数，比如这个p3就是因为第四个参数默认是3。

get96TimePoints("p", "P", 0, 1)

288点

这个就是每隔五分钟拆分一次了。

export function get288TimePoints(key = "p", key2 = "", number = 0) {
  const dataList = [];
  let count = number;
  for (let i = 0; i <= 24; i++) {
    if (i < 10) {
      if (i === 0) {
        for (let j = 1; j <= 11; j++) {
          count += 1;
          let data = "";
          if (j == 1) {
            data = `00:05`;
          } else {
            data = `0${i}:${j * 5}`;
          }
          dataList.push({
            label: data,
            prop: `${key}${count}${key2}`,
          });
        }
      } else {
        for (let j = 0; j < 12; j++) {
          count += 1;
          let data = "";
          if (j === 0) {
            data = `0${i}:00`;
          } else if (j == 1) {
            data = `0${i}:0${j * 5}`;
          } else {
            data = `0${i}:${j * 5}`;
          }
          dataList.push({
            label: data,
            prop: `${key}${count}${key2}`,
          });
        }
      }
    } else if (i < 24) {
      for (let j = 0; j < 12; j++) {
        count += 1;
        let data = "";
        if (j === 0) {
          data = `${i}:00`;
        } else if (j == 1) {
          data = `${i}:0${j * 5}`;
        } else {
          data = `${i}:${j * 5}`;
        }
        dataList.push({
          label: data,
          prop: `${key}${count}${key2}`,
        });
      }
    } else {
      count += 1;
      dataList.push({
        label: `24:00`,
        prop: `${key}${count}${key2}`,
      });
    }
  }
  return dataList;
}

用法和96点的差不多。

get288TimePoints("p")