const animals = ['panda', 'turtle', 'giraffe', 'hippo', 'sloth', 'human'];
const convertToBaby = animals.map((element)=>{
let newArr = [];
return newArr.push('baby '+element);
}
);
console.log(convertToBaby);
Output: [ 1, 1, 1, 1, 1, 1 ]
The expected following output: ['baby panda','baby turtule', and so on...]
The .push() method returns the length of the array after the new element is added to it. It doesn't return the newly modified array. Since you create a new array each time your callback is executed, the new length after pushing to it will always be 1. Instead, to correctly map your animals, you can return the new element you wish to map the current element to that you're iterated on:
const animals = ['panda', 'turtle', 'giraffe', 'hippo', 'sloth', 'human'];
const convertToBaby = animals.map((element) => {
return 'baby ' + element;
});
console.log(convertToBaby);As you're only returning within the arrow function's body, you can also simplify it by removing the body and implicitly returning the newly mapped value:
const convertToBaby = animals.map(element => 'baby ' + element);
map using the implicit return of the arrow function to .map(element => "baby " + element);
const animals = ['panda', 'turtle', 'giraffe', 'hippo', 'sloth', 'human'];
const convertToBaby = animals.map((element)=>{
return 'baby '+element;
}
);
console.log(convertToBaby);
This should work.
