冰冻大西瓜的博客

Appearance

工具函数 ​

数值转换千分位 ​

javascript
// 函数接受参数类型为字符串格式
function transform(str) {
  let newstr = str.replace(/\d{1,3}(?=(\d{3})+$)/g, function (s) {
    return s + ','
  })
  return newstr
}
javascript
let num = 123.4567
let formatNum = num.toLocaleString(
  'en-US',
  { minimumFractionDigits: 4 } // 控制小数显示 默认为3
)

多维数组展平 ​

javascript
let arr = [1, 2, 3, [4, [5, 6, true], '大西瓜']]

function flatten(arr) {
  return [].concat(...arr.map(x => (Array.isArray(x) ? flatten(x) : x)))
}
let newarr = flatten(arr)
console.log(newarr)

css 去掉 input[type="number"] 上下箭头 ​

css
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

input[type='“number”'] {
  -moz-appearance: textfield;
}

数据类型判断 ​

javascript
function typeOf(obj) {
  let res = Object.prototype.toString.call(obj).split(' ')[1].slice(0, -1).toLowerCase()
  console.log(res)
}

typeOf([])

typeOf({})

typeOf(new Date())

typeOf(123)

typeOf('冰冻大西瓜')

typeOf(undefined)

检验空对象或空数组的方法 ​

javascript
if (JSON.stringify(obj) === '{}') {
  return true
}

if (JSON.stringify(obj) === '[]') {
  return true
}

img 标签多出几像素的解决方案 ​

  1. 父元素中:font-size:0

  2. 父元素中:line-height:0

  3. 自身:display:block(推荐)

  4. 自身:vertical-align:middle/top/bottom(推荐)

知道首尾数字，生成连续数组 ​

javascript
return Array(end - start)
  .fill(start)
  .map((el, i) => start + i)

知道起始数字与数组长度，生成连续数组 ​

javascript
return Array.from({ length: continuse }, (v, k) => start + k)

数组清洗 ​

javascript
// 移除null false undefined 0 等值
let arr = [1, 2, '大西瓜', '7', false, '', undefined, null, 0]
let res = arr.filter(Boolean)
console.log(res) // output: [1, 2, '大西瓜', '7']

进制转换 ​

javascript
// 十进制转二进制
let num = 10
console.log(num.toString(2)) // 1010
// 二进制转十进制
let num2 = 1010101
console.log(parseInt(num2, 2)) // 85
console.log(num2.toString()) //85
// 十进制转十六进制
console.log(parseInt(num, 16)) // 16
// 十六进制转十进制
let num3 = 0xffff
console.log(parseInt(num3, 10)) // 65535

伪数组转数组 ​

伪数组有哪些?

  • 函数参数

  • arguments,

  • DOM 对象列表

javascript