21 个简洁的 JavaScript单行代码示例技巧
创始人
2025-06-29 21:50:19
0

JavaScript 是一种多功能且功能强大的编程语言,广泛用于前端和后端开发。

作为一名 JavaScript 开发人员,不断提高您的技能并了解该语言的最新进展非常重要。

实现这一目标的一种方法是探索简洁的一行代码示例,这些示例展示了 JavaScript 的优雅和高效。

因此,在今天这篇文章中,我们将深入研究 21 个JavaScript单行代码技巧,它们将增强您的 JavaScript 技能并帮助您编写更简洁、更有效的代码。

1. 检查变量是否是数组:

const isArray = variable => Array.isArray(variable);

Array.isArray() 方法检查给定变量是否是数组。

2. 获取数组中的最后一项:

const lastItem = array => array.slice(-1)[0];

通过使用负数组索引和 slice() 方法,我们可以轻松检索数组中的最后一项。

3. 生成一个范围内的随机数:

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

使用 Math.random()、Math.floor() 和一点算术,我们可以生成指定范围内的随机数。

4. 合并两个数组:

const mergedArray = (array1, array2) => [...array1, ...array2];

扩展运算符 (...) 允许我们将两个数组合并为一个数组。

5. 从数组中删除重复项:

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

通过使用 Set 对象和展开运算符,我们可以轻松地消除数组中的重复值。

6. 将字符串的第一个字母大写:

const capitalize = string => string.charAt(0).toUpperCase() + string.slice(1);

这个简洁的代码片段将给定字符串的第一个字母大写。

7. 检查字符串是否包含子字符串:

const containsSubstring = (string, substring) => string.includes(substring);

使用includes()方法,我们可以快速判断一个字符串是否包含特定的子字符串。

8. 查找数组中的最大数字:

const maxNumber = array => Math.max(...array);

使用扩展运算符和 Math.max() 方法,我们可以轻松找到数组中的最大数字。

9. 计算数字数组的总和:

const sumArray = array => array.reduce((total, num) => total + num, 0);

reduce() 方法允许我们通过迭代地将每个元素添加到运行总计中来计算数组的总和。

10. 反转字符串:

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

此单行代码使用 split()、reverse() 和 join() 方法来反转给定的字符串。

11. 打乱数组:

const shuffleArray = array => array.sort(() => Math.random() - 0.5);

通过提供生成随机值的自定义排序函数,我们可以对数组的元素进行打乱。

12. 从数组中删除假值:

const truthyValues = array => array.filter(Boolean);

filter() 方法与布尔构造函数一起允许我们从数组中删除假值(例如 null、undefined 和 false)。

13. 截断字符串并在超过指定长度时添加省略号:

const truncateString = (string, maxLength) => string.length > maxLength ? string.slice(0, maxLength) + '...' : string;

此单行将字符串截断为指定长度,并在超过该长度时附加省略号。

14. 查找数组中元素第一次出现的索引:

const indexOfElement = (array, element) => array.indexOf(element);

indexOf() 方法返回数组中给定元素第一次出现的索引。

15. 检查字符串是否为回文:

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

这个简洁的代码片段通过将字符串与其反转版本进行比较来检查字符串是否为回文。

16. 将字符串转换为字符数组:

const stringToArray = string => Array.from(string);

Array.from() 方法将可迭代对象(例如字符串)转换为数组。

17. 生成指定范围内的数字数组:

const rangeArray = (start, end) => Array.from({length: end - start + 1}, (_, i) => start + i);

使用 Array.from() 方法和箭头函数,我们可以生成给定范围内的数字数组。

18. 删除字符串开头和结尾的空格:

const trimString = string => string.trim();

Trim() 方法删除字符串两端的空格。

19. 求一组数字的平均值:

const average = array => array.reduce((total, num) => total + num, 0) / array.length;

通过将数组的总和除以它的长度,我们可以计算出数字的平均值。

20. 检查数字是否为偶数:

const isEven = number => number % 2 === 0;

这个简洁的代码片段通过验证数字除以 2 的余数是否为零来检查数字是否为偶数。

21. 从键值对数组创建对象:

const objectFromPairs = pairs => Object.fromEntries(pairs);

Object.fromEntries() 方法从键值对数组创建一个对象。

通过探索这些简洁的一行代码示例,您可以提高 JavaScript 技能并学习编写高效、优雅代码的新方法。

尝试将这些片段合并到您的项目中以增强您的开发工作流程。

请记住始终努力提高代码的可读性和可维护性,平衡简洁性和清晰度。 

相关内容

热门资讯

PHP新手之PHP入门 PHP是一种易于学习和使用的服务器端脚本语言。只需要很少的编程知识你就能使用PHP建立一个真正交互的...
网络中立的未来 网络中立性是什... 《牛津词典》中对“网络中立”的解释是“电信运营商应秉持的一种原则,即不考虑来源地提供所有内容和应用的...
各种千兆交换机的数据接口类型详... 千兆交换机有很多值得学习的地方,这里我们主要介绍各种千兆交换机的数据接口类型,作为局域网的主要连接设...
粉嫩如何诠释霸道 东芝M805... “霸道粉”是个什么玩意东芝M805拿过来的时候,笔者扑哧笑了,不是笑这款笔记本,而是笑这款产品的颜色...
什么是大数据安全 什么是大数据... 在《为什么需要大数据安全分析》一文中,我们已经阐述了一个重要观点,即:安全要素信息呈现出大数据的特征...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
全面诠释网络负载均衡 负载均衡的出现大大缓解了服务器的压力,更是有效的利用了资源,提高了效率。那么我们现在来说一下网络负载...
如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
30分钟搞定iOS自定义相机 最近公司的项目中用到了相机,由于不用系统的相机,UI给的相机切图,必须自定义才可以。就花时间简单研究...
Intel将Moblin社区控... 本周二,非营利机构Linux基金会宣布,他们将担负起Moblin社区的管理工作,而这之前,Mobli...