1.分析時(shí)間插件的格式化

interface OType {
  'm+': number;
  'd+': number;
  'h+': number;
  'i+': number;
  's+': number;
  [key: string]: number;
}
 // 正則格式化日期
  const formatDate = (date: Date, dateFormat: string): string => {
    if (/(y+)/.test(dateFormat)) {
      dateFormat = dateFormat.replace(
        RegExp.$1,
        `${date.getFullYear()}`.substr(4 - RegExp.$1.length)
      );
    }
    // 格式化日、時(shí)、分、秒后面的+號(hào)用于正則的匹配
    const o: OType = {
      'm+': date.getMonth() + 1, // 月
      'd+': date.getDate(), // 天
      'h+': date.getHours(), // 時(shí)
      'i+': date.getMinutes(), // 分
      's+': date.getSeconds(), // 秒
    };

    Object.keys(o).forEach((k): void => {
      // n+ 匹配任何包含至少一個(gè) n 的字符串
      if (new RegExp(`(${k})`).test(dateFormat)) {
        // 取出對(duì)應(yīng)的值
        const str = `${o[k]}`;
        // RegExp.$1 指的是與正則表達(dá)式匹配的第一個(gè) 子匹配(以括號(hào)為標(biāo)志)字符串
        dateFormat = dateFormat.replace(
          RegExp.$1,
          RegExp.$1.length === 1 ? str : padLeftZero(str)
        );
      }
    });
    return dateFormat;
  };
  // 日期時(shí)間補(bǔ)零
  const padLeftZero = (str: string): string => {
    return `00${str}`.substr(str.length);
  };

問(wèn)題：OType ： [key: string]: number;主要為了約束 Object.keys循環(huán)時(shí) ${o[k]}取值報(bào)錯(cuò)

image.png

image.png

解決辦法：1.在聲明接口OType 添加[key: string]: number;約束 2.使用斷言類型約束

interface OType {
  'm+': number;
  'd+': number;
  'h+': number;
  'i+': number;
  's+': number;
}
 // 正則格式化日期
  const formatDate = (date: Date, dateFormat: string): string => {
    if (/(y+)/.test(dateFormat)) {
      dateFormat = dateFormat.replace(
        RegExp.$1,
        `${date.getFullYear()}`.substr(4 - RegExp.$1.length)
      );
    }
    // 格式化日、時(shí)、分、秒后面的+號(hào)用于正則的匹配
    const o: OType = {
      'm+': date.getMonth() + 1, // 月
      'd+': date.getDate(), // 天
      'h+': date.getHours(), // 時(shí)
      'i+': date.getMinutes(), // 分
      's+': date.getSeconds(), // 秒
    };

    Object.keys(o).forEach((k): void => {
      // n+ 匹配任何包含至少一個(gè) n 的字符串
      if (new RegExp(`(${k})`).test(dateFormat)) {
        // 使用斷言約束
        const str = `${o[k as keyof OType]}`;
        // RegExp.$1 指的是與正則表達(dá)式匹配的第一個(gè) 子匹配(以括號(hào)為標(biāo)志)字符串
        dateFormat = dateFormat.replace(
          RegExp.$1,
          RegExp.$1.length === 1 ? str : padLeftZero(str)
        );
      }
    });
    return dateFormat;
  };
  // 日期時(shí)間補(bǔ)零
  const padLeftZero = (str: string): string => {
    return `00${str}`.substr(str.length);
  };

image.png