Mapping an array to a new array with default values in JavaScript

In the given problem statement we are required to map an array to a new array with default values with the help of javascript functionalities. In Javascript we have some built−in function to map an array to a new array as per the condition and requirement.

What is an array in Javascript ?

An array is a collection of similar data elements under one roof. So let's understand the overall working process of arrays in JavaScript. An array is an object that contains one or more elements.


const arr = ['A', 'B', 'C', 'D'];



[ 'A', 'B', 'C', 'D' ]

What is the mapping of an array ?

Mapping of an array means in simple terms is creating a new array by using the values of the input array with the help of some predefined methods in Javascript. This process is called mapping. In this process each array item is used to create a new item in a newly created array by using some logic or function.

To map all the elements of the array we usually use map() function which is a Javascript’s function. In the overall procedure the original array does not affect its size or value. And the new array also has the same length as the input array.

Logic for The Above Problem

The easiest way to manipulate the given string with the help of Javascript’s predefined functions.

So let’s examine the logic for the given problem statement. The term mapping an array into a new array with the help of default values of input array we will use map function. And inside the map function we will provide some logic to create new array’s items. The map function will iterate each element of the input array and execute a new item while making some calculations provided inside the function. After creating a new item we will push every item to the new array and in the end we will return the value of the new array.

For example, If we have an array of some integer numbers and we want to make the default values 0 for the given null or undefined items.


const digits = [1, 2, null, 3, undefined, 4];
const defaultValues = (num) => num || 0;
const newArray =;


[1, 2, 0, 3, 0, 4]


Step 1: Since we are aware that we need to map one array to another or create a new array, we will need to define arrays in order to carry out this procedure. arr1 and arr2

Step 2: Now we must use the elements of the previous array to create a new array. As a result, we are utilizing the callback function Array.from in order to resolve the problem statement above. By multiplying each item by 2, this function will take arr1 and calculate new items.

Step 3: Very much like the above step, we will see the utilization of guide capability. By taking the square root of the elements in the input array, this function will iterate through each item and calculate the items in the new array.

Step 4: The "from" method is used in the final example, which creates a new array with 0 values and a length of 5.


// define arrays arr1 and arr2 for checking different methods
const arr1 = [1, 2, 3];
const arr2 = [4, 9, 16, 25];

const newarr1 = Array.from(arr1, x => x * 2);

const newarr2 =;

const arr3 = Array.from({length: 5}, () => 0);


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


As we have seen different techniques for mapping an array to a new array by the default values of input array. All the methods and techniques required O(n) time to complete execution and produce the required result.


In this code we have implemented different mapping techniques with the help of javascript’s map functions. And we have also seen that these methods are not very efficient in terms of larger array objects. And lastly calculated the time complexity for all the methods is O(n), where n is the size of the input array.

Updated on: 23-Aug-2023


Kickstart Your Career

Get certified by completing the course

Get Started