1、 带有多的条件的if的语句  逻辑 || 的简写

  if (x == 'true' || x == '2523' || x == '小明') {
      // logic
  }
  // 简化操作
  if (['true', '2523', '小明'].includes(x)) {
      // logic
  }

2、 简化 if true...else 条件的写法，可以运用我们的三元运算符

 let test;
  if (x > 100) {
      test = true
  } else {
      test = false
  }
  // 简化操作
  test = x > 100 ? true : false
  /*
   如果有判断条件的的语句多的时候可以这样做
  */
  let x = 50  // x为40输出'我小于50'  x为52输出'我是大于50''   x为140输出'你好两把刷子'
  let res = (x > 100) ? '你好两把刷子' : (x < 50) ? '我小于50' : '我是大于50'
  console.log(res)

3、 声明变量

  let test1;
  let test2 = 1
  // 简写
  let test3, test4 = 1
  // 给多个变量进行赋值
  let test1, test3, test4;
  test1 = 1
  test3 = 2
  test4 = 3
  // 简化 
  let [test1,test3,test4] = [1,2,3]

4、null 和 undefined 的空置检查当这个数据已知是 null 或者是 undefined 可以这样写

 if (test1 != null || test1 !== undefined || test1 !== '') {
    // logic
    let test2 = test1
  }
  let test2 = test1 || ''

  //  还可以基于 ?? 操作符 如果左边的值为 null 或 undefined 就返回右边的值，如果左边的值为默认值就返回左边的值

  const test = null ?? 'default'
  console.log(test) // default

  const test6 = 0 ?? 1
  console.log(test6) // default

5、操作赋值符

  let test1 = 3
  test1 = test1 + 1
  test3 = test1 - 1
  test4 = test1 * 20
  // 简化
  test1++
  test1--
  test1 *= 20

6、判断值是否存在

  if (val) { } // 存在 
  if (!val) { }  // 不存在

7、 条件判断 &&  判断如果为 true 调用函数

  if (test1) {
    fn()
  }
  test1 && fn()
  // 比较后返回
  let test9;
  function check() {
    return test9 || fn('伪代码')
  }

8、遍历简化

  // for 的简化
  for (let i = 0; i < arr.length; i++) { }
  for (let key in arr) { }
  for (let value of arr) { }

  // 便利数组的每一项
  function fn(ele, i, array) { // 将函数传进去接收 forEach 的参数
    console.log(ele, i, array)
  }
  [1, 24, 5, 6, 777].forEach(fn)

9、箭头函数的简写

// 箭头函数
  function add(a, b) {
    return a + b
  }
  // 简写
  const arr = (a, b) => a + b
  // 如果为一个参数就直接不用加 ()
  const fn = a => a + 1

  // 箭头函数的返回值 隐式转换
  let f;
  f = a => (
    3 + a * 1
  )
  console.log(f('2')) // 5


  // 箭头函数默认参数
  let s;
  s = (a = 1, b = 2) => a + b
  console.log(s()) // 3


  // 简短的函数调用
  function fn1() {
    console.log('fn1')
  }
  function fn2() {
    console.log('fn2')
  }
  let a = 1
  if (a == 1) {
    fn1()
  } else if (a == 2) {
    fn2()
  }
  // 简写
  a == 1 ? fn1() : fn2()

10、switch 的简化

  function fn1() { console.log(1) }
  function fn2() { console.log(2) }
  function fn3() { console.log(3) }
  let data1 = 1
  switch (data1) {
    case 1:
      fn1()
      break
    case 2:
      fn2()
      break
    case 'h':
      fn3()
      break
    default:
      console.log('啥也是不是')
  }
  // 简化
  let data2 = 1
  var data = {
    1: fn1,
    2: fn2,
    'h': fn3,
  }
  data[data2] && data[data2]()

11、拼接简化

  let arr1 = [1, 3]
  let arr2 = [4, 5]
  console.log(arr2.concat(arr1))
  console.log([...arr1, ...arr2])
  console.log([213, 5, ...arr2])
  console.log([213, 5].concat(arr2))

12、克隆数组

  let arr4 = [1,234,4,88]
  let arr5 = arr4.slice()

  let arr4 = [1,234,4,88]
  let arr5 = [...arr4]

13、项目中常见的id转换拼接

    /*
      项目中经常有这样的需求就是，拿到每一行的 id 然后拼接到 后端返回的 ids 上面以逗号的形式分割开
      然后调用更新接口
      一行代码搞定不需要多次赋值
    */
    let row = {
        attachmentIds: '4556'
    }

    let response = {
        data: {
            id: 999
        }
    }


    response.data.id = row.attachmentIds ? [...row.attachmentIds.split(','), response.data.id.toString()].join(',') : [
        response.data.id
        .toString()
    ];
    console.log(response)

14、多态的使用优化函数

    var googleMap = {
        show: function () {
            console.log('有两把刷子11');
        }
    };
    var baiduMap = {
        show: function () {
            console.log('有两把刷子22');
        }
    };
    // 没优化
    var renderMap = function (type) {
        if (type === 'google') {
            googleMap.show();
        } else if (type === 'baidu') {
            baiduMap.show();
        }
    };
    renderMap('google'); // 输出：有两把刷子11
    renderMap('baidu'); // 输出：有两把刷子22

    // 优化 多态

    var sosoMap = {
        show: function () {
            console.log('有两把刷子33');
        }
    };
    
    // 函数
    var renderMap = function (map) {
        if (map.show instanceof Function) {
            map.show();
        }
    };

    renderMap(googleMap); // 输出：有两把刷子11
    renderMap(baiduMap); // 输出：有两把刷子22
    renderMap(sosoMap); // 输出：有两把刷子33

目前总结这么多，还有好多神奇操作，后续更新...