当前位置:首页 > JavaScript

js flat 实现

2026-02-01 17:37:08JavaScript

实现数组扁平化的方法

在 JavaScript 中,数组扁平化是指将多维数组转换为一维数组的过程。以下是几种常见的实现方法。

使用递归实现

通过递归遍历数组的每个元素,如果元素是数组则继续递归,否则将元素添加到结果数组中。

function flatten(arr) {
  let result = [];
  arr.forEach(item => {
    if (Array.isArray(item)) {
      result = result.concat(flatten(item));
    } else {
      result.push(item);
    }
  });
  return result;
}

const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flatten(nestedArray)); // [1, 2, 3, 4, 5]

使用 reduce 实现

利用 reduce 方法遍历数组,递归处理嵌套数组。

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

const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flatten(nestedArray)); // [1, 2, 3, 4, 5]

使用 ES6 flat 方法

ES6 提供了 flat 方法,可以指定扁平化的深度。默认深度为 1,使用 Infinity 可以完全扁平化。

const nestedArray = [1, [2, [3, [4]], 5]];
console.log(nestedArray.flat(Infinity)); // [1, 2, 3, 4, 5]

使用栈实现

通过栈结构迭代处理数组元素,非数组元素直接压入结果,数组元素则展开后继续处理。

function flatten(arr) {
  const stack = [...arr];
  const result = [];
  while (stack.length) {
    const next = stack.pop();
    if (Array.isArray(next)) {
      stack.push(...next);
    } else {
      result.push(next);
    }
  }
  return result.reverse();
}

const nestedArray = [1, [2, [3, [4]], 5]];
console.log(flatten(nestedArray)); // [1, 2, 3, 4, 5]

使用生成器实现

通过生成器函数递归遍历数组,生成扁平化后的序列。

js flat 实现

function* flatten(arr) {
  for (const item of arr) {
    if (Array.isArray(item)) {
      yield* flatten(item);
    } else {
      yield item;
    }
  }
}

const nestedArray = [1, [2, [3, [4]], 5]];
console.log([...flatten(nestedArray)]); // [1, 2, 3, 4, 5]

以上方法各有优缺点,可以根据具体场景选择最适合的实现方式。递归和 reduce 方法简洁但可能受调用栈限制,flat 方法最直接但需要现代浏览器或环境支持,栈和生成器方法适合处理大规模数据。

标签: jsflat
分享给朋友:

相关文章

jquery js

jquery js

jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。它兼容多种浏览器,提供易于使用的 API,使开发者能够更高…

js实现游标

js实现游标

使用JavaScript实现游标 在JavaScript中,可以通过操作DOM元素的cursor样式属性来实现自定义游标效果。以下是几种常见的实现方法: 修改默认鼠标指针样式 通过CSS的curso…

js实现图

js实现图

JavaScript 实现图的常用方法 在 JavaScript 中,图(Graph)可以通过多种方式实现,常见的包括邻接表(Adjacency List)和邻接矩阵(Adjacency Matrix…

js实现滚动

js实现滚动

实现滚动效果的方法 在JavaScript中实现滚动效果可以通过多种方式完成,以下是一些常见的方法: 使用window.scrollTo() window.scrollTo()方法可以将页面滚动到指…

js实现上传文件

js实现上传文件

文件上传的基本实现 使用HTML的<input type="file">元素配合JavaScript的File API可以实现文件上传功能。 <input type="file"…

js实现按钮点击

js实现按钮点击

实现按钮点击的JavaScript方法 HTML按钮元素 在HTML中创建按钮元素,为其添加id或class以便JavaScript选择: <button id="myButton">点…