Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

JavaScript | array.flatMap()

  • Last Updated : 29 Oct, 2021

The array.flatMap() is an inbuilt function in JavaScript which is used to flatten the input array element into a new array. 
This method first of all map every element with the help of mapping function, then flattens the input array element into a new array. 
Syntax: 
 

var A = array.flatMap(function callback(current_value, index, Array))
{
    // It returns the new array's elements.
}

Parameters: 
 

  1. current_value: It is the input array elements.
  2. index:
    • It is optional.
    • It is the index of the input element.
  3. Array: 
    • It is optional.
    • It is used when array map is called.

Return Values: It returns a new array whose elements are the return value of the callback function. 
JavaScript code to show the functionality of the above function: 
Code #1:

javascript




<script>
 
// Taking input as an array A having some elements.
var A = [ 1, 2, 3, 4, 5 ];
 
// Mapping with map function.
b = A.map(x => [x * 3]);
document.write(b);
 
// Mapping and flatting with flatMap() function.
c = arr1.flatMap(x => [x * 3]);
document.write(c);
 
// Mapping and flatting with flatMap() function.
d = arr1.flatMap(x => [[ x * 3 ]]);
document.write(d);
</script>

Output: 
 



[[3], [6], [9], [12], [15]]
[3, 6, 9, 12, 15]
[[3], [6], [9], [12], [15]]

Code #2: This flatting can also be done with the help of reduce and concat. 
 

javascript




<script>
 
// Taking input as an array A having some elements.
var A = [ 1, 2, 3, 4, 5 ];
array.flatMap(x => [x * 3]);
 
// is equivalent to
b = A.reduce((acc, x) => acc.concat([ x * 3 ]), []);
document.write(b);
</script>

Output: 
 

[3, 6, 9, 12, 15]

Supported Browser:

  • Google Chrome 69 and above
  • Edge 79 and above
  • Firefox 62 and above
  • Opera 56 and above
  • Safari 12 and above

Note: This function is available in Firefox Nightly only.
 




My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!