网站怎么做认证,深圳网建公司,学什么技术挣两三万,如何做网站家具导购在开发各种项目时#xff0c;我们会发现经常需要一些辅助函数来帮助我们实现一些需求#xff0c;并且这些函数是在很多项目里都可以进行复用的。下面我就列出我们一些常用的辅助函数#xff0c;来帮助大家在开发项目时#xff0c;进行复用。
1. 首字母大写
将字符串的第一…在开发各种项目时我们会发现经常需要一些辅助函数来帮助我们实现一些需求并且这些函数是在很多项目里都可以进行复用的。下面我就列出我们一些常用的辅助函数来帮助大家在开发项目时进行复用。
1. 首字母大写
将字符串的第一个字母大写其余部分转换为小写。
// 该函数接受一个可选的字符串参数 word
export const capitalizeFirstLetter (word?: string) {// 如果传入了字符串 word则将其第一个字符转换为大写并将其余字符转换为小写return word ? word.charAt(0).toUpperCase() word.toLocaleLowerCase().slice(1) : ;// 如果未传入字符串则返回空字符串
};
使用示例:
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// 导入 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/YYYYif (isTime) return parsedDate.format(HH:mm A);return parsedDate.format(DD/MM/YYYY);
};
使用示例:
const dateString 2024-06-10T18:30:00;
const formattedDate formatDate(dateString);
// 将日期 2024-06-10T18:30:00 格式化为 10/06/2024
console.log(formattedDate); // 输出10/06/2024const 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) ...;
};
使用示例:
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. 检查字符串是否包含字符类型
但当我们遇到需要检查字符串是否包含至少一个大写字母、一个小写字母、一个数字或一个特殊字符的需求时就可以使用下面这个函数。在校验密码最常见也最多用。
// 该函数接受一个字符串 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);
// 使用正则表达式检查字符串是否包含至少一个特殊字符使用示例:
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. 检查数字奇偶性
当我们需要对数据中的奇数组和偶数组进行区分处理的时候就可以使用这个函数了。
// 定义一个函数 isEven该函数接受一个数字 number
export const isEven (number: number) (number % 2 0);
// 返回该数字是否为偶数
6. 检查非空对象
当我们需要检查对象是否非空时我们就可以使用下面这个函数了。这在帮助我们避免对空数据进行操作是非常有用的一个辅助函数。
// 该函数接受一个对象 obj
export const isNonEmptyObject (obj: Recordstring, unknown) {// 检查对象是否为非空对象且键的数量大于0return typeof obj object obj ! null Object.keys(obj).length 0;
};
使用示例:
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. 生成随机数字
当我们需要随机生成一个包含随机大小写字母和数字的字符串时就可以使用下面的这个函数了。
// 该函数接受一个可选的长度参数 length默认为10
export const generateRandomId (length 10) {// 定义一个包含所有可能字符的字符串const chars ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789;// 初始化一个空字符串 idlet id ;// 循环 length 次从 chars 中随机选择一个字符并添加到 id 中for (let i 0; i length; i) {id chars.charAt(Math.floor(Math.random() * chars.length));}// 返回生成的 idreturn id;
};
使用示例:
const randomId1 generateRandomId();
const randomId2 generateRandomId();console.log(Random ID 1: ${randomId1}); // 输出类似于 4jH5y2d1kX
console.log(Random ID 2: ${randomId2}); // 输出类似于 qW3E2v1z7B8. 深拷贝
当我们需要创建对象的深拷贝时下面这个函数就很有用了。它可以帮助我们避免意外的去修改原始对象数据。减少bug的出现
// 定义一个泛型函数 deepCloneObject用于深度克隆对象
export const deepCloneObject T extends Recordstring, any(obj: T): T {// 如果 obj 为空或不是对象则直接返回 objif (!obj || typeof obj ! object) return obj;// 创建一个新对象用于存储克隆的值const copy: Recordstring, 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;
};使用示例:
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)});
