发布时间:2023-05-06 文章分类:编程知识 投稿人:李佳 字号: 默认 | | 超大 打印

工具函数

收集项目中常用的工具函数,以备后用,使用 TS 编写。

1. 时间格式化

/**
 * 格式化时间格式
 * @param {*} value 传入时间(单位秒)
 * @returns 返回时间格式 XX 天 XX 小时 XX 分钟 XX 秒
 */
export const formatSecond = function (value: number): string {
  value = value ?? 0;
  let secondTime = parseInt(value); // 秒
  let minuteTime = 0; // 分
  let hourTime = 0; // 小时
  let dayTime = 0; // 天
  let result = '';
  //如果秒数不小于 60,将秒数转换成整数
  if (secondTime >= 60) {
    //获取分钟,除以 60 取整数,得到整数分钟
    minuteTime = parseInt(secondTime / 60);
    //获取秒数,秒数取佘,得到整数秒数
    secondTime = parseInt(secondTime % 60);
    //如果分钟不小于 60,将分钟转换成小时
    if (minuteTime >= 60) {
      //获取小时,获取分钟除以 60,得到整数小时
      hourTime = parseInt(minuteTime / 60);
      //获取小时后取佘的分,获取分钟除以 60 取佘的分
      minuteTime = parseInt(minuteTime % 60);
      //如果小时数不小于 24,将小时转换成天
      if (hourTime >= 24) {
        //获取天,获取小时除以 24,得到整数天
        dayTime = parseInt(hourTime / 24);
        //获取天后取佘的小时
        hourTime = parseInt(hourTime % 24);
      }
    }
  }
  if (secondTime > 0) {
    result = `${parseInt(secondTime)} 秒`;
  }
  if (minuteTime > 0) {
    result = `${parseInt(minuteTime)} 分 ${result}`;
  }
  if (hourTime > 0) {
    result = `${parseInt(hourTime)} 时 ${result}`;
  }
  if (dayTime > 0) {
    result = `${parseInt(dayTime)} 天 ${result}`;
  }
  return result;
};

2. 系统、环境和浏览器

/**
 * 判断是否 PC
 */
export const isPC = (): boolean => {
  const userAgentInfo = navigator.userAgent;
  const Agents = ['Android', 'iPhone', 'SymbianOS', 'Windows Phone', 'iPad', 'iPod'];
  let flag = true;
  for (let v = 0; v < Agents.length; v++) {
    if (userAgentInfo.indexOf(Agents[v]) > 0) {
      flag = false;
      break;
    }
  }
  return flag;
};
/**
 * 判断是否微信环境(微信app,桌面微信软件等)
 */
export const isWechat = (): boolean => {
  return /MicroMessenger/i.test(window.navigator.userAgent);
};
/**
 * 判断是否 IOS 系统
 */
export const isIOS = (): boolean => {
  const u = navigator.userAgent;
  return !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
};
/**
 * 判断是否 Android 系统
 */
export const isAndroid = (): boolean => {
  const u = navigator.userAgent;
  return u.indexOf('Android') > -1 || u.indexOf('Adr') > -1;
};
/**
 * 浏览器
 */
export const getBrowser = () => {
  let explorer = navigator.userAgent.toLowerCase();
  let browser = "";
  if (
    explorer.indexOf("msie") > -1 ||
    !!window.ActiveXObject ||
    "ActiveXObject" in window
  ) {
    browser = "IE";
  } else if (explorer.indexOf("chrome") > -1) {
    browser = "chrome";
  } else if (explorer.indexOf("firefox") > -1) {
    browser = "firefox";
  } else if (explorer.indexOf("safari") > -1) {
    browser = "safari";
  } else if (explorer.indexOf("opera") > -1) {
    browser = "opera";
  }
  return browser;
}

3. 获取富文本内容中的图片

/**
 * 获取富文本内容中的图片
 */
export const getImgList = (richText: string): string[] => {
  // 如果富文本内容为空,则没有图片
  if (!richText) {
    return [];
  }
  const regex = /<img/g;
  const imgTags: string[] = richText.match(regex)!;
  let imgLen = 0;
  if (imgTags === null) {
    return [];
  } else {
    imgLen = imgTags.length;
  }
  // 没有找到图片
  if (imgLen === 0) {
    return [];
  }
  const imgElementList: string[] = [];
  const imgSrcList: string[] = [];
  richText.replace(/<img [^>]*src=['"]([^'"]+)[^>]*>/g, (match: string, capture: string): string => {
    imgSrcList.push(capture);
    imgElementList.push(match);
    return capture;
  });
  console.log('imgElementList', imgElementList); // 图片标签列表
  console.log('imgSrcList', imgSrcList); // 图片 src 属性值列表
  return imgSrcList;
};

4. 数字隐射字母

// 数字映射字母,如:{1 => "A"}、{2 => "B"}
const relationArr: Array<Array<string | number>> = [];
for (let i = 0; i < 26; i++) {
  const symbol: string = String.fromCharCode(65 + i);
  relationArr.push([i + 1, `${symbol}`]);
}
const indexSymbolRelationMap = new Map();
relationArr.forEach(([key, value]) => indexSymbolRelationMap.set(key, value));
// 使用
indexSymbolRelationMap.get(index + 1);  // index = 1, => A