Issue with variable being undefined

Question

I've created a function that loops through a set of products, and sets the height of their copy area to the height of the tallest copy area in that set.

Here's my code:

function productCopyHeight(){
    //make sub range product text sections the same height
    if($('.sub-range').length){
        $('.sub-range').each(function(){
            var itemHeight = 0;
            $(this).children('.product-item').children('.copy').each(function(i){
                var thisItemHeight = $(this).height();
                console.log(thisItemHeight + ' > ' + itemHeight)

                if(thisItemHeight > itemHeight){
                    var itemHeight = thisItemHeight;
                }

            });
            $(this).children('.product-item').children('.copy').css('height', itemHeight);
        })
    }

}

When I log it it shows the itemHeight variable as undefined when it is defined before the each loop.

What line is it saying that itemHeight is undefined?

krillgar
– krillgar

2015-03-07 22:31:55 +00:00
Commented Mar 7, 2015 at 22:31 — krillgar
– krillgar, Commented Mar 7, 2015 at 22:31
And what is the output of the console.log?

JCOC611
– JCOC611

2015-03-07 22:33:22 +00:00
Commented Mar 7, 2015 at 22:33 — JCOC611
– JCOC611, Commented Mar 7, 2015 at 22:33
The console output is '44 > undefined'

Forxs
– Forxs

2015-03-07 22:34:10 +00:00
Commented Mar 7, 2015 at 22:34 — Forxs
– Forxs, Commented Mar 7, 2015 at 22:34

Guffa · Accepted Answer · 2015-03-07 22:34:34Z

1

That's because you are declaring another variable by the same name inside the callback for the inner each. Here:

if(thisItemHeight > itemHeight){
  var itemHeight = thisItemHeight;
}

That variable is different from the variable before the loop, and that variable is also hoisted to the top of the function. The variable has the value undefined because you use it before you assign a value to it.

You should use the variable that you already have instead of creating another one:

if(thisItemHeight > itemHeight){
  itemHeight = thisItemHeight;
}

answered Mar 7, 2015 at 22:34

Guffa

703k111 gold badges760 silver badges1k bronze badges

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

3 Comments

Forxs Over a year ago

Thanks for that, it is very obvious now I have the answer, facepalm. Though now the console is outputting '22 > 0, 44 > 22, 44 > 0'

Guffa Over a year ago

@Forxs: That looks correct if you have two iterations in the outer loop. What result did you expect?

Forxs Over a year ago

Ignore that, it's just poor logic now - the variable needs to be set before the previous .each. Thanks for your help

Collectives™ on Stack Overflow

Issue with variable being undefined

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related