javascript
  1. javascript-flat

#JavaScript flat()

The flat() method is an in-built JavaScript array method that can be used to create a new array that is flattened from a multi-dimensional array. It returns a new array that is a one-dimensional flattened version of the original array. This method can be useful when working with data arrays in JavaScript.

Syntax

The basic syntax of the flat() method is as follows:

array.flat(depth);

Where array is the array to be flattened and depth is an optional parameter that specifies the maximum nested depth to flatten the array to.

Example

Let's consider an example where we have to flatten an array:

let multiDimensionalArray = [1, 2, [3, 4, [5, 6]]];

let flattenedArray = multiDimensionalArray.flat();

console.log(flattenedArray); // [1, 2, 3, 4, 5, 6]

In the above example, the flat() method is used on the multiDimensionalArray to return a new one-dimensional array, flattenedArray.

Output

The output of the above example will be as follows:

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

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Flat Array Example</title>
</head>
<body>

<script>
    // Multi-dimensional array
    let multiDimensionalArray = [1, 2, [3, 4, [5, 6]]];

    // Use the flat method to flatten the array
    let flattenedArray = multiDimensionalArray.flat();

   

    // Log the flattened array
    document.write("<p>Flattened Array: " + flattenedArray.join(", ") + "</p>");

    // If you want to display the flattened array using console.log, you can use the following:
    console.log("Flattened Array:", flattenedArray);
</script>

</body>
</html>
Try Playground

Explanation

The flat() method takes the original multi-dimensional array and flattens it to a one-dimensional array by combining all the elements of the subarray into a larger, single array.

Use

The flat() method can be used for a variety of applications, Including:

  • Flattening a multi-dimensional array of data into a single array.
  • Doubling up the dimensions of an array by adding empty array elements.
  • Converting complex data structures into simpler ones.
  • Removing any empty values or null elements from an array.

Important Points

The following are some important points to consider while using the flat() method:

  • If no argument is passed to the flat() method, it by default flattens the array to a depth of 1.
  • Negative values of depth are treated as if 0 was passed and returns an exact copy of the input array.
  • The flat() method does not modify the original array, instead, it creates a new flattened array based on the original.

Summary

The flat() method is a powerful JavaScript array method used to flatten multi-dimensional arrays into a one-dimensional array. Providing an optional depth parameter, it can transform the original array structure into a new structured array, adding duplicate empty array elements if required. The flat() method is useful to convert complex data structures into simpler ones.

Published on: