你不知道的Javascript常用的小技巧，看看你都用过哪些吧

随机生成x~y之间的数字

const randomList = (start, end) =>
  Array.from({ length: Math.abs(end - start) }, (v, k) => k + start).sort(
    () => Math.random() - 0.5
  );
  console.log('randomList :>> ', randomList(14,10)); //[ 14, 15, 16, 17 ]

数组中最大值的索引/最小值索引

const list = randomList(14,10)
const maxOrMinIndex = (callback) =>
list.reduce((p, c, i, a) => (callback(p, c, a) ? i : p), 0);
console.log(
  "maxOrMinIndex :>> ",
  maxOrMinIndex((p, c, a) => c > a[p]), maxOrMinIndex((p, c, a) => c < a[p])
); //maxOrMinIndex :>>  5

统计每个字母出现的次数

const str = "asfuqohflksjlkjplxmqixzyhrtjgdfgqureowhgxkzfdalzxjdpeoqutjsue";
const countStr = [...str].reduce((p, c) => ((p[c] = (p[c] || 0) + 1), p), {});
const countStr1 = [...str].reduce(
  (p, c) => (p.set(c, (p.get(c) || 0) + 1), p),
  new Map()
);
// console.log("countStr1 :>> ", Object.fromEntries(countStr1));

按条件分组，根据年龄或者体重或者其他条件分组

const people = [
  { name: "Alice", age: 25, weight: 120 },
  { name: "android", age: 33, weight: 130 },
  { name: "IOS", age: 52, weight: 90 },
  { name: "HMOS", age: 22, weight: 90 },
  { name: "keBi", age: 13, weight: 120 },
  { name: "大鲨鱼", age: 15, weight: 94 },
  { name: "乔丹", age: 22, weight: 94 },
  { name: "艾丽丝", age: 33, weight: 98 },
  { name: "June", age: 52, weight: 116 },
  { name: "June", age: 34, weight: 116 },
];
const groupListByField = (field) =>
  people.reduce(
    (p, c) => (!p[c[field]] && (p[c[field]] = []), p[c[field]].push(c), p),
    {}
  );
console.log('groupListByField("age") :>> ', groupListByField("age"));
console.log('groupListByField("weight") :>> ', groupListByField("weight"));
console.log('groupListByField("weight") :>> ', groupListByField("name"));

手动实现group,groupToMap

Array.prototype.group = function (callback) {
  return this.reduce((p, c, i, a) => (!p[callback(c, i, a)] && (p[callback(c, i, a)] = []),p[callback(c, i, a)].push(c),p),{});
};
Array.prototype.groupToMap = function (callback) {
  return this.reduce((p, c, i, a) => (!p.get(callback(c, i,a))&& p.set(callback(c, i, a), []),p.get(callback(c, i, a)).push(c),p),new Map());
   };
   //再来试试上面的分组情况
   people.group((c) => c.age);
   people.groupToMap((c) => c.weight)
   

手动实现数组非破坏性的四个方法 sort,reverse,splice

Array.prototype.toSort = function (callback) {
  return this.slice().sort(callback);
};
Array.prototype.toSpliced = function (start, deleteCount, ...items) {
  return this.slice().splice(start, deleteCount, ...items);
};
Array.prototype.toReversed = function () {
  return this.slice().reverse();
};

手机号加密

let getFormatterPhone = (phone = "") =>
  String(phone).replace(
    String(phone).slice(3, -4),
    "*".repeat(String(phone).slice(3, -4).length)
  );
console.log(
  "getFormatterPhone(15626904030) :>> ",
  getFormatterPhone(15626904030)
);

填充n个不同引用地址的对象/map类型对象

let m3 = new Map(
    Array.from({ length: 12 }, (v, k) => ["key" + (k + 1), "value" + (k + 1)])
  );
  //直接实现不同引用地址的数组对象方式
  let m4 = (n) => Array.from({ length: n }, (v, k) => ({key:k,val:'val'+k}))
  console.log(m4(12))
  console.log("m3 :>> ", m3);

将Map对象转换成对象

console.log(Object.fromEntries(m3));

console.log(Object.fromEntries(m3));

将数字转换为大写金额格式

const digitUppercase = (n = 0) => {
  if (Object.prototype.toString.call(n).slice(8, -1) != 'Number') return;
  const fraction = ['角', '分'];
  const digit = [
    '零', '壹', '贰', '叁', '肆',
    '伍', '陆', '柒', '捌', '玖'
  ];
  const unit = [
    ['元', '万', '亿'],
    ['', '拾', '佰', '仟']
  ];
  n = Math.abs(n);
  let s = '';
  for (let i = 0; i < fraction.length; i++) {
    s += (digit[Math.floor(n * 10 * Math.pow(10, i)) % 10] + fraction[i]).replace(/零./, '');
  }
  s = s || '整';
  n = Math.floor(n);
  for (let i = 0; i < unit[0].length && n > 0; i++) {
    let p = '';
    for (let j = 0; j < unit[1].length && n > 0; j++) {
      p = digit[n % 10] + unit[1][j] + p;
      n = Math.floor(n / 10);
    }
    s = p.replace(/(零.)*零$/, '').replace(/^$/, '零') + unit[0][i] + s;
  }
  return s.replace(/(零.)*零元/, '元')
    .replace(/(零.)+/g, '零')
    .replace(/^整$/, '零元整');
};

邮箱格式加密

const formatterEmail = email => email.replace(email.slice(3, email.lastIndexOf('@')), '*'.repeat(5))
console.log("🚀 ~ file: ES6-12.js:181 ~ formatterEmail('2985984522@qq.com'):", formatterEmail('2985984522@qq.com'))
console.log("🚀 ~ file: ES6-12.js:181 ~ formatterEmail('2985984522@qq.com'):", formatterEmail('492958923844@163.com'))

过滤课程大于85分的科目

const course = {
  math: 80,
  english: 85,
  chinese: 90
}
let courseFilter = Object.entries(course).filter(([key, val]) => val >= 85)
console.log('Object.fromEntries(courseFilter)', Object.fromEntries(courseFilter))

交换对象的key，value

let obj3 = {
  name: 'zhangsan', age: 23, hobbies: ['swimming', 'running'],
  scores: {
    Chinese: 98,
    English: 76,
    history: 60
  }
}
let objCp = {};
for (let key in obj3) {
  objCp[key] = obj3[key];
}
//reduce实现会更简单
let obj = Object.entries(obj123).reduce((p,[key,val]) => (p[val] = key,p),{})
console.log(obj)
console.log('objCp', objCp)
console.log('objCp.scores.Chinese', objCp.scores.Chinese = 126)
console.log('objCp.name ', objCp.name = 'xq')
console.log('obj3', obj3)

将数组矩阵合成对象

const keys = ["name", "age", "gender"];
const values = ["Alice", 23, "男"];
const obj12 = keys.reduce((p, c, i) => (p[c] = values[i],p), {});
console.log('obj :>> ', obj12);

自定义key转换为新的数组对象

const rowsFields = [{ prop: 'name', }, { prop: 'height', keyName: 'keyHeight' }, { prop: 'job', keyName: 'keyJob' },];
const list = [
  { name: '章三', age: 23, type: '党员', isMarry: '未婚', height: '150', weight: '50', job: 'java' },
  { name: '王伟', age: 34, type: '地下党', isMarry: '已婚', height: '156', weight: '80', job: '前端开发' },
  { name: '高斯', age: 16, type: '中共中央', isMarry: '未婚', height: '176', weight: '56', job: 'wenyuan' },
  { name: '里斯', age: 64, type: '美国佬', isMarry: '已婚', height: '187', weight: '78', job: 'teacher' }
]
const getList = (rows, list) => {
  const newList = list.reduce((p, c, i) => {
    rows.forEach(r => (
      p[i][r.keyName || r.prop] = c[r.prop]
    ));
    return p
  }, Array.from({ length: list.length }, () => ({})))
  return newList
}
console.log('getList(rowsFields, list) :>> ', getList(rowsFields, list));

如果if/else很多的话，可以采用对象或者map的方式，你会发现优雅永不过时

const m1 = new Map([
    ["key1", "value1"],
    ["key2", "value2"],
    ["key3", "value3"],
    ["key4", "value4"],
    ["default", "defaultvalue"],
  ]);
  const getKey = (key = 'default') => m1.get(key) || m1.get("default");
  console.log("getKey(key1) :>> ", getKey("key1"));
  const o1 = {
    key1: "value1",
    key2: "value2",
    key3: "value3",
    key4: "value4",
    default: "defaultValue",
  };
  const getOKey = (key = "default") => o1[key] || o1["default"];
  console.log(getOKey());