美文网首页ES6
数组扁平化

数组扁平化

作者: Jessy丶x | 来源:发表于2020-05-22 15:14 被阅读0次

对于[1, [1,2], [1,2,3]]这样多层嵌套的数组,我们如何将其扁平化为[1, 1, 2, 1, 2, 3]这样的一维数组呢:

  • ES6的flat()
const arr = [1, [1,2], [1,2,3]]
arr.flat(Infinity)  // [1, 1, 2, 1, 2, 3]
  • 序列化后正则
const arr = [1, [1,2], [1,2,3]]
const str = `[${JSON.stringify(arr).replace(/(\[|\])/g, '')}]`
JSON.parse(str)   // [1, 1, 2, 1, 2, 3]
  • 递归

对于树状结构的数据,最直接的处理方式就是递归

const arr = [1, [1,2], [1,2,3]]
function flat(arr) {
  let result = []
  for (const item of arr) {
    item instanceof Array ? result = result.concat(flat(item)) : result.push(item)
  }
  return result
}

flat(arr) // [1, 1, 2, 1, 2, 3]
  • reduce()递归
const arr = [1, [1,2], [1,2,3]]
function flat(arr) {
  return arr.reduce((prev, cur) => {
    return prev.concat(cur instanceof Array ? flat(cur) : cur)
  }, [])
}

flat(arr)  // [1, 1, 2, 1, 2, 3]
  • 迭代+展开运算符
// 每次while都会合并一层的元素,这里第一次合并结果为[1, 1, 2, 1, 2, 3, [4,4,4]]
// 然后arr.some判定数组中是否存在数组,因为存在[4,4,4],继续进入第二次循环进行合并
let arr = [1, [1,2], [1,2,3,[4,4,4]]]
while (arr.some(Array.isArray)) {
  arr = [].concat(...arr);
}

console.log(arr)  // [1, 1, 2, 1, 2, 3, 4, 4, 4]

相关文章

  • 5种方式实现数组扁平化

    5种方式实现数组扁平化 数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数...

  • Array, Object扁平化

    1. 数组扁平化 数组扁平化就是将多维数组转化为一维数组: 1.1 toString + split 先将数组转化...

  • 『JavaScript专题』之数组扁平化

    JavaScript专题之数组扁平化 扁平化 数组的扁平化,就是将一个嵌套多层的数组 array (嵌套可以是任何...

  • 【重学】数组扁平化,乱序

    目录:数组扁平化数组乱序reduce()的妙用git复习:rebase,cherry-pick (1)数组扁平化 ...

  • 数组扁平化

    数组扁平化的概念 数组扁平化是指将一个多维数组变为一维数组 [1, [2, 3, [4, 5]]] ------...

  • 常用场景(持续更新ing)

    扁平化数组

  • 前面面试题记录

    1.数组扁平化:答案 理解:数组扁平化可以利用apply(默认将数组展开)和扩展运算符(...) 如:[].con...

  • 5种方式实现数组扁平化

    数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数组每一项,若值为数组则递...

  • 数组扁平化

    数组扁平化概念 数组扁平化是指将一个多维数组变为一维数组 实现 1. reduce 遍历数组每一项,若值为数组则递...

  • js经典算法记录

    随机数组洗牌 简单的日期字符串排序 递归实现数组扁平化 极简版数组扁平化 记录数组项重复次数 冒泡排序 快速排序(...

网友评论

    本文标题:数组扁平化

    本文链接:https://www.haomeiwen.com/subject/hutlahtx.html