隨機(jī)生成字母和數(shù)組的組合

Math.random().toString(36).substr(2);

格式化時(shí)間

const dateFormatter = (formatter, date) => {
    date = (date ? new Date(date) : new Date)
    const Y = date.getFullYear() + '',
          M = date.getMonth() + 1,
          D = date.getDate(),
          H = date.getHours(),
          m = date.getMinutes(),
          s = date.getSeconds()
    return formatter.replace(/YYYY|yyyy/g, Y)
                    .replace(/YY|yy/g, Y.substr(2, 2))
                    .replace(/MM/g, (M < 10 ? '0' : '') + M)
                    .replace(/DD/g, (D < 10 ? '0' : '') + D)
                    .replace(/HH|hh/g, (H < 10 ? '0' : '') + H)
                    .replace(/mm/g, (m < 10 ? '0' : '') + m)
                    .replace(/ss/g, (s < 10 ? '0' : '') + s)
}

dateFormatter('YYYY/MM/DD hh:mm:ss',new Date()) // 2021/06/21 11:11:17

獲取變量的實(shí)際類型

const trueTypeOf = (obj) => {
  return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase();
};

console.log(trueTypeOf(''));
// string
console.log(trueTypeOf(0));
// number
console.log(trueTypeOf());
// undefined
console.log(trueTypeOf(null));
// null
console.log(trueTypeOf({}));
// object
console.log(trueTypeOf([]));
// array
console.log(trueTypeOf(0));
// number
console.log(trueTypeOf(() => {}));
// function

1. if多條件判斷

// 冗余
if (x === 'abc' || x === 'def' || x === 'ghi' || x ==='jkl') {}

// 簡(jiǎn)潔
if (['abc', 'def', 'ghi', 'jkl'].includes(x)) {}

2. if...else...

// 冗余
let test: boolean;
if (x > 100) {
    test = true;
} else {
    test = false;
}

// 簡(jiǎn)潔
let test = x > 10;
let text = x > 10 ? true : false

• 多條件判斷同一執(zhí)行方法

if(status === 0 || status === 1 || status === 2 || status === 3) {
    console.log('按鈕可以點(diǎn)擊');
}
// =>

if([0, 1, 2, 3].includes(status)) {
    console.log('按鈕可以點(diǎn)擊');
}

• 多種可能對(duì)應(yīng)不同情況

// status 非數(shù)值或數(shù)值過(guò)大
const statusTextObject = {
    100: '已刪除',
    101: '未開始',
    102: '上課中',
    103: '已下課',
    104: '已評(píng)估'
}
text = statusTextObject[status] || '--';

// 非數(shù)值我們將對(duì)象的 key 替換為對(duì)應(yīng)status的值即可宝恶。

3. Null, Undefined, 空值檢查

// 冗余
if (first !== null || first !== undefined || first !== '') {
    let second = first;
}

// 簡(jiǎn)潔
let second = first || '';

4. 函數(shù)條件調(diào)用

// 冗余
function test1() {
  console.log('test1');
};
function test2() {
  console.log('test2');
};
var test3 = 1;
if (test3 == 1) {
  test1();
} else {
  test2();
}

// 簡(jiǎn)單
(test3 === 1? test1:test2)();

5. switch多條件

// 冗余
switch (data) {
  case 1:
    test1();
  break;

  case 2:
    test2();
  break;

  case 3:
    test();
  break;
  // so on...
}

// 簡(jiǎn)潔
var data = {
  1: test1,
  2: test2,
  3: test
};

data[anything] && data[anything]();

6. 隱式返回

// 冗余
function getArea(diameter) {
  return Math.PI * diameter
}

// 簡(jiǎn)潔
getArea = diameter => (
  Math.PI * diameter;
)

7. 普通數(shù)組去重&對(duì)象數(shù)組去重

const uniqueArr = (arr) => [...new Set(arr)];

console.log(uniqueArr([1, 2, 3, 1, 2, 3, 4, 5]));
// [1, 2, 3, 4, 5]


const uniqueElementsBy = (arr, fn) =>arr
.reduce((acc, v) => {if (!acc.some(x => fn(v, x))) acc.push(v);return acc;}, []);
 
uniqueElementsBy([{id: 1, name: 'Jhon'}, {id: 2, name: 'sss'}, 
{id: 1, name: 'Jhon'}], (a, b) => a.id == b.id)
// [{id: 1, name: 'Jhon'}, {id: 2, name: 'sss'}]

8. 從數(shù)組中取出相對(duì)應(yīng)屬性的值

const reducedFilter = (data, keys, fn) =>data.filter(fn)
.map(el =>keys.reduce((acc, key) => {acc[key] =el[key];return acc;}, {}));
const data = [
  {
    id: 1,
    name: 'john',
    age: 24
  },
  {
    id: 2,
    name: 'mike',
    age: 50
  }
];
 
let a = reducedFilter(data, ['id', 'name'], item => item.age > 24); // [{ id: 2, name: 'mike'}]

9.關(guān)于 return cur.push(v*2),cur之謎

let arr=[1,2,3,4]
const b=arr.reduce((cur,v)=> [...cur,v*2],[])
const b1=arr.reduce((cur,v)=> {
    //直接 return cur.push(v*2)報(bào)錯(cuò)是因?yàn)?push返回的不是數(shù)組，是push之后的長(zhǎng)度
    return cur.push(v*2),cur
},[])
const b2=arr.reduce((res, cur)=> { 
    res.push(cur * 2); 
    return res; 
}, [])
// [2,4,6,8]

• return cur.push(v*2),cur等同于return cur