面试中Array数组函数方法(去重等)

这是我参与更文挑战的第12天，活动详情查看： 更文挑战

一些常用Array数组函数

数组

数组去重

object数组

• map方法

function unique(arr,u_key) {
		let map = new Map()
		arr.forEach((item,index)=>{
		  if (!map.has(item[u_key])){
			map.set(item[u_key],item)
		  }
		})
	 return [...map.values()];
	  };
	  
复制代码

• reduce方法

    let arrayUniqueObject = (arr, name) => {
      var hash = {};
      return arr.reduce(function (item, next) {
        if(!next) return ;
        hash[next[name]] ? '' : hash[next[name]] = true && item.push(next);
        return item;
      }, []);
    }
复制代码

普通数组

• es6 set方法

    function noRepeat(arr) {
      return [...new Set(arr)]
    }
复制代码

• Map数据结构去重

function unique(arr){
  return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
复制代码

• reduce+includes

function unique(arr){
  return arr.reduce((prev,cur) => prev.includes(cur) ? prev : [...prev,cur],[]);
}
复制代码

• hasOwnProperty去重

function unique(arr) {
  var obj = {};
  return arr.filter(function(item, index, arr){
    return obj.hasOwnProperty(typeof item + item) ? false : (obj[typeof item + item] = true)
  })
复制代码

• includes去重

function unique(arr) {
  if (!Array.isArray(arr)) {
    console.log('type error!')
    return
  }
  var array =[];
  for(var i = 0; i < arr.length; i++) {
      if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
          array.push(arr[i]);
       }
  }
  return array
}
复制代码

• 排序后相邻去除法

function unique(arr) {
  if (!Array.isArray(arr)) {
    console.log('type error!')
    return
  }
  var array =[];
  for(var i = 0; i < arr.length; i++) {
      if( !array.includes( arr[i]) ) {//includes 检测数组是否有某个值
          array.push(arr[i]);
       }
  }
  return array
}
复制代码

查找数组最大

    function arrayMax(arr) {
      return Math.max(...arr);
    }
复制代码

查找数组最小

   function arrayMin(arr) {
      return Math.min(...arr);
    }
复制代码

返回已size为长度的数组分割的原数组

function chunk(arr, size = 1) {
  return Array.from({
    length: Math.ceil(arr.length / size)
  }, (v, i) => arr.slice(i * size, i * size + size));
}
复制代码

检查数组中某元素出现的次数

   function countOccurrences(arr, value) {
      return arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0);
    }
复制代码

扁平化数组

• 默认depth全部展开

 function flatten(arr, depth = -1) {
      if (depth === -1) {
        return [].concat(...arr.map(v => Array.isArray(v) ? this.flatten(v) : v))
      }
      if (depth === 1) {
        return arr.reduce((a, v) => a.concat(v), []);
      }
      return arr.reduce((a, v) => a.concat(Array.isArray(v) ? this.flatten(v, depth - 1) : v), [])
}
复制代码

• 扩展运算符方法

function flatten(arr) {
    while(arr.some(item=>Array.isArray(item))) {
        arr = [].concat(...arr);
    }
    return arr;
}
复制代码

• 递归

function flatten(arr) {
    var res = [];
    arr.map(item => {
        if(Array.isArray(item)) {
            res = res.concat(flatten(item));
        } else {
            res.push(item);
        }
    });
    return res;
}
复制代码

• join & split方法 – 纯数字多维数组

function flatten(arr) {
    return arr.join(',').split(',').map(function(item) {
        return parseInt(item);
    })
}
复制代码

• toString & split方法 – 纯数字多维数组

function flatten(arr) {
    return arr.toString().split(',').map(function(item) {
        return Number(item);
    })
} 
复制代码

• 使用 stack 无限反嵌套多层嵌套数组

function flatten(input) {
    const stack = [...input]; //保证不会破坏原数组
    const result = [];
    while(stack.length) {
    const first = stack.shift();
    if(Array.isArray(first)) {
              stack.unshift(...first);
    } else{
              result.push(first);
    }
    }
    return result;
}
复制代码

• es6提供的新方法flat(depth)

let a = [1,[2,3]];
a.flat(); // [1,2,3] 
a.flat(1); //[1,2,3]
复制代码

flat(depth) 方法中的参数depth，代表展开嵌套数组的深度，默认是1

所以我们可以添加参数1，或者直接调用flat()来对2维数组进行扁平化，如果我们可以提前知道数组的维度，对这个数组进行扁平化处理，参数depth的值就是数组的维度减一。

let a = [1,[2,3,[4,[5]]]];
a.flat(4-1); // [1,2,3,4,5]  a是4维数组
复制代码

其实还有一种更简单的办法，无需知道数组的维度，直接将目标数组变成1维数组。depth的值设置为Infinity。

let a = [1,[2,3,[4,[5]]]];
a.flat(Infinity); // [1,2,3,4,5]  a是4维数组
复制代码

对比两个数组并且返回其中不同的元素

function diffrence(arrA, arrB) {
  return arrA.filter(v => !arrB.includes(v))
}
复制代码

返回两个数组中相同的元素

function intersection(arr1, arr2) {
  return arr2.filter(v => arr1.includes(v))
}
复制代码

从右删除n个元素

function dropRight(arr, n = 0) {
  return n < arr.length ? arr.slice(0, arr.length - n) : [];
}
复制代码

截取第一个符合条件的元素及其以后的元素

function dropElements(arr, fn) {
  while (arr.length && !fn(arr[0])) arr = arr.slice(1);
  return arr;
}
复制代码

返回数组中下标间隔nth的元素

function everyNth(arr, nth) {
  return arr.filter((v, i) => i % nth === nth - 1)
}
复制代码

返回数组中第n个元素

支持负数

function nthElement(arr, n = 0) {
  return (n >= 0 ? arr.slice(n, n + 1) : arr.slice(n))[0]
}
复制代码

返回数组头元素

function head(arr) {
  return arr[0]
}
复制代码

返回数组末尾元素

function last(arr) {
  return arr[arr.length - 1]
}
复制代码

数组乱排

function shuffle(arr) {
  let array = arr
  let index = array.length

  while (index) {
    index -= 1
    let randomInedx = Math.floor(Math.random() * index)
    let middleware = array[index]
    array[index] = array[randomInedx]
    array[randomInedx] = middleware
  }

  return array
}
复制代码

树形结构的数组扁平化（按顺序）

• 循环

 function treeData(arr) {
        let cloneData = JSON.parse(JSON.stringify(arr))   //先将原来的数组深拷贝一份，防止影响到原来的数据
        return cloneData.filter(father => {
            let branchArr = cloneData.filter(child => father.id == child.parentId);
            branchArr.length > 0 ? father.children = branchArr : ''
            return father.parentId == null    //返回第一层的数据，如果最上一级的父级id不是null，请自行修改
        })
    }
复制代码

 const treeToArray = (data,childKey) => {
            let result = [];
            data.forEach(item => { 
                if (item[childKey]) {
                    item[childKey] && treeToArray(item[childKey]);
                }
                result.push(item);
            });
            return result;
        };
复制代码