Javascript return variables from each function

Question

Looping through children elements using each.

var divHeights = [];  
$('#parent').children('div').each(function () {  
     divHeights.push(this.clientHeight);    
});  
alert(divHeights);  // fails

How can I return the divHeights variable?

I've tried
var hts = ('#parent').children('div').each(function () { ...
but obviously that won't work.

divHeights should contain them after the .each statement. So just use it afterwards. — MinusFour
– MinusFour, Commented Aug 24, 2015 at 16:35
return divHeights; after the loop. What's not working about that? — Marc
– Marc, Commented Aug 24, 2015 at 16:35
where in your code are you failing to access divHeights? When I run it, divHeights gets filled in as expected — Wolf
– Wolf, Commented Aug 24, 2015 at 16:36
You are already adding the heights to the array. You have access to all of the heights at that point. — idream1nC0de
– idream1nC0de, Commented Aug 24, 2015 at 16:36

palaѕн · Accepted Answer · 2015-08-24 16:51:24Z

3

You can do this in better way using .map() like:-

var divHeights = $('#parent').children('div').map(function () {
    return this.clientHeight || 0;
}).get();

DEMO FIDDLE

edited Aug 24, 2015 at 16:51

answered Aug 24, 2015 at 16:37

palaѕн

74.2k17 gold badges123 silver badges140 bronze badges

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

Comments

Guffa · Accepted Answer · 2015-08-24 16:42:33Z

1

The divHeights variable is available all the time. You can just assign it to a variable whenever you want:

var hts = divHeights;

This will just be another reference to the array, so you can do that any time after the array is created, even before you have put any values into it:

var divHeights = [];  
var hts = divHeights;
$('#parent').children('div').each(function () {  
  divHeights.push(this.clientHeight);    
});

You can of couse just use the variable divHeights instead of the variable hts when you want to use the result, or just use the variable hts instead of divHeights from start.

answered Aug 24, 2015 at 16:42

Guffa

703k111 gold badges760 silver badges1k bronze badges

Comments

dhouty · Accepted Answer · 2015-08-24 16:40:19Z

0

You could make it into a function like this:

function getHeights() {
    return $('#parent div').map(function() {
        return this.clientHeight;
    });
}

Then you can just call the function wherever you like to get the array contents.

answered Aug 24, 2015 at 16:40

dhouty

1,98912 silver badges21 bronze badges

Collectives™ on Stack Overflow

Javascript return variables from each function

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related