当前位置:首页 >综合 >编程必备!25个让你眼前一亮的JavaScript代码技巧 会让这个过程变得非常简单

编程必备!25个让你眼前一亮的JavaScript代码技巧 会让这个过程变得非常简单

2024-06-28 15:33:06 [百科] 来源:避面尹邢网

编程必备!编程必备25个让你眼前一亮的个让JavaScript代码技巧

作者:前端小智 开发 前端 JavaScript一行代码是节省时间和代码的强大方式。它们可以用来在一行代码中执行复杂的眼前任务,这对其他开发人员来说非常令人印象深刻。代码

学习强大的技巧JavaScript一行代码,能够节省你的编程必备时间和代码量。

1. 将内容复制到剪贴板

为了提高网站的个让用户体验,我们经常需要将内容复制到剪贴板,眼前以便用户可以将其粘贴到指定位置。代码

编程必备!25个让你眼前一亮的JavaScript代码技巧 会让这个过程变得非常简单

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

2. 获取鼠标选中内容

你以前遇到过这种情况吗?我们需要获取用户选择的技巧内容。

编程必备!25个让你眼前一亮的JavaScript代码技巧 会让这个过程变得非常简单

const getSelectedText = () => window.getSelection().toString()getSelectedText()

3. 打乱一个数组

打乱一个数组?这在彩票程序中非常常见,编程必备但它并不是个让真正的随机。

编程必备!25个让你眼前一亮的JavaScript代码技巧 会让这个过程变得非常简单

const shuffleArray = array => array.sort(() => Math.random() - 0.5)shuffleArray([ 1,眼前 2,3,4, -1, 0 ]) // [3, 1, 0, 2, 4, -1]

4.将rgba转换为十六进制

我们可以将rgba和十六进制颜色值互相转换。

const rgbaToHex = (r,代码 g, b) => "#" + [r, g, b].map(num => parseInt(num).toString(16).padStart(2, '0')).join('')rgbaToHex(0, 0 ,0) // #000000rgbaToHex(255, 0, 127) //#ff007f

5.将十六进制转换为rgba

const hexToRgba = hex => {   const [r, g, b] = hex.match(/\w\w/g).map(val => parseInt(val, 16))  return `rgba(${ r}, ${ g}, ${ b}, 1)`;}hexToRgba('#000000') // rgba(0, 0, 0, 1)hexToRgba('#ff007f') // rgba(255, 0, 127, 1)

6.获取多个数字的平均值

使用reduce函数,我们可以非常方便地得到一组数组的技巧平均值。

const average = (...args) => args.reduce((a, b) => a + b, 0) / args.lengthaverage(0, 1, 2, -1, 9, 10) // 3.5

7.检查一个数字是偶数还是奇数

怎么判断一个数字是奇数还是偶数?

const isEven = num => num % 2 === 0isEven(2) // trueisEven(1) // false

8.在数组中去重元素

使用Set来删除数组中的重复元素,会让这个过程变得非常简单。

const uniqueArray = (arr) => [...new Set(arr)]uniqueArray([ 1, 1, 2, 3, 4, 5, -1, 0 ]) // [1, 2, 3, 4, 5, -1, 0]

9.检查一个对象是否为空对象

const isEmpty = obj => Reflect.ownKeys(obj).length === 0 && obj.constructor === ObjectisEmpty({ }) // trueisEmpty({  name: 'fatfish' }) // false

10.反转字符串

const reverseStr = str => str.split('').reverse().join('')reverseStr('fatfish') // hsiftaf

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

const dayDiff = (d1, d2) => Math.ceil(Math.abs(d1.getTime() - d2.getTime()) / 86400000)dayDiff(new Date("2023-06-23"), new Date("1997-05-31")) // 9519

12. 找出日期所在的年份中的天数

const dayInYear = (d) => Math.floor((d - new Date(d.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24)dayInYear(new Date('2023/06/23'))// 174

13.将字符串的首字母大写

const capitalize = str => str.charAt(0).toUpperCase() + str.slice(1)capitalize("hello fatfish")  // Hello fatfish

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

const generateRandomString = length => [...Array(length)].map(() => Math.random().toString(36)[2]).join('')generateRandomString(12) // cysw0gfljoyxgenerateRandomString(12) // uoqaugnm8r4s

15.在两个整数之间获取一个随机整数

const random = (min, max) => Math.floor(Math.random() * (max - min + 1) + min)random(1, 100) // 27random(1, 100) // 84random(1, 100) // 55

16.指定位数四舍五入

const round = (n, d) => Number(Math.round(n + "e" + d) + "e-" + d)round(3.1415926, 3) //3.142round(3.1415926, 1) //3.1

17.清除所有的cookies

const clearCookies = document.cookie.split(';').forEach(cookie => document.cookie = cookie.replace(/^ +/, '').replace(/=.*/, `=;expires=${ new Date(0).toUTCString()};path=/`))

18.检测是否为暗黑模式

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

19.滚动到页面顶部

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

20.判断是否为苹果设备

const isAppleDevice = () => /Mac|iPod|iPhone|iPad/.test(navigator.platform)isAppleDevice()

21.随机布尔值

const randomBoolean = () => Math.random() >= 0.5randomBoolean()

22.获取变量的类型

const typeOf = (obj) => Object.prototype.toString.call(obj).slice(8, -1).toLowerCase()typeOf('')     // stringtypeOf(0)      // numbertypeOf()       // undefinedtypeOf(null)   // nulltypeOf({ })     // objecttypeOf([])     // arraytypeOf(0)      // numbertypeOf(() => { })  // function

23.判断当前选项卡是否处于活动状态

const checkTabInView = () => !document.hidden

24.检查元素是否处于焦点状态

const isFocus = (ele) => ele === document.activeElement

25. 随机IP

const generateRandomIP = () => {   return Array.from({ length: 4}, () => Math.floor(Math.random() * 256)).join('.');}generateRandomIP() // 220.187.184.113generateRandomIP() // 254.24.179.151

总结

JavaScript一行代码是节省时间和代码的强大方式。它们可以用来在一行代码中执行复杂的任务,这对其他开发人员来说非常令人印象深刻。

在本文中,我们向您展示了25个厉害的JavaScript一行代码,这些代码将让您看起来像个专家。我们还提供了一些关于如何编写自己的JavaScript一行代码的技巧。

责任编辑:武晓燕 来源: 大迁世界 JavaScript代码任务

(责任编辑:综合)

    推荐文章
    • 节能元件(08231.HK)年度由亏转盈64.6万美元 每股盈利0.04美仙

      节能元件(08231.HK)年度由亏转盈64.6万美元 每股盈利0.04美仙节能元件(08231.HK)公告,截至2020年12月31日止年度,公司收入2110万美元,同比增长17.2%;公司拥有人应占溢利64.6万美元,上年同期亏损142.5万美元;每股盈利0.04美仙。收 ...[详细]
    • 存放三十年的灵芝还能吃吗

      存放三十年的灵芝还能吃吗您好医生:我想知道灵芝放30多年还能食用吗?没有发病情分析:你好,建议你最好不要服用,再说,你怎么确定没有发霉变质,一般黄曲霉对肝脏的毒性是很大的。意见建议:你好,就算没坏,估计其中的多糖。存放三十年 ...[详细]
    • 漏勺什么梗

      漏勺什么梗龚俊漏勺什么梗?龚俊漏勺的梗是因为他在很多采访中都耿直的离谱,什么都往外说而且毫不在意,每次都在讲大实话。漏勺指的是经常把话说漏嘴的人,藏不住消息。龚俊经常被他和张...漏勺是什么梗?就是撑饭的漏勺梗 ...[详细]
    • 酒店打扑克什么梗

      酒店打扑克什么梗扑克牌的含义是什么网络用语?扑克牌是历法的缩影,54张牌中,有52张是正牌,表示一年中有52个星期,两张是副牌,大王代表太阳,小王代表月亮。一年四季的春夏秋冬,分别用桃杏梅方来表示,...扑...打拳 ...[详细]
    • 南京米乐星娱乐有限公司地址在哪 注册资本是多少?

      南京米乐星娱乐有限公司地址在哪 注册资本是多少?南京米乐星娱乐有限公司地址在南京市玄武区太平北路80号三层,注册资本是900万元。 ...[详细]
    • 野生螃蟹的寿命有多长

      野生螃蟹的寿命有多长野生有多长-业百科从幼体开始计算,螃蟹的寿命为22,螃蟹的寿命与其性别、性腺成熟的迟早及生态环境密切有关。其中16~18个月在淡水水域中生活,4~6个月在河口浅海水。野生大螃蟹最长能活多少年?螃蟹分很 ...[详细]
    • 阻冲之什么梗

      阻冲之什么梗周淑怡为什么被称为祖冲之?这个梗的由来是因为周淑怡长得好看但是“长了张嘴”,网友们调侃她的毒舌而发明的。周淑怡本是女团出身,有着美丽的相貌和魔鬼的身材,但是她的直播并不是靠这...大家觉得《龙岭迷窟》 ...[详细]
    • 火车没赶上票作废吗

      火车没赶上票作废吗因为没赶上火车,所以那张票也要过期作废么?改签和乘车铁路部门规定要求,普通列车火车票改签须在开车前办理。也就意味着说,如果赶不上普通列车,车票将作废。原来普通列车旅客如办理改签,最晚可在开车后。买了火 ...[详细]
    • 大病医保报销额度是多少 ?大病医保包括哪些病?

      大病医保报销额度是多少 ?大病医保包括哪些病?根据规定,参加城乡医疗保险后,就可以获得大病医保报销,很多人都关心大病医保的有关问题,那么大病医保报销额度是多少?大病医保包括哪些病?下文就来带大家了解一下。大病医保报销额度比例1、累计金额在1.2万 ...[详细]
    • 手办怎么清洗

      手办怎么清洗手办脏了怎么清洗?工具/原料手办清理工具方法/步骤保养1:保养需要不定期清洗,玩完手办后,一定要清洗,这时候污渍还没有干,是最容易清洗的时候,一定要记得在放回去前清。如何清理手办?3.避免阳光直射,紫 ...[详细]
    热点阅读