一些 JS 代码片段

发布于 2023-05-11 22:04:53 字数 2241 浏览 49 评论 0

配图源自 Freepik

记录一些取巧、简洁的代码片段,将会不断持续更新...

首字母大写转换

const captialize = ([first, ...rest]) => {
  return first.toUpperCase() + rest.join('')
}

生成数字范围数组

const range = end => {
  return Array.from({ length: end }, (_, index) => index)
}

过滤数组中的虚值

虚值(falsy),包括 undefinednullfalse+0-0NaN0n''。除此之外的其他操作数被称为真值(truthy)。

// 注意 Boolean 本身就是一个函数
const filterFalsy = arr => arr.filter(Boolean) 

生成随机字符串

const getRandomKey = () => Math.random().toString(36).slice(2)

// create unique id from letters and numbers
const uniqueAlphaNumericId = (() => {
  const heyStack = '0123456789abcdefghijklmnopqrstuvwxyz'
  const randomInt = () => Math.floor(Math.random() * Math.floor(heyStack.length))
  return (length = 24) => Array.from({ length }, () => heyStack[randomInt()]).join('')
})()

生成随机十六进制颜色值(延伸)

// 带透明的的话,取 slice(2, 10)
const getRandomColor = () => Math.random().toString(16).slice(2, 8)

反转字符串

const reverseStr = str => [...str].reduce((a, s) => s + a)

五星打分

const getRating = rate => {
  if (rate > 5 || rate < 0) throw new Error('不在范围内')
  return '★★★★★☆☆☆☆☆'.substring(5 - rate, 10 - rate)
  // return '★'.repeat(rate) + '☆'.repeat(5 - rate)
}

有大佬利用这个思路做了个五星评级的组件,详看:★构建东半球最小的评级组件☆

判断是否为苹果设备

const isAppleDevice = () => /(iPhone|iPad|iPod|iOS|mac\sos)/i.test(navigator.userAgent)

数字千分位表示法

const thousandsReplace = str => String(str).replace(/\B(?=(\d{3})+(?!\d))/g, ',')

thousandsReplace(10000) // "10,000"

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据

关于作者

小嗷兮

暂无简介

0 文章
0 评论
22 人气
更多

推荐作者

亽野灬性zι浪

文章 0 评论 0

少年亿悲伤

文章 0 评论 0

南七夏

文章 0 评论 0

qq_EJoXxu

文章 0 评论 0

17780639550

文章 0 评论 0

萌逼全场

文章 0 评论 0

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文