一些 JS 代码片段

[toFrankie]

在此记录一些代码片段。

1. 首字母大写转换

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

2. 生成数字范围数组

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

3. 过滤数组中的虚值（falsy），包括 undefined、null、false、+0、-0、NaN、0n、''。除此之外的其他操作数被称为真值（truthy）。

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

4. 生成随机字符串

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('')
})()

5. 生成随机十六进制颜色值（延伸）

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

6. 反转字符串

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

7. 五星打分

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

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

8. 判断是否为苹果设备

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

9. 数字千分位表示法

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

thousandsReplace(10000) // "10,000"

10. 移除末尾 0

const removeTrailingZero = str => {
  const reg = /(?:\.0*|(\.\d+?)0+)$/
  return str.replace(reg, '$1')
}

常用场景是价格展示。