JavaScript Array flat() Method

Beginner
5 min read
Updated: Nov 2026
3 examples
Array

Definition

Array.prototype.flat(depth) returns a new array with nested arrays pulled up. Default depth is 1. Use a larger number or Infinity for deeper nests. It does not mutate the original (ES2019).

Remember
array.flat(depth = 1)

[1, [2, 3]].flat()           → [1, 2, 3]
[1, [2, [3]]].flat()         → [1, 2, [3]]
[1, [2, [3]]].flat(2)        → [1, 2, 3]
[1, [2, [3]]].flat(Infinity) → [1, 2, 3]

returns a new array — original unchanged

Syntax

Call array.flat. Start with this line.

JavaScript
array.flat(depth = 1)
CallWhat it does
array.flat(depth = 1)Primary signature.
array.flat(...)Call with the arguments your case needs.

Built into JavaScript. Call flat(...) on an array instance — no import required.

Library declarations
JavaScript
array.flat(depth = 1)

Parameters

ParameterDescription
ArrayRequired. Source that may be nested
depthOptional. How many nesting levels to unwrap

Return Value

Return ValueDescription
*New flattened array

JavaScript Examples

Example 1 — Default Depth (1)

One call unwraps a single nesting level.

JavaScript
const nested = [1, [2, 3], 4];

console.log(nested.flat());
// [1, 2, 3, 4]
Try It Yourself

How It Works

  1. Start nested. [2, 3] is one level deep.
  2. Default depth. flat() means flat(1).
  3. Unwrap once. The inner array’s items move up beside 1 and 4.
  4. New array. You get a fresh list; nested is unchanged.

Example 2 — Custom Depth and Infinity

Deeper nests need a larger depth—or flatten everything at once.

JavaScript
const nested = [1, [2, [3, [4]]]];

console.log(nested.flat(2));
// [1, 2, 3, [4]]

console.log(nested.flat(Infinity));
// [1, 2, 3, 4]
Try It Yourself

How It Works

  1. Depth 2. Unwraps two levels → [4] still remains nested.
  2. Infinity. Keeps going until no array nesting is left.
  3. Pick by shape. Known depth → a number; unknown depth → Infinity.
  4. Cost note. Full flattening walks the whole structure—fine for normal data.

Example 3 — Original Array Stays Intact

Prove flat() returns a copy and does not mutate the source.

JavaScript
const nested = [1, [2, 3]];
const flatCopy = nested.flat();

console.log(flatCopy);  // [1, 2, 3]
console.log(nested);    // [1, [2, 3]]
Try It Yourself

How It Works

  1. Call flat. Builds a new array into flatCopy.
  2. Source unchanged. nested still holds [2, 3] inside.
  3. Safe for pipelines. You can flatten without side effects.
  4. Assign the result. Ignoring the return value means you never see the flat list.

Browser & Runtime Support

Array.prototype.flat() is part of ES2019. It has been widely available in evergreen browsers since 2018–2019; Node.js added it in version 11.

✓ Baseline · ES2019

Array.prototype.flat()

Supported in Chrome 69+, Firefox 62+, Safari 12+, Edge 79+, and Node 11+. Not available in Internet Explorer.

97% Modern browser support
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Bun Supported · JavaScript runtime
Supported
Deno Supported · JavaScript runtime
Supported
Node.js Supported · Server runtime
Supported
Android WebView Supported · Modern WebView
Full support
Array.flat() Excellent

Bottom line: Safe for modern web apps and current Node releases. For IE11, feature-detect with if ("flat" in Array.prototype) and use a polyfill or a recursive helper.

Frequently Asked Questions

flat() creates a new array by flattening nested sub-arrays. By default it flattens one level. You can pass a depth number or Infinity to flatten deeper.
No. flat() always returns a new array. The nested source array is not modified.
The default depth is 1, meaning one level of nesting is removed. Deeper nested arrays stay nested unless you pass a higher depth.
Infinity tells flat() to keep flattening until no nested arrays remain. Useful for irregular nesting depths.
No. flat() only flattens array elements. Objects, strings, and numbers are copied into the result as-is.
flat() is an ES2019 feature. It works in all modern browsers and Node.js 11+. Internet Explorer does not support it.

Next: flatMap()

Learn how to map and flatten one level in a single pass.

flatMap() tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

11 people found this page helpful