当前位置:首页 > 科技  > 软件

30 个 JavaScript 单行代码,让你成为 JavaScript 奇才

来源: 责编: 时间:2023-10-10 18:28:40 386观看
导读今天这篇文章,我想跟大家分享一些强大的 JavaScript 单行代码,因为使用这些单行代码可以帮助你提升工作效率,在这篇文章中,我总结了30个实用的代码技巧,希望这些代码技巧对你有用。那么,我们现在就开始吧。1. 反转字符串con

今天这篇文章,我想跟大家分享一些强大的 JavaScript 单行代码,因为使用这些单行代码可以帮助你提升工作效率,在这篇文章中,我总结了30个实用的代码技巧,希望这些代码技巧对你有用。wZ828资讯网——每日最新资讯28at.com

wZ828资讯网——每日最新资讯28at.com

那么,我们现在就开始吧。wZ828资讯网——每日最新资讯28at.com

1. 反转字符串

const reversedString = str => str.split('').reverse().join('');reversedString("Hello World"); // dlroW olleH

2.标题大小写为字符串

const titleCase = sentence => sentence.replace(//b/w/g, char => char.toUpperCase());titleCase("hello world"); // Hello World

3. 在变量之间交换值

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

4. 将数字转换为布尔值

const isTruthy = num => !!num;isTruthy(0) // False

5. 从数组中获取唯一值

const uniqueArray = arr => [...new Set(arr)];uniqueArray([5,5,2,2,2,4,2]) // [ 5, 2, 4 ]

6. 截断字符串

const truncateString = (str, maxLength) => (str.length > maxLength) ? `${str.slice(0, maxLength)}...` : str;truncateString("Hello World", 8); // Hello Wo...

7. 深度克隆对象

const deepClone = obj => JSON.parse(JSON.stringify(obj));const obj1 = { name: "John", age: 40};const obj2 = deepClone(obj1);obj2.age = 20;console.log(obj1.age); // 40//This method works for most objects, but it has some limitations. Objects with circular references or functions cannot be converted to JSON, so this method will not work for those types of objects.

8. 查找数组中最后一次出现的位置

const lastIndexOf = (arr, item) => arr.lastIndexOf(item);lastIndexOf([5, 5, 4 , 2 , 3 , 4], 5) // 1

9. 合并数组

const mergeArrays = (...arrays) => [].concat(...arrays);mergeArrays([5, 5, 4], [2 , 3 , 4]) // [5, 5, 4, 2, 3, 4]

10.找到句子中最长的单词

const longestWord = sentence => sentence.split(' ').reduce((longest, word) => word.length > longest.length ? word : longest, '');longestWord("The quick brown fox jumped over the lazy dog") // jumped

11. 生成一个数字范围

const range = (start, end) => [...Array(end - start + 1)].map((_, i) => i + start);range(5, 15); // [5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15]

12. 检查对象是否为空

const isEmptyObject = obj => Object.keys(obj).length === 0;isEmptyObject({}) // trueisEmptyObject({ name: 'John' }) // false

13. 计算数字的平均值

const average = arr => arr.reduce((acc, num) => acc + num, 0) / arr.length;average([1, 2, 3, 4, 5, 6, 7, 8, 9]) // 5

14. 将对象转换为查询参数

const objectToQueryParams = obj => Object.entries(obj).map(([key, val]) => `${encodeURIComponent(key)}=${encodeURIComponent(val)}`).join('&');objectToQueryParams({ page: 2, limit: 10 }) // page=2&limit=10

15. 计算数字的阶乘

const factorial = num => num <= 1 ? 1 : num * factorial(num - 1);factorial(4) // 24

16. 计算字符串中的元音数

const countVowels = str => (str.match(/[aeiou]/gi) || []).length;countVowels('The quick brown fox jumps over the lazy dog') // 11

17. 检查有效的电子邮件

const isValidEmail = email => /^[/w-]+(/.[/w-]+)*@([/w-]+/.)+[a-zA-Z]{2,7}$/.test(email);isValidEmail("example@email.com") // trueisValidEmail("example") // false

18. 删除字符串中的空格

const removeWhitespace = str => str.replace(//s/g, '');removeWhitespace("H el l o") // Hello

19. 检查闰年

const isLeapYear = year => (year % 4 === 0 && year % 100 !== 0) || (year % 400 === 0);isLeapYear(2023) // falseisLeapYear(2004) // true

20.生成指定长度的随机字符串

const generateRandomString = length => [...Array(length)].map(() => Math.random().toString(36)[2]).join('')generateRandomString(8) // 4hq4zm7y

21.复制内容到剪贴板

const copyToClipboard = (content) => navigator.clipboard.writeText(content)copyToClipboard("Hello World")

22. 获取 HH:MM:SS 格式的当前时间

const currentTime = () => new Date().toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false })currentTime() // 19:52:21

23. 检查数字是偶数还是奇数

const isEven = num => num % 2 === 0isEven(1) // falseisEven(2) // true

24.检测是否为深色模式

const isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matchesconsole.log(isDarkMode) // false

25. 滚动到页面顶部

const goToTop = () => window.scrollTo(0, 0)goToTop()

26. 检查有效日期

const isValidDate = date => date instanceof Date && !isNaN(date);isValidDate(new Date("This is not date.")) // falseisValidDate(new Date("08-10-2023")) // true

27. 生成日期范围

const generateDateRange = (startDate, endDate) => Array.from({ length: (endDate - startDate) / (24 * 60 * 60 * 1000) + 1 }, (_, index) => new Date(startDate.getTime() + index * 24 * 60 * 60 * 1000));generateDateRange(new Date("2023-09-31"), new Date("2023-10-08")) // [Sun Oct 01 2023 05:30:00 GMT+0530 (India Standard Time), Mon Oct 02 2023 05:30:00 GMT+0530 (India Standard Time), Tue Oct 03 2023 05:30:00 GMT+0530 (India Standard Time), Wed Oct 04 2023 05:30:00 GMT+0530 (India Standard Time), Thu Oct 05 2023 05:30:00 GMT+0530 (India Standard Time), Fri Oct 06 2023 05:30:00 GMT+0530 (India Standard Time), Sat Oct 07 2023 05:30:00 GMT+0530 (India Standard Time), Sun Oct 08 2023 05:30:00 GMT+0530 (India Standard Time)]

28.计算两个日期之间的间隔

const dayDiff = (d1, d2) => Math.ceil(Math.abs(d1.getTime() - d2.getTime()) / 86400000)dayDiff(new Date("2023-10-08"), new Date("1999-04-31")) // 8926

29. 找出该日期是一年中的第几天

const dayInYear = (d) => Math.floor((d - new Date(d.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24)dayInYear(new Date('2023/10/08'))// 281

30.检查数组是否相等

const areArraysEqual = (arr1, arr2) => JSON.stringify(arr1) === JSON.stringify(arr2);areArraysEqual([1, 2, 3], [4, 5, 6]) // falseareArraysEqual([1, 2, 3], [1, 2, 3]) // false

结论

JavaScript 行话是很有价值的工具,可以简化复杂的任务并提高代码的可读性。通过理解和利用这些技术,不仅展示了自己的熟练程度,还展示了编写高效、清晰和可维护代码的能力。wZ828资讯网——每日最新资讯28at.com

我希望你能发现它们有用之处,让它们适应你的项目,帮助你提升开发效率,不断优化你的解决方案。wZ828资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-12673-0.html30 个 JavaScript 单行代码,让你成为 JavaScript 奇才

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: 使用Docker Swarm进行容器编排和容器间网络安全的最佳实践

下一篇: 30 个有用的 JavaScript 代码片段(下)

标签:
  • 热门焦点
  • 0糖0卡0脂 旭日森林仙草乌龙茶优惠:15瓶到手29元

    旭日森林无糖仙草乌龙茶510ml*15瓶平时要卖为79.9元,今日下单领取50元优惠券,到手价为29.9元。产品规格:0糖0卡0脂,添加草本仙草汁,清凉爽口,富含茶多酚,保留
  • 之家push系统迭代之路

    前言在这个信息爆炸的互联网时代,能够及时准确获取信息是当今社会要解决的关键问题之一。随着之家用户体量和内容规模的不断增大,传统的靠"主动拉"获取信息的方式已不能满足用
  • 一文搞定Java NIO,以及各种奇葩流

    大家好,我是哪吒。很多朋友问我,如何才能学好IO流,对各种流的概念,云里雾里的,不求甚解。用到的时候,现百度,功能虽然实现了,但是为什么用这个?不知道。更别说效率问题了~下次再遇到,
  • ESG的面子与里子

    来源 | 光子星球撰文 | 吴坤谚编辑 | 吴先之三伏大幕拉起,各地高温预警不绝,但处于厄尔尼诺大&ldquo;烤&rdquo;之下的除了众生,还有各大企业发布的ESG报告。ESG是&ldquo;环境保
  • iQOO 11S评测:行业唯一的200W标准版旗舰

    【Techweb评测】去年底,iQOO推出了“电竞旗舰”iQOO 11系列,作为一款性能强机,该机不仅全球首发2K 144Hz E6全感屏,搭载了第二代骁龙8平台及144Hz电竞
  • 超级标准版旗舰!iQOO 11S全球首发iQOO超算独显芯片

    上半年已接近尾声,截至目前各大品牌旗下的顶级旗舰都已悉数亮相,而下半年即将推出的顶级旗舰已经成为了数码圈爆料的主流,其中就包括全新的iQOO 11S系
  • 3699元!iQOO Neo8 Pro顶配版今日首销:1TB UFS 4.0同价位唯一

    5月23日,iQOO推出了全新的iQOO Neo8系列,包含iQOO Neo8和iQOO Neo8 Pro两个版本,其中标准版搭载高通骁龙8+,而Pro版更是首发搭载了联发科天玑9200+旗舰
  • 机构称Q2全球智能手机出货量同比下滑11% 苹果份额依旧第2

    7月20日消息,据外媒报道,研究机构的报告显示,由于需求下滑,今年二季度全球智能手机的出货量,同比下滑了11%,三星、苹果等主要厂商的销量,较去年同期均有下
  • Counterpoint :OPPO双旗舰战略全面落地 高端产品销量增长22%

    2023年6月30日,全球行业分析机构Counterpoint Research发布的《中国智能手机高端市场白皮书》显示,中国智能手机品牌正在寻求高质量发展,中国高端智能
Top