JavaScript Fundamentals Array.prototype.map
It all started in the summer of 2020, I was learning how to iterate through arrays, and I discovered for the first time the power of map
. I didn’t fully understand it then, but what I understood was that the .map method was a fundamental and powerful way to iterate through the values in an array. Fast forward several months into my bootcamp at flatiron and I’m building a project for my capstone, and again integrating this familiar method now with less thought into why it’s working, and simply understanding that it just does what it’s supposed to do. I run into some problems, look up solutions and continue to build on my code. Rinse and repeat, rinse and repeat.
Now in the present, I’m tackling code challenges for job interviews and practicing on LeetCode and CodeWars, and I come across a problem, get stuck and for the world, I can’t figure out how to solve this problem. I take a breath, speak my problem into the void, or rather out loud to myself in hopes the solution will come to me. For some clarity, this is the problem I was working on, and in hindsight it was a lot more simple than I was thinking.
function squareDigits(num){
//may the code be with you
}
The task: create a function that takes in a number as an input, iterates through and squares each digit and finally outputs a new number. So for example:
input: 365
// 3**2 = 9
// 6**2 = 36
// 5**2 = 25
output: 93625
My thought process: “I want to isolate each integer in the number and then square it. How do I do this?” Before starting I declare a variable and I call it arr to represent an array, because I know that to alter each number, I’d have to separate the values and then iterate over each item. So to start I convert num
into a string by adding the numbers to an empty string, then I use String.split(‘’) to convert the string into an array. And using the example above, variable arr should look like, [‘3’, ‘6’, ‘5’].
Now since arr is an array, I can use the built in array method, map
to iterate through each value. And the way map works, is we declare a variable inside of map represent each instance of the items we will iterate through inside of the array and in the end return a new array. In this case we will mark each instance variable as number
. We pass number an arrow function and inside of the function we input the conditions or behavior we wish the function to carry out, in this case, we will square the value of number
.
function squareDigits(num){
let arr = (num+"").split('').map(number => (number**2))
}
Looking good so far, but we aren’t done yet. We now need to join and concat all the items in our new array and then convert them from a string back into an integer. There are two ways I went about doing this. The first was a lot easier and the second was a small refactor. For the first solution, I created a new line and joined the items in arr
using the array method, join and wrapped this all inside of the parseInt function. The second solution is exactly the same, but instead of wrapping the arr
variable, I wrap the contents of arr
plus the join method inside of parseInt()
.
solution 1:
return parseInt(arr.join('')) solution 2:
return parseInt((num+"").split('').map(number => (number**2)).join(''))
I look forward to deepening my understanding of JavaScript and I hope this may have been of some help or a review for those comfortable with the fundamentals.