前端开发项目必备代码片段（一）

utils/
--index.js

作为一名前端开发人员，在日常开发过程中积累了很多有用的代码片段。这些代码片段可以帮助我们提高开发效率，减少重复性工作。因此，我决定将其整理成一个系列文章，与大家分享。

在本系列文章中，我将介绍一些常用的工具函数。这些函数可以帮助我们处理各种常见的问题，如字符串操作、数组操作、日期操作等。希望这些函数能对大家的开发工作有所帮助。

字符串操作

/**
 * 去除字符串两端的空格
 * @param {string} str 要处理的字符串
 * @returns {string} 去除空格后的字符串
 */
const trim = (str) => {
  return str.replace(/^\s+|\s+$/g, "");
};

/**
 * 将字符串中的所有空格替换为指定字符
 * @param {string} str 要处理的字符串
 * @param {string} char 要替换成的字符
 * @returns {string} 替换空格后的字符串
 */
const replaceAllSpaces = (str, char) => {
  return str.replace(/\s/g, char);
};

/**
 * 将字符串中的所有指定字符替换为另一个字符
 * @param {string} str 要处理的字符串
 * @param {string} from 要替换的字符
 * @param {string} to 替换成的字符
 * @returns {string} 替换字符后的字符串
 */
const replaceAll = (str, from, to) => {
  return str.replace(new RegExp(from, "g"), to);
};

/**
 * 将字符串中的所有字母转换为小写
 * @param {string} str 要处理的字符串
 * @returns {string} 小写后的字符串
 */
const toLowerCase = (str) => {
  return str.toLowerCase();
};

/**
 * 将字符串中的所有字母转换为大写
 * @param {string} str 要处理的字符串
 * @returns {string} 大写后的字符串
 */
const toUpperCase = (str) => {
  return str.toUpperCase();
};

数组操作

/**
 * 从数组中删除指定元素
 * @param {array} arr 要处理的数组
 * @param {*} item 要删除的元素
 * @returns {array} 删除元素后的数组
 */
const remove = (arr, item) => {
  return arr.filter((x) => x !== item);
};

/**
 * 从数组中删除所有重复元素
 * @param {array} arr 要处理的数组
 * @returns {array} 删除重复元素后的数组
 */
const unique = (arr) => {
  return [...new Set(arr)];
};

/**
 * 将两个数组合并成一个数组
 * @param {array} arr1 第一个数组
 * @param {array} arr2 第二个数组
 * @returns {array} 合并后的数组
 */
const concat = (arr1, arr2) => {
  return arr1.concat(arr2);
};

/**
 * 将数组中的每个元素都乘以一个指定数字
 * @param {array} arr 要处理的数组
 * @param {number} num 要乘以的数字
 * @returns {array} 乘法后的数组
 */
const multiply = (arr, num) => {
  return arr.map((x) => x * num);
};

/**
 * 将数组中的每个元素都除以一个指定数字
 * @param {array} arr 要处理的数组
 * @param {number} num 要除以的数字
 * @returns {array} 除法后的数组
 */
const divide = (arr, num) => {
  return arr.map((x) => x / num);
};

日期操作

/**
 * 获取当前日期
 * @returns {Date} 当前日期
 */
const now = () => {
  return new Date();
};

/**
 * 获取当前时间戳
 * @returns {number} 当前时间戳
 */
const timestamp = () => {
  return Date.now();
};

/**
 * 将日期格式化为字符串
 * @param {Date} date 要格式化的日期
 * @param {string} format 格式化字符串
 * @returns {string} 格式化后的字符串
 */
const formatDate = (date, format) => {
  const map = {
    yyyy: date.getFullYear(),
    MM: date.getMonth() + 1,
    dd: date.getDate(),
    HH: date.getHours(),
    mm: date.getMinutes(),
    ss: date.getSeconds(),
  };

  return format.replace(/yyyy|MM|dd|HH|mm|ss/g, (match) => map[match]);
};

/**
 * 将字符串解析为日期
 * @param {string} str 要解析的字符串
 * @returns {Date} 解析后的日期
 */
const parseDate = (str) => {
  return new Date(str);
};

/**
 * 将日期增加指定天数
 * @param {Date} date 要增加天数的日期
 * @param {number} days 要增加的天数
 * @returns {Date} 增加天数后的日期
 */
const addDays = (date, days) => {
  date.setDate(date.getDate() + days);
  return date;
};

/**
 * 将日期减少指定天数
 * @param {Date} date 要减少天数的日期
 * @param {number} days 要减少的天数
 * @returns {Date} 减少天数后的日期
 */
const subtractDays = (date, days) => {
  date.setDate(date.getDate() - days);
  return date;
};