当前位置:实例文章 » HTML/CSS实例» [文章]常用js工具函数集合

常用js工具函数集合

发布人:shili8 发布时间:2024-12-27 06:57 阅读次数:0

**常用JS工具函数集合**

### 一、数组相关工具函数####1. 数组扁平化

javascript/**
 * 数组扁平化 * @param {Array} arr 需要扁平化的数组 * @returns {Array} 扁平化后的数组 */
function flat(arr) {
 return arr.reduce((acc, cur) => acc.concat(cur), []);
}

// 示例使用const arr = [1,2, [3,4],5];
console.log(flat(arr)); // [1,2,3,4,5]


####2. 数组去重
javascript/**
 * 数组去重 * @param {Array} arr 需要去重的数组 * @returns {Array} 去重后的数组 */
function unique(arr) {
 return [...new Set(arr)];
}

// 示例使用const arr = [1,2,3,4,5,2,3];
console.log(unique(arr)); // [1,2,3,4,5]


####3. 数组求和
javascript/**
 * 数组求和 * @param {Array} arr 需要求和的数组 * @returns {Number} 求和后的结果 */
function sum(arr) {
 return arr.reduce((acc, cur) => acc + cur,0);
}

// 示例使用const arr = [1,2,3,4,5];
console.log(sum(arr)); //15


####4. 数组求平均值
javascript/**
 * 数组求平均值 * @param {Array} arr 需要求平均值的数组 * @returns {Number} 求平均值后的结果 */
function avg(arr) {
 return sum(arr) / arr.length;
}

// 示例使用const arr = [1,2,3,4,5];
console.log(avg(arr)); //3


### 二、对象相关工具函数####1. 对象深拷贝
javascript/**
 * 对象深拷贝 * @param {Object} obj 需要深拷贝的对象 * @returns {Object} 深拷贝后的对象 */
function deepClone(obj) {
 return JSON.parse(JSON.stringify(obj));
}

// 示例使用const obj = { a:1, b: { c:2 } };
console.log(deepClone(obj)); // { a:1, b: { c:2 } }


####2. 对象合并
javascript/**
 * 对象合并 * @param {Object} target 需要合并的目标对象 * @param {Object} source 需要合并的源对象 * @returns {Object} 合并后的对象 */
function merge(target, source) {
 return { ...target, ...source };
}

// 示例使用const target = { a:1, b:2 };
const source = { c:3, d:4 };
console.log(merge(target, source)); // { a:1, b:2, c:3, d:4 }


####3. 对象删除属性
javascript/**
 * 对象删除属性 * @param {Object} obj 需要删除属性的对象 * @param {String} key 需要删除的属性键 * @returns {Object} 删除属性后的对象 */
function deleteProperty(obj, key) {
 return { ...obj, [key]: undefined };
}

// 示例使用const obj = { a:1, b:2, c:3 };
console.log(deleteProperty(obj, 'b')); // { a:1, c:3 }


### 三、字符串相关工具函数####1. 字符串首字母大写
javascript/**
 * 字符串首字母大写 * @param {String} str 需要首字母大写的字符串 * @returns {String} 首字母大写后的字符串 */
function capitalize(str) {
 return str.charAt(0).toUpperCase() + str.slice(1);
}

// 示例使用const str = 'hello';
console.log(capitalize(str)); // Hello


####2. 字符串首字母小写
javascript/**
 * 字符串首字母小写 * @param {String} str 需要首字母小写的字符串 * @returns {String} 首字母小写后的字符串 */
function lowerCase(str) {
 return str.charAt(0).toLowerCase() + str.slice(1);
}

// 示例使用const str = 'Hello';
console.log(lowerCase(str)); // hello


####3. 字符串去空格
javascript/**
 * 字符串去空格 * @param {String} str 需要去空格的字符串 * @returns {String} 去空格后的字符串 */
function trim(str) {
 return str.replace(/s+/g, '');
}

// 示例使用const str = 'hello world';
console.log(trim(str)); // helloworld


### 四、日期相关工具函数####1. 日期格式化
javascript/**
 * 日期格式化 * @param {Date} date 需要格式化的日期 * @returns {String} 格式化后的日期字符串 */
function formatDate(date) {
 return `${date.getFullYear()}-${padZero(date.getMonth() +1)}-${padZero(date.getDate())} ${padZero(date.getHours())}:${padZero(date.getMinutes())}`;
}

// 示例使用const date = new Date();
console.log(formatDate(date)); // 年-月-日 时:分


####2. 日期加天数
javascript/**
 * 日期加天数 * @param {Date} date 需要加天数的日期 * @param {Number} days 需要加的天数 * @returns {Date} 加天数后的日期 */
function addDays(date, days) {
 const newDate = new Date(date.getTime() + days *24 *60 *60 *1000);
 return newDate;
}

// 示例使用const date = new Date();
console.log(addDays(date,3)); // 加3天后的日期


### 五、其他工具函数####1. 数组随机排序
javascript/**
 * 数组随机排序 * @param {Array} arr 需要随机排序的数组 * @returns {Array} 随机排序后的数组 */
function shuffle(arr) {
 for (let i = arr.length -1; i >0; i--) {
 const j = Math.floor(Math.random() * (i +1));
 [arr[i], arr[j]] = [arr[j], arr[i]];
 }
 return arr;
}

// 示例使用const arr = [1,2,3,4,5];
console.log(shuffle(arr)); // 随机排序后的数组


####2. 对象属性随机排序
javascript/**
 * 对象属性随机排序 * @param {Object} obj 需要随机排序的对象 * @returns {Object} 随机排序后的对象 */
function shuffleProperties(obj) {
 const keys = Object.keys(obj);
 for (let i = keys.length -1; i >0; i--) {
 const j = Math.floor(Math.random() * (i +1));
 [keys[i], keys[j]] = [keys[j], keys[i]];
 }
 return keys.reduce((acc, key) => ({ ...acc, [key]: obj[key] }), {});
}

// 示例使用const obj = { a:1, b:2, c:3 };
console.log(shuffleProperties(obj)); // 随机排序后的对象


####3. padZero
javascript/**
 * padZero * @param {Number} num 需要补零的数字 * @returns {String} 补零后的字符串 */
function padZero(num) {
 return (num < 10 ? '0' : '') + num;
}

// 示例使用console.log(padZero(5)); //05


以上是常用JS工具函数集合,包括数组相关、对象相关、字符串相关、日期相关和其他工具函数。这些函数可以帮助你快速解决一些常见的问题,如数组扁平化、对象合并、日期格式化等。

其他信息

其他资源

Top