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

{{EmbedInteractiveExample("pages/js/array-flatten.html")}}

The source for this interactive example is stored in a GitHub repository. If you'd like to contribute to the interactive examples project, please clone https://github.com/mdn/interactive-examples and send us a pull request.

## 语法

    var newArray = arr.flat(depth)

### 参数

`depth` 可选
  指定要提取嵌套数组的结构深度，默认值为 1。

### 返回值

一个包含将数组与子数组中所有元素的新数组。

## 示例

### 扁平化嵌套数组

    var arr1 = [1, 2, [3, 4]];
    arr1.flat();
    // [1, 2, 3, 4]

    var arr2 = [1, 2, [3, 4, [5, 6]]];
    arr2.flat();
    // [1, 2, 3, 4, [5, 6]]

    var arr3 = [1, 2, [3, 4, [5, 6]]];
    arr3.flat(2);
    // [1, 2, 3, 4, 5, 6]

    //使用 Infinity 作为深度，展开任意深度的嵌套数组
    arr3.flat(Infinity);
    // [1, 2, 3, 4, 5, 6]

### 扁平化与空项

`flat()` 方法会移除数组中的空项:

    var arr4 = [1, 2, , 4, 5];
    arr4.flat();
    // [1, 2, 4, 5]

## 替代方案

### 使用 `reduce` 与 `concat`

    var arr1 = [1, 2, [3, 4]];
    arr1.flat();

    // 反嵌套一层数组
    arr1.reduce((acc, val) => acc.concat(val), []);// [1, 2, 3, 4]

    // 或使用 ...
    const flatSingle = arr => [].concat(...arr);

    // 使用 reduce、concat 和递归无限反嵌套多层嵌套的数组
    var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];

    function flattenDeep(arr1) {
       return arr1.reduce((acc, val) => Array.isArray(val) ? acc.concat(flattenDeep(val)) : acc.concat(val), []);
    }
    flattenDeep(arr1);
    // [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

    // 不使用递归，使用 stack 无限反嵌套多层嵌套数组
    var arr1 = [1,2,3,[1,2,3,4, [2,3,4]]];
    function flatten(input) {
      const stack = [...input];
      const res = [];
      while (stack.length) {
        // 使用 pop 从 stack 中取出并移除值
        const next = stack.pop();
        if (Array.isArray(next)) {
          // 使用 push 送回内层数组中的元素，不会改动原始输入 original input
          stack.push(...next);
        } else {
          res.push(next);
        }
      }
      // 使用 reverse 恢复原数组的顺序
      return res.reverse();
    }
    flatten(arr1);// [1, 2, 3, 1, 2, 3, 4, 2, 3, 4]

//=> [1, 2, 3, 4, 5, 6, 7, 8, 9]

## 规范

规范 | 状态 | 说明
--- | --- | ---
`Array.prototype.flat` proposal | Finished (4) |

## 浏览器兼容性

The compatibility table in this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.

Update compatibility data on GitHub

| Desktop | Mobile | Server
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | Android webview | Chrome for Android | Edge Mobile | Firefox for Android | Opera for Android | Safari on iOS | Samsung Internet | Node.js
`flat` | Chrome Full support 69 | Edge No support No | Firefox Full support 62 | IE No support No | Opera Full support 56 | Safari Full support 12 | WebView Android Full support 69 | Chrome Android Full support 69 | Edge Mobile No support No | Firefox Android Full support 62 | Opera Android Full support 56 | Safari iOS Full support 12 | Samsung Internet Android No support No | nodejs Full support 11.0.0

### Legend

Full support
  Full support
No support
  No support

## 参见

- `Array.prototype.flatMap()`
- `Array.prototype.map()`
- `Array.prototype.reduce()`
- `Array.prototype.concat()`