Mega Code Archive
SetTimeout() with a pointer to a function
<![CDATA[
<html>
<head>
<script type="text/javascript">
function timeout(){
window.setTimeout("show_alert()",2000)
}
function show_alert(){
alert("hi")
}
</script>
</head>
<body>
<form>
<input type="button" onclick="timeout()" value="Count down">
</form>
</body>
</html>
////////////////////////////////////////
Hi Sirs/Madams of rntsoft.com,
I came across an article on your site about "pointers to a function in
javascript", in use with setTimeout*.
Well, that very title shows you do not understand th parts of
javascript you are talking about well enough. However, when actually
reading the article it is revealed that your misunderstanding goes
even deeper.
That's why I decided to send you this email and learn you a thing or
two about javascript.
First off, your example resorts to the use of setTimeout("show_alert()", 4000).
Obviously you are passing a string, not a pointer to a function. Now
there are two ways to call setTimeout, one with a string and one with
a function. The last version is pretty much like using a pointer to a
function, but there are some differences. However, when using that
title the correct way to call setTimeout, would have been
"setTimeout(show_alert, 4000)". And yes, it would actually have had
the same result as the given code. Also, do note that tis circumvents
the indirect usage of eval (which you probably know is evil), as eval
is what is used to make sense of the string that can be passed to
setTimeout.
Now as for function pointers in javascript. Javascript does not know
any pointers. This includes function pointers. However, this is no
loss, because javascript functions are different things than functions
are in most languages.
In javascript functions are values, just like numbers, booleans and
objects are. They can be treated as such in every respect and
additionally you can call them. As such, you can have function
constants. These are commonly known as anonymous functions and look
like this:
function (args) {/*body*/}
It also means you can assign a function value to a variable. Logically
this looks like this:
var variable = function (args) {/*body*/}
And now for the real magic of javascript, this line above is the real
meaning of the standard way to declare a function. Confused? Let me
show you:
function functionName (args) {/*body*/}
does the exact same thing as:
var functionName = function (args){/*body*/}
This alternate syntax was simply added to have the functions appear to
work as in other languages, but as you have jut seen, they do work
slightly different. However, this way in which they do work is a more
powerful way. For example, we do not need a concept such as a function
pointer, we can simply require an argument to be a function. From
there on, a programmer can decide to supply a variable which holds a
function (the thing I did above in your sample), or one can decide to
supply a function literal. In that case you example would look like
this:
function timeout()
{
setTimeout(function()
{
alert("hi");
}, 4000);
}
Of course, the spacing could be altered to put all of this on one line.
I hope I taught you a little about javascript and I hope this may
serve as a way to decrease the amount of faulty information about the
intricacies of javascript in the top results of google search.
Yours sincerely,
Jasper Horn
jasperhorn at gmail.com
]]>