flat()

M.Dev's avatar
M.Dev's avatar
M.Dev
Published Jun 20, 2025
Contribute to Docs

The flat() method creates a new array with sub-array elements concatenated into it up to the specified depth. It is a non-mutating method, meaning it returns a new array without modifying the original one.

Syntax

array.flat(depth);

Parameters:

  • depth (optional): The number of levels to flatten. Defaults to 1. Use Infinity to flatten all nested arrays completely.

Return value:

A new array with the sub-array elements flattened up to the specified depth. The original array remains unchanged.

Example 1: Using flat() With Default Value

This example demonstrates using flat() with the default depth of 1:

const arr = [1, 2, [3, 4]];
console.log(arr.flat());

The output of this code is:

[1, 2, 3, 4]

arr.flat() flattens one level deep, so the nested array [3, 4] is unpacked into the main array.

Example 2: Using flat() on Deeper Nested Arrays

This example demonstrates using flat() with the default depth of 1, with multiple layers of nested sub-arrays:

const arr = [1, 2, 3, [4, 5, [6, 7]]];
console.log(arr.flat());

The output of this code is:

[1, 2, 3, 4, 5, [6, 7]]

arr.flat() flattens the array one level deep. It unpacks the first-level nested array [4, 5, [6, 7]], moving its elements into the main array. However, the inner array [6, 7] remains nested at a deeper level.

Example 3: Using flat() with a Specified Depth

This example demonstrates using flat() with a depth of 2, applied to an array with multiple layers of nested sub-arrays:

const arr = [1, 2, 3, [4, 5, [6, 7]]];
console.log(arr.flat(2));

The output of this code is:

[
  1, 2, 3, 4,
  5, 6, 7
]

arr.flat(2) flattens the array two levels deep. First, it unpacks the first-level nested array [4, 5, [6, 7]], moving its elements into the main array. Then, the inner array [6, 7] is unpacked, resulting in an entirely flattened array with no nested sub-arrays.

Example 4: Using flat() with Infinity Depth

This example demonstrates using flat() with a depth of Infinity, which fully flattens an array no matter how deeply nested its sub-arrays are:

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

The output of this code is:

[1, 2, 3, 4, 5]

arr.flat(Infinity) recursively flattens the array to its deepest level. All nested sub-arrays, no matter how deeply they are nested, are unpacked into a single flat array. This is useful when the depth of nesting is unknown or highly variable.

Example 5: Using flat() on Sparse Arrays with Empty Slots

This example demonstrates using flat() on sparse arrays:

const arr = [1, 2, , [4, , 6], 7];
console.log(arr.flat());

The output of the code is:

[1, 2, 4, 6, 7]

flat() removes empty slots (holes) in sparse arrays during flattening, treating them as if they don’t exist.

Example 6: Flattening Arrays with Mixed Element Types

The flat() method only flattens nested arrays. Elements that are not arrays remain the same:

const arr = [1, 'hello', [2, 3], { a: 4 }];
console.log(arr.flat());

The output of the code is:

[1, "hello", 2, 3, { a: 4 }]

Codebyte Example

The following code demonstrates how different .flat() depths affect an array:

Code
Output
Loading...


All contributors
Contribute to Docs
Learn JavaScript on Codecademy