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 技能并学习编写高效、优雅代码的新方法。

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

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

相关内容

热门资讯

如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
施耐德电气数据中心整体解决方案... 近日,全球能效管理专家施耐德电气正式启动大型体验活动“能效中国行——2012卡车巡展”,作为该活动的...
20个非常棒的扁平设计免费资源 Apple设备的平面图标PSD免费平板UI 平板UI套件24平图标Freen平板UI套件PSD径向平...
德国电信门户网站可实时显示全球... 德国电信周三推出一个门户网站,直观地实时提供其安装在全球各地的传感器网络检测到的网络攻击状况。该网站...
为啥国人偏爱 Mybatis,... 关于 SQL 和 ORM 的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行...
《非诚勿扰》红人闫凤娇被曝厕所... 【51CTO.com 综合消息360安全专家提醒说,“闫凤娇”、“非诚勿扰”已经被黑客盯上成为了“木...
2012年第四季度互联网状况报... [[71653]]  北京时间4月25日消息,据国外媒体报道,全球知名的云平台公司Akamai Te...