Variable doesn't change even though I can return the updated value

Question

I have this code:

var playySlideNumber = "1";
var run = function playSlides (playySlideNumber){
    $(".slider.secondLayer").css("opacity", "0");
    $(".slider.secondLayer.n"+playySlideNumber).css("opacity", "1");
    if  (playySlideNumber < 5) {
        playySlideNumber = parseInt(playySlideNumber) + 1;
    } else {playySlideNumber = "1"}
    return playySlideNumber
}
setInterval(function(){run(playySlideNumber)}, 3000);

I need that function playySlides() returns playySlideNumber so that every time the setInterval runs it has the correct playySlideNumber. The problem is that playySlideNumber keeps constant = "1".

Also, would it be easier to use a setTimeout that recursively calls playySlides()?

Nowhere do you update the global `playySlideNumber` variable, which is why it stays at 1. — Raymond Chen, May 13 '16 at 14:18
@RaymondChen - it does: `playySlideNumber = parseInt(playySlideNumber) + 1;` — James Hyde, May 13 '16 at 14:19
@JamesHyde Nope, that's the parameter `playySlideNumber`. This code is confusing because it has a global variable with the same name as a parameter. — Raymond Chen, May 13 '16 at 14:20
Change the name of the argument inside of the function so that it doesn't match the global variable. Then you can change the global from within. — Jonathan Gray, May 13 '16 at 14:22
Or get rid of the parameter entirely and just operate on the global directly. — Raymond Chen, May 13 '16 at 14:23
You can also use `window.playySlideNumber` to reference the global without changing the parameter name. — Jonathan Gray, May 13 '16 at 14:24
I don't care with down votes but if someone reads the comments will see that this is not as immediate/easy as some might think. Down voting makes this appear a stupid question when it's not. — Paulo Janeiro, May 13 '16 at 14:26
@JonathanGray: Not when it runs repeatedly in the `setInterval` callback? — Bergi, May 13 '16 at 14:31
@Bergi actually you're right I wasn't looking at the code when I replied and the way it's coded... Yeah you're right that would work. — Jonathan Gray, May 13 '16 at 14:35

score 2 · Accepted Answer · answered May 13 '16 at 14:23

You need to remove the argument because it's overshadow the the global variable and don't need to return value from run function because it's not used anywhere:

var playySlideNumber = "1";
var run = function playSlides(){
    $(".slider.secondLayer").css("opacity", "0");
    $(".slider.secondLayer.n"+playySlideNumber).css("opacity", "1");
    if  (playySlideNumber < 5) {
        playySlideNumber = parseInt(playySlideNumber) + 1;
    } else {playySlideNumber = "1"}
}
setInterval(run, 3000);

Why the downvote? This is a correct answer. +1 from me – Jonathan Gray May 13 '16 at 14:25 — Jonathan Gray, May 13 '16 at 14:25

score -2 · Answer 2 · answered May 13 '16 at 14:27

-2

The problem is that the first time this code runs, playSlideNumber is a string, then you try to evaluate if it is less than 5 but it will never be so, so it goes in the else branch which puts "1" (a string) back into your variable.

answered May 13 '16 at 14:27

Benjamin Racette

172
6

This is wrong. I did downvote this one. Strings can be compared like numbers. That's not what the issue is. – Jonathan Gray May 13 '16 at 14:28

Variable doesn't change even though I can return the updated value

2 Answers2