今天，学会这10个JS代码段就够了！

 

用 apply 将数组各项添加到另一个数组

const array = [a,今天 b]; const elements = [0, 1, 2]; array.push.apply(array, elements); console.info(array); // ["a", "b", 0, 1, 2] 

函数只执行一次

function once (fn){    let called = false   return function () {      if (!called) {        called = true       fn.apply(this, arguments)     }   } } function func (){      console.log(1); } //调用 let onlyOnce = once(func); // 测试 onlyOnce(); // 1 onlyOnce(); // 不执行 

防抖

/**  * 防抖  * @param { Function} func 要执行的回调函数  * @param { Number} wait 延时的时间  * @param { Boolean} immediate 是否立即执行  * @return null  */ let timeout; function Debounce(func, wait = 3000, immediate = true) {    // 清除定时器   if (timeout !== null) clearTimeout(timeout);   // 立即执行，此类情况一般用不到   if (immediate) {      var callNow = !timeout;     timeout = setTimeout(function() {        timeout = null;     },个J够 wait);     if (callNow) typeof func === function && func();   } else {      // 设置定时器，当最后一次操作后，香港云服务器码段timeout不会再被清除，今天所以在延时wait毫秒后执行func回调方法     timeout = setTimeout(function() {        typeof func === function && func();     },个J够 wait);   } } Debounce(()=>console.log(1)); 

递归数组降为一维

let children = [1, [2, 3], [4, [5, 6, [7, 8]]], [9, 10]]; function simpleNormalizeChildren(children) {              for (let i = 0; i < children.length; i++) {                  if (Array.isArray(children[i])) {                      children = Array.prototype.concat.apply([], children);                     simpleNormalizeChildren(children)                 }             }             return children;         } console.log(simpleNormalizeChildren(children)); // [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] 

数组降维(二维降一维)

function simpleNormalizeChildren(children) {              for (let i = 0; i < children.length; i++) {                  if (Array.isArray(children[i])) {                      return Array.prototype.concat.apply([], children)                 }             }             return children } let arrs = [[1],[3]]; const arr = simpleNormalizeChildren(arrs); console.log(arr); // [1,3] 

使用可选链进行函数调用

function doSomething(onContent, onError) {    try {     // ... do something with the data   }   catch (err) {      onError?.(err.message); // 如果onError是undefined也不会有异常   } } 

检测数组对象中是否有空值

const data = [   {     name:"maomin"   },   {      name:""   } ] const arr = data.filter(item =>     Object.values(item).includes() ); console.log(arr.length>0?"有空值":"无空值"); // 有空值 

计算数组中每个元素出现的次数

let names = [Alice, Bob, Tiff, Bruce, Alice]; let countedNames = names.reduce(function (allNames, name) {    if (name in allNames) {      allNames[name]++;   }   else {      allNames[name] = 1;   }   return allNames; }, { }); console.log(countedNames); //  {  Alice: 2, Bob: 1, Tiff: 1, Bruce: 1 } 

按属性对object分类

let people = [   {  name: Alice, age: 21 },   {  name: Max, age: 20 },   {  name: Jane, age: 20 } ]; function groupBy(objectArray, property) {    return objectArray.reduce(function (acc, obj) {      let key = obj[property];     if (!acc[key]) {        acc[key] = [];     }     acc[key].push(obj);     return acc;   }, { }); } const groupedPeople = groupBy(people, age); console.log(groupedPeople); // {  //   20: [ //     {  name: Max, age: 20 }, //     {  name: Jane, age: 20 } //   ], //   21: [{  name: Alice, age: 21 }] // } 

将带有分割符的云服务器字符串转化成一个n维数组

 const str = "A-2-12";  const str1 = str.split(-);  console.log(str1);  const arr = str1.reverse().reduce((pre,cur,i) => {   if(i==0)   {  pre.push(cur)    return pre  }   return [cur,pre] },[]) console.log(arr) // ["A"["B",["C"]]] 

本文转载自微信公众号「前端历劫之路」，可以通过以下二维码关注。码段转载本文请联系前端历劫之路公众号。今天

个J够

个J够