Function call using single quotes vs no quotes

Question

The following pieces of code uses the function setInterval() to continually update a 'clock'. The only difference is in the function call setInterval().

When I change the setInterval argument from

setInterval('updateTime()',1000);

to

setInterval(updateTime(),1000);

[from single to no quotes], it does not work. Can anyone explain this to me?

Single Quotes:

<head>
    <script>
        function updateTime(){
            var today = new Date();
            var h = today.getHours();
            var m = today.getMinutes();
            var s = today.getSeconds();
            var now= h+':'+m+':'+s;
            document.getElementById('timer').innerHTML = h+':'+m+':'+s;//set the text in 'timer' id below to the date
            setInterval('updateTime()', 1000); //////SEE THIS LINE//////
        }
    </script>
</head>
<body>
    <p id='timer'> Time </p>
    <script>
        updateTime();
    </script>
</body>

No Quotes:

<head>
    <script>
        function updateTime(){
            var today = new Date();
            var h = today.getHours();
            var m = today.getMinutes();
            var s = today.getSeconds();
            var now= h+':'+m+':'+s;
            document.getElementById('timer').innerHTML = h+':'+m+':'+s;//set the text in 'timer' id below to the date
            setInterval(updateTime(), 1000);//////SEE THIS LINE//////
        }
    </script>
</head>
<body>
    <p id='timer'> Time </p>
    <script>
        updateTime();
    </script>
</body>

Online js console for testing can be found here: https://jsfiddle.net/

Because with the second you are doing the function call right then, you are supposed to just pass a reference to the function when not using a string, i.e. just the name `setInterval(updateTime,` — Patrick Evans, Jul 03 '16 at 05:06
Note: **The difference between `setInterval()` and `setTimeout()` is very important.** Do *not* call `setInterval()` from within the function. Either use `setInterval(updateTime,1000)` *outside* the function, or use `setTimeout(updateTime,1000))` *inside* the function. — nnnnnn, Jul 03 '16 at 05:13

score 6 · Answer 1 · answered Jul 03 '16 at 05:06

6

 setInterval('updateTime()', 1000);

You are passing string to the setInterval as the first argument.You need to pass the function reference

Correct Way

setInterval(updateTime, 1000)

answered Jul 03 '16 at 05:06

Piyush.kapoor

6,715
1
21
21

oh whoa, I didn't even notice you answered – Joe Thomas Jul 03 '16 at 05:07
additionally, in the second example OP is passing the returned value of a function instead of the function itself – nem035 Jul 03 '16 at 05:07
You don't "need" to pass a function reference, the line you quote in your answer with the string works as is. – nnnnnn Jul 03 '16 at 05:08
But why does the string also work? – Jul 03 '16 at 05:12
Does js accept the fx by reference from string input as well? – Jul 03 '16 at 05:17
1

@skim - You can pass a string of arbitrary JS code. `setInterval()` (or `setTimeout()`) will basically `eval()` that string at the specified interval. But although you *can* do this, you shouldn't. Best practice is to pass a function reference directly. – nnnnnn Jul 03 '16 at 05:19

Akshay Khandelwal · Accepted Answer · 2017-03-01T13:12:45.220

Try doing this setInterval(updateTime, 1000); without ()

Now coming to the question why.

The Setinterval function evaluates the content if string and executes if function name

To explain why it does execute the updateTime() with brackets immediately is because it tries to execute the output of the updateTime function in interval loop, that will be undefined if you are not returning anything and will be treated as function name if it returns a string. Anything else will be overlooked or error thrown.

Hope that helps

score 0 · Answer 3 · answered Jul 03 '16 at 05:07

If you change your second code to

setInterval(updateTime,1000);

it should work. The reason is because ^there you're passing a function pointer to set interval while in your answer updateTime() is passing the return value of updateTime to setInterval.

Function call using single quotes vs no quotes

3 Answers3