How come I can say:
var myFunction = function() {
setTimeout(myFunction, 1000);
}
myFunction();
Why does the function call in the setTimeout not require parentheses, but the last line does?
Nutshell
myFunction references the function
myFunction() calls the function
More Words
setTimeout expects a function reference* as an argument.
There are circumstances where setTimeout(myFunction(), 1000) might make sense, like if myFunction() returns a function, e.g.
function myFunction() {
return function() {
alert("ohai")
}
}
// Or
const myFunction = () => () => alert("ohai")
So:
setTimeout(myFunction(), 1000);
setTimeout gets the return value of myFunction
myFunction returns a function (that calls alert)
meaning there will be an alert every second.
See also Why function statement requires a name?
* Or a string to be evaluated, but a reference is preferred.
myFunction is a function
myFunction() calls the function and yields whatever value the function returns.
The purpose of setTimeout is running code after some time elapses. You need to pass just the function to it (so setTimeout can itself call the function when appropriate) because if you called the function (with the parenthesis) before passing it to setTimeout it would execute now instead of after 1 second.
When you use the parenthesis, it's saying 'call this function now'. So if you say setTimeout(myFunction(),1000);, it will use the return value of the function as the callback for the timeout. If the return value for the function is not itself a function, you'll get an error because it will try to execute something that isn't executable after the timeout (a string, a number, undefined, etc).
In line 2, the function myFunction is not called, but passed as an argument to the setTimeout function, whereas in line 4 myFunction is called; to call a function, you always have to use parentheses, even if there are no arguments.
I think this example would make it clearer if i may,
function callback() {
console.log('this function runs on page loads.');
}
setTimeout(callback(), 2000);
Here callback() function will run immediately after page loads and won't wait 2 seconds.
function callback() {
console.log('this function runs after page loads.');
}
setTimeout(callback, 2000);
Here callback() function will run after 2 seconds.
Related
How come I can say:
var myFunction = function() {
setTimeout(myFunction, 1000);
}
myFunction();
Why does the function call in the setTimeout not require parentheses, but the last line does?
Nutshell
myFunction references the function
myFunction() calls the function
More Words
setTimeout expects a function reference* as an argument.
There are circumstances where setTimeout(myFunction(), 1000) might make sense, like if myFunction() returns a function, e.g.
function myFunction() {
return function() {
alert("ohai")
}
}
// Or
const myFunction = () => () => alert("ohai")
So:
setTimeout(myFunction(), 1000);
setTimeout gets the return value of myFunction
myFunction returns a function (that calls alert)
meaning there will be an alert every second.
See also Why function statement requires a name?
* Or a string to be evaluated, but a reference is preferred.
myFunction is a function
myFunction() calls the function and yields whatever value the function returns.
The purpose of setTimeout is running code after some time elapses. You need to pass just the function to it (so setTimeout can itself call the function when appropriate) because if you called the function (with the parenthesis) before passing it to setTimeout it would execute now instead of after 1 second.
When you use the parenthesis, it's saying 'call this function now'. So if you say setTimeout(myFunction(),1000);, it will use the return value of the function as the callback for the timeout. If the return value for the function is not itself a function, you'll get an error because it will try to execute something that isn't executable after the timeout (a string, a number, undefined, etc).
In line 2, the function myFunction is not called, but passed as an argument to the setTimeout function, whereas in line 4 myFunction is called; to call a function, you always have to use parentheses, even if there are no arguments.
I think this example would make it clearer if i may,
function callback() {
console.log('this function runs on page loads.');
}
setTimeout(callback(), 2000);
Here callback() function will run immediately after page loads and won't wait 2 seconds.
function callback() {
console.log('this function runs after page loads.');
}
setTimeout(callback, 2000);
Here callback() function will run after 2 seconds.
How come I can say:
var myFunction = function() {
setTimeout(myFunction, 1000);
}
myFunction();
Why does the function call in the setTimeout not require parentheses, but the last line does?
Nutshell
myFunction references the function
myFunction() calls the function
More Words
setTimeout expects a function reference* as an argument.
There are circumstances where setTimeout(myFunction(), 1000) might make sense, like if myFunction() returns a function, e.g.
function myFunction() {
return function() {
alert("ohai")
}
}
// Or
const myFunction = () => () => alert("ohai")
So:
setTimeout(myFunction(), 1000);
setTimeout gets the return value of myFunction
myFunction returns a function (that calls alert)
meaning there will be an alert every second.
See also Why function statement requires a name?
* Or a string to be evaluated, but a reference is preferred.
myFunction is a function
myFunction() calls the function and yields whatever value the function returns.
The purpose of setTimeout is running code after some time elapses. You need to pass just the function to it (so setTimeout can itself call the function when appropriate) because if you called the function (with the parenthesis) before passing it to setTimeout it would execute now instead of after 1 second.
When you use the parenthesis, it's saying 'call this function now'. So if you say setTimeout(myFunction(),1000);, it will use the return value of the function as the callback for the timeout. If the return value for the function is not itself a function, you'll get an error because it will try to execute something that isn't executable after the timeout (a string, a number, undefined, etc).
In line 2, the function myFunction is not called, but passed as an argument to the setTimeout function, whereas in line 4 myFunction is called; to call a function, you always have to use parentheses, even if there are no arguments.
I think this example would make it clearer if i may,
function callback() {
console.log('this function runs on page loads.');
}
setTimeout(callback(), 2000);
Here callback() function will run immediately after page loads and won't wait 2 seconds.
function callback() {
console.log('this function runs after page loads.');
}
setTimeout(callback, 2000);
Here callback() function will run after 2 seconds.
I have this counter I made but I want it to run forever, it's really simple, what am I doing wrong here?
function timer() {
console.log("timer!")
}
window.setInterval(timer(), 1000)
You used a function call instead of a function reference as the first parameter of the setInterval. Do it like this:
function timer() {
console.log("timer!");
}
window.setInterval(timer, 1000);
Or shorter (but when the function gets bigger also less readable):
window.setInterval( function() {
console.log("timer!");
}, 1000)
setInterval and setTimeout must be used with callbacks, like:
setInterval(timer, 1000);
or unnamed functions:
setInterval( function() { console.log("timer!"); }, 1000 );
Why your code is not working - when you pass a function as argument to another function with brackets e.g. doSomething ( someFunc() ) you are passing the result of the function.
When the function is passed as object e.g. doSomething ( someFunc ) you are passing a callback. This way someFunc is passed as reference and it is executed somewhere in the calling function. This is the same as the pointers to functions in other languages.
A common mistake is to use the these two functions as shown at w3schools. This makes an implicit call to eval.
How come I can say:
var myFunction = function() {
setTimeout(myFunction, 1000);
}
myFunction();
Why does the function call in the setTimeout not require parentheses, but the last line does?
Nutshell
myFunction references the function
myFunction() calls the function
More Words
setTimeout expects a function reference* as an argument.
There are circumstances where setTimeout(myFunction(), 1000) might make sense, like if myFunction() returns a function, e.g.
function myFunction() {
return function() {
alert("ohai")
}
}
// Or
const myFunction = () => () => alert("ohai")
So:
setTimeout(myFunction(), 1000);
setTimeout gets the return value of myFunction
myFunction returns a function (that calls alert)
meaning there will be an alert every second.
See also Why function statement requires a name?
* Or a string to be evaluated, but a reference is preferred.
myFunction is a function
myFunction() calls the function and yields whatever value the function returns.
The purpose of setTimeout is running code after some time elapses. You need to pass just the function to it (so setTimeout can itself call the function when appropriate) because if you called the function (with the parenthesis) before passing it to setTimeout it would execute now instead of after 1 second.
When you use the parenthesis, it's saying 'call this function now'. So if you say setTimeout(myFunction(),1000);, it will use the return value of the function as the callback for the timeout. If the return value for the function is not itself a function, you'll get an error because it will try to execute something that isn't executable after the timeout (a string, a number, undefined, etc).
In line 2, the function myFunction is not called, but passed as an argument to the setTimeout function, whereas in line 4 myFunction is called; to call a function, you always have to use parentheses, even if there are no arguments.
I think this example would make it clearer if i may,
function callback() {
console.log('this function runs on page loads.');
}
setTimeout(callback(), 2000);
Here callback() function will run immediately after page loads and won't wait 2 seconds.
function callback() {
console.log('this function runs after page loads.');
}
setTimeout(callback, 2000);
Here callback() function will run after 2 seconds.
in Node.js I have this code:
console.log('starting');
function sayHello() {
console.log('HEllo!!');
}
setTimeout(() => {
console.log('inside of callback');
}, 1000);
console.log('finishing app');
Why if I run through the terminal the (App) file it displays the result of the setTimeout function but not the sayHello? After all, I did not call the setTimeout function either!
Moreover, if then I store the setTimeout function in a variable like
var x = setTimeout(() => {
console.log('inside of callback');
}, 1000);
the function is called automatically as well! Why?
There is no link with function or method here. It's about declaration and call.
When you do :
function sayHello() {
console.log('HEllo!!');
}
You declare a function sayHello that won't be called. To call it, you need to do sayHello(); after declare it.
When you use setTimeout(), you are calling a built-in function already declared for you by JavaScript. To know how to use the function that is already declared, you need to check a documentation of the function. Example : check here (part syntax).
Note : Every function in JavaScript is attached to an object, so every function is a method. setTimeout, for example, is attached to the global object (in browser, it's window, in Node it's global). Your sayHello() function will be also attached to her scope.
The implementation of setTimeout is something like (this is only a mock implementation):
function setTimeout(callback, interval, ....args) {
// wait for `interval` time to pass
callback(...args);
}
As you can see, setTimeout is a function which takes a function(callback in the above example) as a parameter, and calls that function after interval time has passed.