forEach() creates undefined array (Javascript)

Question

I'm practicing the forEach() construct on simple letter array. I want to convert letters to uppercase and print them to the console. So I've made it work, when I put the console.log() inside the callback function. But why on earth it isn't possible to put the console.log() outside the callback function. It gives an undefined error

This works:

var letters = [ "a","b","c"]; 

var capitalize = function (element,index,array) {

    console.log(element.toUpperCase());

};


letters.forEach(capitalize);

this doesn't work: (it gives undefined)

var letters = [ "a","b","c"]; 

var capitalize = function (element,index,array) {

    return element.toUpperCase();

};


console.log(letters.forEach(capitalize));

forEach doesn't return anything. You should try .map or explicitly insert a return statement. E.g. return element.toUpperCase(); — Daniel Bonnell
– Daniel Bonnell, Commented Oct 8, 2015 at 14:37

Jeff LaFay · Accepted Answer · 2015-10-08 14:39:35Z

1

What you want is map()

var letters = [ "a","b","c"]; 

var capitalize = function (element,index,array) {
    return element.toUpperCase();
};

console.log(letters.map(capitalize));

answered Oct 8, 2015 at 14:39

Jeff LaFay

13.5k14 gold badges74 silver badges102 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Tobias Over a year ago

Ok, this is indeed the answer... but I don't get it can you please explain why console.log(ARRAY.forEach() don't work and console.log(ARRAY.map() works

hic1086 Over a year ago

this will create a new array

Jeff LaFay Over a year ago

It's because foreach doesn't return anything, it just provides a way to iterate through an array and do things. You're not changing assignment of any of the array elements, you're just calling toUpperCase() on each element but not doing anything. map() is meant to return a newly "mapped" array of elements. The function you provide returns the "transformed" array element and pushes it into a new array to be returned once done looping through everything.

hic1086 Over a year ago

the fonction foreach transform your array and return nothing while map creates and return the new array containing the transfomed values.

Daniël J · Accepted Answer · 2015-10-08 14:48:42Z

0

forEach() executes the callback function once for each array element; unlike map() or reduce() it always returns the value undefined and is not chainable.

Source

answered Oct 8, 2015 at 14:48

Daniël J

10710 bronze badges

Collectives™ on Stack Overflow

forEach() creates undefined array (Javascript)

2 Answers 2

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related