Convert Array of Starings to Array of Numbers in JavaScript
This blog will demonstrate the approaches to transform a string’s array into a number’s array using JavaScript.
How to Convert/Transform Array of Strings to Array of Numbers Using JavaScript?
To transform a string’s array into a number’s array using JavaScript, implement the below-stated approaches:
- “map()” method.
- “forEach()” and “push()” methods.
- “reduce()” and “concat()” methods.
Let’s demonstrate the stated methods one by one!
Approach 1: Convert/Transform Array of Strings to Array of Numbers Using JavaScript via map() Method
The “map()” method executes a function once for each array item without any change in the default array. This method can be applied to simply map the string values in the associated array into an array of numbers.
Syntax
In the above-given syntax:
- “func” refers to the function that needs to be called for each item in an array.
- The function parameters refer to the current value’s index in the specified array.
- “value” indicates the value that must be passed to the function.
Example
Let’s overview the following example:
let strArray = ['10', '20', '30'];
console.log("The given array of strings is:", strArray)
let numArray = strArray.map(Number)
console.log("The array of numbers become:", numArray);
</script>
- Declare an array of strings having the stated values and display it.
- After that, apply the “map()” method having “Number” as its parameter, which will transform the associated array of strings into numbers.
- Finally, display the array of strings converted into numbers.
Output
In this output, it can be seen that the string’s array is converted into numbers.
Approach 2: Convert/Transform Array of Strings to Array of Numbers in JavaScript Using forEach() and push() Methods
The “forEach()” method applies a function for each element in an array. The “push()” method is used to add an item in an array at the start. These methods combined can be implemented to iterate along the given string’s array, convert them into numbers and push them into an empty array.
Syntax
Here:
- function: It is the function that needs to be called for each element in an array.
- current: This parameter signifies the current array value.
- index: It points to the current element’s index.
- array: It refers to the current array.
- this: It corresponds to the value being passed to the function.
In this syntax:
- “it1, and “it2” point to the items that need to be added to the array.
Example
Let’s go through the below-stated example:
let strArray = ['20', '40', '60'];
console.log("The given array of strings is:", strArray)
let numArray = [];
strArray.forEach(string => {
numArray.push(Number(string));
});
console.log("The array of numbers become:", numArray);
</script>
In the above lines of code:
- Initialize the array consisting of the stated string values and display it.
- Also, create an empty array named “numArr”.
- In the next step, apply the “forEach()” method to iterate along the values of the associated array.
- After that, the iterated values in the previous step will be converted into numbers via “Number”.
- Now, the “push()” method will append the converted numbers into the allocated empty array, as discussed before.
- Lastly, display the array appended with the numbers.
Output
The above output indicates that the desired requirement is fulfilled.
Approach 3: Convert/Transform Array of Strings to Array of Numbers in JavaScript Using reduce() and concat() Methods
The “reduce()” method calls a function for the elements in an array to give a reduced value, in return. The “concat()” method concatenates/merges multiple arrays or string values. The combination of these methods can iterate along the string’s array, concatenate the values so that they are converted into numbers, and then append them into a separate array.
Syntax
In this particular syntax:
- “func” refers to the function that needs to be called for each array element.
- The function arguments correspond to the current value’s index in the specified array.
- “value” corresponds to the value passed to the function.
In the given syntax:
- “string” represents the string value that needs to be concatenated.
Example
The following example explains the stated concept:
let strArray = ["15", "25", "35", "45"];
console.log("The given array of strings is:", strArray)
let numArray = strArray.reduce( (first, last ) => first.concat(+last), [])
console.log("The array of numbers become:", numArray);
</script>
In the above lines of code:
- Declare the specified string’s array and display it.
- In the next step, apply the “reduce()” and “concat()” methods as a combination.
- This will resultantly iterate along the associated array and concatenate the array items such that they are transformed into numbers.
- Now, the converted numbers in the previous step will be appended into a null array represented by “[ ]”.
- Finally, display the array of appended numbers on the console.
Output
In this particular output, it can be seen that the allocated null array is filled with the numbers.
Conclusion
The “map()” method, the “forEach()” and “push()” methods, or the “reduce()” and “concat()” methods can be used to transform a string’s array to a number’s array in JavaScript. The map() method simply maps the associated array values into numbers. Whereas the other two approaches iterate along the given string’s array, convert them into numbers, and append the converted values into an allocated null array. This tutorial explained to transform a string into a number’s array in JavaScript.
Source: linuxhint.com