数组扁平化（又称数组降维）

MDN：flat() 方法会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并为一个新数组返回

  1. const test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]]
  3. // flat不传参数时，默认扁平化一层
  4. test.flat()
  5. // ["a", "b", "c", "d", ["e", ["f"]], "g"]
  7. // flat传入一个整数参数，整数即扁平化的层数
  8. test.flat(2)
  9. // ["a", "b", "c", "d", "e", ["f"], "g"]
  11. // Infinity 关键字作为参数时，无论多少层嵌套，都会转为一维数组
  12. test.flat(Infinity)
  13. // ["a", "b", "c", "d", "e", "f", "g"]
  15. // 传入 <=0 的整数将返回原数组，不扁平化
  16. test.flat(0)
  17. test.flat(-1)
  18. // ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]]
  20. // 如果原数组有空位，flat()方法会跳过空位。
  21. ["a", "b", "c", "d",,].flat()
  22. // ["a", "b", "c", "d"]

Array.prototype.flat() 总结：

  • Array.prototype.flat() 用于将嵌套的数组扁平化，成为一维数组。该方法返回一个新的数组，对原数据没有影响
  • 不传参数时，默认扁平化一层；传入一个整数时，这个整数代码想要扁平化的层数
  • 传入 <=0 的整数将不进行扁平化，返回原数组
  • Infinity 关键字作为参数时，无论是多少层嵌套，都会转为一维数组
  • 另外，注意：如果原数组有空位，Array.prototype.flat() 会跳过空位

    方法一：使用 reduce 方法

    一次性扁平化所有： ```javascript function flattenDeep(arr) { return Array.isArray(arr)
    1. ? arr.reduce( (acc, cur) => [...acc, ...flattenDeep(cur)] , [])
    2. : [arr]
    }

// 测试 var test = [“a”, [“b”, “c”], [“d”, [“e”, [“f”]], “g”]] flattenDeep(test) // [“a”, “b”, “c”, “d”, “e”, “f”, “g”]

  1. 实现 flat 函数：
  2. ```javascript
  3. function flat(arr, depth = 1) {
  4.     return depth > 0
  5.         ? arr.reduce((acc, cur) => {
  6.         if(Array.isArray(cur)) {
  7.             return [...acc, ...flat(cur, depth-1)]
  8.         }
  9.         return [...acc, cur]
  10.     } , [])
  11.       : arr
  12. }
  14. // 测试
  15. var test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]]
  16. // 不传参数时，默认扁平化一层
  17. flat(test)
  18. // ["a", "b", "c", "d", ["e", ["f"]], "g"]
  20. // 传入一个整数参数，整数即扁平化的层数
  21. flat(test, 2)
  22. // ["a", "b", "c", "d", "e", ["f"], "g"]
  24. // Infinity 关键字作为参数时，无论多少层嵌套，都会转为一维数组
  25. flat(test, Infinity)
  26. // ["a", "b", "c", "d", "e", "f", "g"]
  28. // 传入 <=0 的整数将返回原数组，不扁平化
  29. flat(test, 0)
  30. flat(test, -10)
  31. // ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]];
  33. // 如果原数组有空位，flat()方法会跳过空位。
  34. var arr = ["a", "b", "c", "d",,]
  35. flat(arr)
  36. // ["a", "b", "c", "d"]

方法二：栈

一次性降维所有

  1. function flattenDeep(arr) {
  2.   const result = [] 
  3.   // 将数组元素拷贝至栈，直接赋值会改变原数组
  4.   const stack = [...arr]
  5.   // 如果栈不为空，则循环遍历
  6.   while (stack.length !== 0) {
  7.     const val = stack.pop() 
  8.     if (Array.isArray(val)) {
  9.       // 如果是数组再次入栈，并且展开了一层
  10.       stack.push(...val) 
  11.     } else {
  12.       // 如果不是数组，就用头插法插入到结果数组中
  13.       result.unshift(val)
  14.     }
  15.   }
  16.   return result
  17. }
  19. // 测试
  20. var test = ["a", ["b", "c"], ["d", ["e", ["f"]], "g"]]
  21. flattenDeep(animals)
  22. // ["a", "b", "c", "d", "e", "f", "g"]

数组去重

方式一：Set（ES6）

  1. function unique(arr) {
  2.     return Array.from(new Set(arr))
  3. }
  4. // 或者
  5. var unique = arr => [...new Set(arr)]
  7. // 测试
  8. var arr = [1, 2, 2, 3]
  9. unique(arr); // [1, 2, 3]

方式二：reduce

  1. function unique (arr) {
  2.     return arr.sort().reduce((acc, cur) => {
  3.      if (acc.length === 0 || acc[acc.length - 1] !== cur) {
  4.          acc.push(cur);
  5.      }
  6.      return acc
  7.  }, [])}
  8. ;
  11. // 测试
  12. var arr = [1, 2, 2, 3]
  13. unique(arr); // [1, 2, 3]

方法三：filter

  1. function unique(arr) { 
  2.     return arr.filter( (element, index, array) => {
  3.      return array.indexOf(element) === index
  4.  })
  5. }
  7. // 测试
  8. var arr = [1, 2, 2, 3]
  9. unique(arr); // [1, 2, 3]