美文网首页
实现数组扁平化的几种方式

实现数组扁平化的几种方式

作者: 浅忆_0810 | 来源:发表于2021-09-16 13:01 被阅读0次

    1. 普通递归实现

    function flatten(arr) {
      let result = [];
    
      for(let i = 0, len = arr.length; i < len; i++) {
        if (Array.isArray(arr[i])) {
          result = result.concat(flatten(arr[i]));
        } else {
          result.push(arr[i]);
        }
      }
    
      return result;
    }
    
    var a = [1, [2, [3, 4, 5]]];
    console.log(flatten(a)) //  [1, 2, 3, 4,5]
    

    2. 利用 reduce 函数迭代

    function flatten(arr) {
      return arr.reduce((prev, next) => (
        prev.concat(
          Array.isArray(next) ? flatten(next) : next
        )
      ), [])
    }
    

    3. 扩展运算符实现

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

    先用数组的 some 方法把数组中仍然是组数的项过滤出来,然后执行 concat 操作,利用 ES6 的展开运算符,将其拼接到原数组中,最后返回原数组


    4. splittoString 共同处理

    function flatten(arr) {
      return arr.toString().split(',');
    }
    

    5. 调用 ES6中的 flat

    arr.flat([depth]):其中 depth 是 flat 的参数,depth 是可以传递数组的展开深度(默认不填、数值是 1),即展开一层数组

    function flatten(arr) {
      return arr.flat(Infinity);
    }
    

    6. 正则和 JSON 方法共同处理

    function flatten(arr) {
      let str = JSON.stringify(arr);
      str = str.replace(/(\[|\])/g, '');
      str = `[${str}]`;
    
      return JSON.parse(str); 
    }
    

    其中先把传入的数组转换成字符串,然后通过正则表达式的方式把括号过滤掉

    通过这个在线网站 https://regexper.com/ 可以把正则分析成容易理解的可视化的逻辑脑图。其中我们可以看到,匹配规则是:全局匹配(g)左括号或者右括号,将它们替换成空格,最后返回处理后的结果。之后拿着正则处理好的结果重新在外层包裹括号,最后通过 JSON.parse 转换成数组返回


    7. 总结

    方法 实现难度 编码思路
    递归实现 递归实现,返回新数组
    reduce实现 reduce进行累计操作
    扩展运算符实现 筛选出数组进行连接
    splittoString 转成字符串再转数组
    flat方法 特定功能方法直接操作
    正则和 JSON 方法 JSON方法转成字符串转回过程中正则处理

    相关文章

      网友评论

          本文标题:实现数组扁平化的几种方式

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