前端25个单行代码助力工作高效

JavaScript 是一种灵活的语言，通过简洁的单行代码可以高效解决很多开发中的问题。无论是数组操作、对象处理，还是字符串处理，简化常见的任务，不仅提高了代码的可读性，还减少了错误的发生。

1. 检查数组是否为空

const isEmptyArray = arr => Array.isArray(arr) && arr.length === 0;

这个单行代码用来判断一个数组是否为空。

2. 交换两个变量

[a, b] = [b, a];

通过解构赋值快速交换两个变量的值。

3. 移除数组中的重复元素

const uniqueArray = arr => [...new Set(arr)];

使用 Set 来去除数组中的重复元素。

4. 快速深拷贝对象

const deepClone = obj => JSON.parse(JSON.stringify(obj));

通过序列化和反序列化对象来实现深拷贝。

5. 截取数组的最后几个元素

const lastElements = (arr, n) => arr.slice(-n);

从数组中提取最后的 n 个元素。

6. 字符串反转

const reverseString = str => str.split('').reverse().join('');

将字符串分割成数组后反转并重新拼接。

7. 检查字符串是否为回文

const isPalindrome = str => str === str.split('').reverse().join('');

判断一个字符串是否是回文。

8. 获取 URL 查询参数

const getParams = url => Object.fromEntries(new URL(url).searchParams.entries());

将 URL 查询参数解析成对象。

9. 随机生成颜色

const randomColor = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, '0')}`;

生成一个随机的十六进制颜色值。

10. 生成随机整数

const randomInt = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;

在指定范围内生成随机整数。

11. 将字符串转换为驼峰命名法

const toCamelCase = str => str.replace(/([-_][a-z])/g, group => group.toUpperCase().replace

将带有连字符或下划线的字符串转换为驼峰命名法。

12. 检测对象是否为空

const isEmptyObject = obj => Object.keys(obj).length === 0;

通过判断对象的键数量来检测对象是否为空。

13. 扁平化数组

const flattenArray = arr => arr.reduce((acc, val) => acc.concat(Array.isArray(val) ? flattenAr

递归将多维数组扁平化为一维。

14. 去除字符串中的所有空格

const removeSpaces = str => str.replace(/\s+/g, '');

删除字符串中的所有空格。

15. 获取数组的平均值

const average = arr => arr.reduce((a, b) => a + b, 0) / arr.length;

计算数组中所有数值的平均值。

16. 将对象按键排序

const sortObjectByKeys = obj => Object.keys(obj).sort().reduce((result, key) => (result[key] 

根据键值对的键对对象进行排序。

17. 生成 UUID

const uuid = () => 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, c => (c === 'x' ? (Math.r

生成符合 RFC 4122 标准的 UUID。

18. 合并多个对象

const mergeObjects = (...objs) => objs.reduce((acc, obj) => ({ ...acc, ...obj }), {});

通过扩展运算符合并多个对象。

19. 将数组中的值转换为键值对

const arrayToObject = arr => Object.fromEntries(arr.map((key, index) => [key, index]));

将数组转换为对象，数组中的元素作为对象的键。

20. 获取两个数组的交集

const arrayIntersection = (arr1, arr2) => arr1.filter(item => arr2.includes(item));

计算两个数组的交集。

21. 检查对象是否有某个属性

const hasKey = (obj, key) => key in obj;

检查对象中是否存在某个键。

22. 获取当前时间的时间戳

constgetCurrentTimestamp = () => Date.now();

获取当前的 UNIX 时间戳。

23. 格式化日期

const formatDate = date => date.toISOString().split('T')[0];

24. 统计数组中每个元素的出现次数

const countOccurrences = arr => arr.reduce((acc, val) => (acc[val] = (acc[val] || 0) + 1, acc), {}

统计数组中每个元素的出现次数。

25. 将数字限制在指定范围内

const clamp = (num, min, max) => Math.min(Math.max(num, min), max);

将数字限制在指定范围内。

结语

以上 25 个 JavaScript 单行代码片段能够帮助你在日常开发中快速解决一些常见问题。掌握这些简洁而高效的代码技巧，不仅能提升代码的可读性，还能让你的代码更具表现力和效率。通过不断地积累与优化，你将能够更好地应对复杂的前端开发挑战。