lodash源码分析每日一练 - 数组 - flatten / flattenDeep / flattenDepth

今日分享:

每一步都是曼妙的风景~

__.flatten(array)

使用:

减少一级array嵌套深度

使用示例:

js 复制代码
_.flatten([1, [2, [3, [4]], 5]]);
// => [1, 2, [3, [4]], 5]

尝试手写:

①修改原数组;②数组减少一级嵌套深度;③ 合并能力,可以减少n层嵌套深度

js 复制代码
    let flatten_arr=[1, [2,[3 ,[4]],5]];
    function my_flatten(arr) {
        if(arr.length === 0) { return arr };
        if(arr instanceof Array) {
            let newArr = [];
            for(let i = 0; i< arr.length; i++) {
                if(arr[i] instanceof Array) {
                    for(var j = 0; j < arr[i].length; j++) {
                        newArr.push(arr[i][j])
                    }
                }else{
                    newArr.push(arr[i])
                }
            }
            arr = newArr
        }
        return arr;
    }
    console.log(my_flatten(flatten_arr)); // [1,2,[3,[4]],5]

源码方案:

js 复制代码
function flatten(array) {
  var length = array == null ? 0 : array.length;
  return length ? baseFlatten(array, 1) : [];
}

function baseFlatten(array, depth, predicate, isStrict, result) {
  var index = -1,
      length = array.length;

  predicate || (predicate = isFlattenable);
  result || (result = []);

  while (++index < length) {
    var value = array[index];
    if (depth > 0 && predicate(value)) {
      if (depth > 1) {
        // 如果是多层级或直接拍平,递归调用自身即可完成
        baseFlatten(value, depth - 1, predicate, isStrict, result);
      } else {
        arrayPush(result, value);
      }
    } else if (!isStrict) {
      result[result.length] = value;
    }
  }
  return result;
}

类似方法

_.flattenDeep

将array递归为一维数组。

使用示例:

js 复制代码
_.flattenDeep([1, [2, [3, [4]], 5]]);
// => [1, 2, 3, 4, 5]

源码方案:

js 复制代码
function flattenDeep(array) {
  var length = array == null ? 0 : array.length;
  return length ? baseFlatten(array, INFINITY) : [];
}
_.flattenDepth

根据 depth 递归减少 array 的嵌套层级

使用示例:

js 复制代码
var array = [1, [2, [3, [4]], 5]];
 
_.flattenDepth(array, 1);
// => [1, 2, [3, [4]], 5]
 
_.flattenDepth(array, 2);
// => [1, 2, 3, [4], 5]

源码方案:

js 复制代码
function flattenDepth(array, depth) {
  var length = array == null ? 0 : array.length;
  if (!length) {
    return [];
  }
  depth = depth === undefined ? 1 : toInteger(depth);
  return baseFlatten(array, depth);
}

总结

总的来说还是循环+递归调用的方式,实现深层拍平。取值然后push到新数组即可。

相关推荐
码云数智-大飞5 分钟前
分布式数据库:2026年数据架构的基石与挑战
开发语言
OpenTiny社区5 分钟前
WebMCP + WebSkills:企业级智能化页面操控方案,兼顾隐私安全与高效落地!
前端·ai编程·mcp
酉鬼女又兒10 分钟前
零基础快速入门前端JavaScript四大核心内置对象:Math、Date、String、Array全解析(可用于备赛蓝桥杯Web应用开发)
前端·javascript·css·蓝桥杯·前端框架·js
__sgf__14 分钟前
ES11(ES2020)新特性
前端·javascript
查古穆18 分钟前
python进阶-推导式
开发语言·python
njidf26 分钟前
C++中的访问者模式
开发语言·c++·算法
__sgf__29 分钟前
ES8(ES2017)新特性
前端·javascript
__sgf__32 分钟前
ES9(ES2018)新特性
前端·javascript
送鱼的老默37 分钟前
学习笔记--vue3 watchEffect监听的各种姿势用法和总结
前端·vue.js
你挚爱的强哥38 分钟前
解决:动态文本和背景色一致导致文字看不清楚,用js获取背景图片主色调,并获取对比度最大的hex色值给文字
前端·javascript·github