记录JS中一些很实用的简写代码段

Boolean

// 通过两个取反强制转换为Boolean型
!!'foo'

 

Number

// string转为number
+'45'
+new Date

 

Array

1、数组去重

Array.from(new Set([1, 2, 3, 1, 2, 4, 5, 4, 6]))
[...new Set([1, 2, 3, 1, 2, 4, 5, 4, 6])]

2、数组合并

[1, 2, 3].concat([4, 5, 6])

[...[1, 2, 3], ...[4, 5, 6]]

 

Event

var times = 0
var foo = document.querySelector('.foo')
foo.addEventListener('click', function() {
    times++
    console.log(times)
}, false)

// 优化后
foo.addEventListener('click', (function() {
    var times = 0
    return function() {
        times++
        console.log(times)
    }
})(), false)

 

操作符（&&、||）

1、if判断语句针对不同情况赋值

// 普通用法
let str = ''
if (a === 'clear') {
  str = '清空'
} else if(a === 'delete') {
  str = '删除'
} else if (a === 'add') {
  str = '添加'
} else {
  str = '未知'
}

// switch用法
switch(a) {
  case 'clear': str='清空';break;
  case 'delete': str='删除';break;
  case 'add': str='添加';break;
  default: str='未知';
}

// Object写法
str = {
  clear: '清空',
  delete: '删除',
  add: '添加'
}[a] || '未知'


// 使用 && 和 || 的语法
str = (a === 'clear' && '清空') || (a === 'delete' && '删除') || (a === 'add' && '添加') || '未知';

2、if判断条件成立即执行

// 普通写法
if (a === '1' || a === '2') {
  console.log(a)
} 

// 优化写法
if(['1', '2'].includes(a)){
 console.log(a)
}

// 直接使用&&执行
['1', '2'].includes(a) && console.log(a)

持续更新中...