8个常用的辅助函数！！

在开发各种项目时，我们会发现经常需要一些辅助函数来帮助我们实现一些需求，并且这些函数是在很多项目里都可以进行复用的。下面我就列出我们一些常用的辅助函数，来帮助大家在开发项目时，进行复用。

1. 首字母大写

将字符串的第一个字母大写，其余部分转换为小写。

JavaScript 复制代码

// 该函数接受一个可选的字符串参数 word
export const capitalizeFirstLetter = (word?: string) => {
  // 如果传入了字符串 word，则将其第一个字符转换为大写，并将其余字符转换为小写
  return word ? word.charAt(0).toUpperCase() + word.toLocaleLowerCase().slice(1) : '';
  // 如果未传入字符串，则返回空字符串
};

使用示例:

JavaScript 复制代码

const formattedName = capitalizeFirstLetter('johN dOE');
// 将 'johN dOE' 转换为 'John doe'
console.log(formattedName); // 输出：John doe

2. 格式化日期

此函数使用 moment 库来格式化日期，使用前需要我们安装moment库。它可以根据 isTime 标志将日期格式化为 DD/MM/YYYY 或 HH A，可以根据我们的需求输出不同的时间格式。

npm install moment

JavaScript 复制代码

// 导入 moment 库
import moment from 'moment';

// 该函数接受一个日期字符串 date 和一个布尔值 isTime
export const formatDate = (date: string, isTime = false) => {
  // 如果未传入日期字符串，则返回空字符串
  if (!date) return '';

  // 使用 moment 解析日期字符串
  const parsedDate = moment(date);

  // 如果 isTime 为 true，则格式化为 HH:mm A，否则格式化为 DD/MM/YYYY
  if (isTime) return parsedDate.format('HH:mm A');

  return parsedDate.format('DD/MM/YYYY');
};

使用示例:

JavaScript 复制代码

const dateString = '2024-06-10T18:30:00';
const formattedDate = formatDate(dateString);
// 将日期 '2024-06-10T18:30:00' 格式化为 '10/06/2024'
console.log(formattedDate); // 输出：10/06/2024

const formattedTime = formatDate(dateString, true);
// 将日期 '2024-06-10T18:30:00' 格式化为 '06:30 PM'
console.log(formattedTime); // 输出：06:30 PM

3. 缩略文段

但我们遇到需要将文字段落进行缩短，缩短到指定的长度并附加省略号 (...)时，就可以使用下面这个函数。

// 该函数接受一个字符串 text 和一个数字 maxLength
export const truncateText = (text: string, maxLength: number) => {
  // 如果字符串长度小于或等于最大长度，则返回原字符串
  if (text.length <= maxLength) return text;

  // 否则截取字符串的前 maxLength 个字符，并添加省略号
  return text.substring(0, maxLength) + '...';
};

使用示例:

JavaScript 复制代码

const longText = 'This is a long text that needs to be truncated.';
const truncatedText = truncateText(longText, 10);
// 将文本 'This is a long text that needs to be truncated.' 截断为 'This is a...'
console.log(truncatedText); // 输出：This is a...

4. 检查字符串是否包含字符类型

但当我们遇到需要检查字符串是否包含至少一个大写字母、一个小写字母、一个数字或一个特殊字符的需求时就可以使用下面这个函数。在校验密码最常见也最多用。

JavaScript 复制代码

// 该函数接受一个字符串 val
export const containsAtleastOneUpperCase = (val: string) => /(?=.*?[A-Z])/.test(val);
// 使用正则表达式检查字符串是否包含至少一个大写字母

// 定义一个函数 containsAtleastOneLowerCase，该函数接受一个字符串 val
export const containsAtleastOneLowerCase = (val: string) => val ? /(?=.*?[a-z])/.test(val) : false;
// 使用正则表达式检查字符串是否包含至少一个小写字母

// 定义一个函数 containsAtleastOneNumber，该函数接受一个字符串 val
export const containsAtleastOneNumber = (val: string) => /(?=.*[0-9])/.test(val);
// 使用正则表达式检查字符串是否包含至少一个数字

// 定义一个函数 containsAtLeastOneSpecialChar，该函数接受一个字符串 val
export const containsAtLeastOneSpecialChar = (val: string) => /(?=.*[$&+,:;=?@#|'<>.^*_()%!-])/.test(val);
// 使用正则表达式检查字符串是否包含至少一个特殊字符

使用示例:

JavaScript 复制代码

const password = 'Pa$$w0rd!';
const hasUpperCase = containsAtleastOneUpperCase(password);
const hasLowerCase = containsAtleastOneLowerCase(password);
const hasNumber = containsAtleastOneNumber(password);
const hasSpecialChar = containsAtLeastOneSpecialChar(password);

console.log(`Has upper case: ${hasUpperCase}`); // 输出：true
console.log(`Has lower case: ${hasLowerCase}`); // 输出：true
console.log(`Has number: ${hasNumber}`); // 输出：true
console.log(`Has special char: ${hasSpecialChar}`); // 输出：true

5. 检查数字奇偶性

当我们需要对数据中的奇数组和偶数组进行区分处理的时候就可以使用这个函数了。

JavaScript 复制代码

// 定义一个函数 isEven，该函数接受一个数字 number
export const isEven = (number: number) => (number % 2 === 0);
// 返回该数字是否为偶数

6. 检查非空对象

当我们需要检查对象是否非空时，我们就可以使用下面这个函数了。这在帮助我们避免对空数据进行操作是非常有用的一个辅助函数。

JavaScript 复制代码

// 该函数接受一个对象 obj
export const isNonEmptyObject = (obj: Record<string, unknown>) => {
  // 检查对象是否为非空对象，且键的数量大于0
  return typeof obj === 'object' && obj !== null && Object.keys(obj).length > 0;
};

使用示例:

JavaScript 复制代码

const emptyObject = {};
const nonEmptyObject = { name: 'John Doe', age: 30 };

const isEmpty = isNonEmptyObject(emptyObject);
const isNotEmpty = isNonEmptyObject(nonEmptyObject);

console.log(`Empty object: ${isEmpty}`); // 输出：false
console.log(`Non-empty object: ${isNotEmpty}`); // 输出：true

7. 生成随机数字

当我们需要随机生成一个包含随机大小写字母和数字的字符串时，就可以使用下面的这个函数了。

JavaScript 复制代码

// 该函数接受一个可选的长度参数 length，默认为10
export const generateRandomId = (length = 10) => {
  // 定义一个包含所有可能字符的字符串
  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
  // 初始化一个空字符串 id
  let id = '';

  // 循环 length 次，从 chars 中随机选择一个字符并添加到 id 中
  for (let i = 0; i < length; i++) {
    id += chars.charAt(Math.floor(Math.random() * chars.length));
  }

  // 返回生成的 id
  return id;
};

使用示例:

JavaScript 复制代码

const randomId1 = generateRandomId();
const randomId2 = generateRandomId();

console.log(`Random ID 1: ${randomId1}`); // 输出：类似于 '4jH5y2d1kX'
console.log(`Random ID 2: ${randomId2}`); // 输出：类似于 'qW3E2v1z7B'

8. 深拷贝

当我们需要创建对象的深拷贝时，下面这个函数就很有用了。它可以帮助我们避免意外的去修改原始对象数据。减少bug的出现

JavaScript 复制代码

// 定义一个泛型函数 deepCloneObject，用于深度克隆对象
export const deepCloneObject = <T extends Record<string, any>>(obj: T): T => {
  // 如果 obj 为空或不是对象，则直接返回 obj
  if (!obj || typeof obj !== 'object') return obj;

  // 创建一个新对象，用于存储克隆的值
  const copy: Record<string, any> = {};

  // 遍历 obj 中的每一个键
  for (const key in obj) {
    // 如果 obj[key] 是对象，则递归调用 deepCloneObject 进行深度克隆
    // 否则，直接复制 obj[key] 的值
    copy[key] = typeof obj[key] === 'object' ? deepCloneObject(obj[key]) : obj[key];
  }

  // 将 copy 转换为 T 类型并返回
  return copy as T;
};

使用示例:

JavaScript 复制代码

const originalObject = {
  name: 'John Doe',
  age: 30,
  address: {
    city: 'San Francisco',
    country: 'USA'
  }
};

const clonedObject = deepCloneObject(originalObject);

console.log(`Original object: ${JSON.stringify(originalObject)}`);
console.log(`Cloned object: ${JSON.stringify(clonedObject)}`);

// 修改克隆对象
clonedObject.age = 35;
clonedObject.address.city = 'New York';

console.log(`Modified cloned object: ${JSON.stringify(clonedObject)}`);

// 原始对象保持不变
console.log(`Original object after modification: ${JSON.stringify(originalObject)}`);