array of functions

**SpaceFrog** · Jan 11, 2007, 10:28

I was trying to store my functions in an Array but I am puzzled with functions with arguments...
Here is how I came around the problem:

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Nouvelle page 1</title>
</head>
<script type='text/javascript'>
 listStart= new Array() ;  
 
function addToStart(fnc){ 
                                  listStart[listStart.length]=fnc; 
				 }
		 
 function start(){  
        for (i=0;i<listStart.length;i++){ 
                      if(listStart[i] instanceof Function) {
                                                     listStart[i]();
                                                                     }
                      else {  eval (listStart[i]); }
         }//end boucle for
}//end function

function one(){alert('one')}
function two(xx){alert(xx)}
 
addToStart(one)
addToStart("two('hello')")
 
</script>
 
<body onload='start()'>
 
</body>
 
</html>

I must say I'm not too proud of the eval I was willing to replace by window[]
but the other bit I'm really wanting to shoot is the fact that I have to add a sting to the array if the function needs arguments ..
Any smarter way to do this ?

**dwees** · Jan 11, 2007, 10:36

You may wish to reformat your code so that it is more pleasant to read, it is being jumbled quite a bit right now.

Dave

**SpaceFrog** · Jan 11, 2007, 10:47

sorry it looks like I had a few tabulations in the copy / paste of my code ...

**Pepejeria** · Jan 11, 2007, 10:54

No need to use eval in this case. Just pass an anonymous function that will contain the function call with an argument:

Code:

<script>
var listStart = [];  

function addToStart(fnc) {
    listStart.push(fnc);
}
							 

function start() {  
    for(var i=0; i<listStart.length; i++) {
        listStart[i]();
    }
}
 
function one() {
    alert("one");
}

function two(xx) {
    alert(xx);
}
 
addToStart(one);
addToStart(function(){ two("hello"); });

window.onload = start; 
</script>

**SpaceFrog** · Jan 15, 2007, 07:43

weird !!!

just because of the () in the onload ???

why doesn't it work with

Code:

<body onload="start()">

=> oops well it works with this one ...
or

Code:

<body onload="start">

I don't get the difference with my code ???
Ok got it but I do not understand ...

Code:

addToStart(function(){ two("hello"); });

instead of

Code:

addToStart(two("hello"));

why doesn't this work ?

**Pepejeria** · Jan 15, 2007, 07:48

To call a function you use () after the function name. But what I did above is to assign a function to the event. The window.onload event will then trigger that function when it triggers.

**SpaceFrog** · Jan 15, 2007, 08:01

I don't really get the reason of this ...

Code:

addToStart(function(){ two("hello"); });

does not trigger the function ...

Code:

addToStart(two("hello"); );

triggers the fucntion and looses the arguments for further call ...

**SpaceFrog** · Jan 15, 2007, 08:03

I don't really get the reason of this ...

Code:

addToStart(function(){ two("hello"); });

does not trigger the function ...

Code:

addToStart(two("hello"); );

triggers the fucntion and looses the arguments for further call ...

Anyway thanks for the tip,

I will juste use this notation as it will be universal:

Code:

addToStart(function(){one()});

Code:

addToStart(function(){ two("hello"); });

**jimfraser** · Jan 15, 2007, 08:41

addToStart(function(){ two("hello"); });
causes the function inside to be added to the listStart array. Then when you call start() the "two" function gets executed.

addToStart(two("hello"); );
Calls the two function and adds the return value (it doesnt have one) to the listStart array. When you call start() it might generate an error.

**7stud** · Jan 15, 2007, 18:02

I don't really get the reason why this [statement]:

Code:

addToStart(function(){ two("hello"); });

does not trigger the function [two() and make it execute]

Suppose you have this function definition:

Code:

function someFunc()
{
	alert(hello);
}

If that is the only js on the page, will the alert() display "hello"? The answer is no. js just sees a definition for a function named 'someFunc' with some statements inside of it. The statements inside of a function only get executed if the function gets called. You call a function like this:

Code:

someFunc();

Note: the function name is followed by the function execution operator '( )'.

In this line:

Code:

addToStart(     function(){ two("hello"); }         );

an anonymous function is defined. However, the anonymous function is never called in that statement, so the statements inside the function don't execute. You can tell the anonymous function is not being called because there's no function execution operator after it.

You could do this if you were so inclined:

Code:

function two(xx){alert(xx)};
var result = function(){two("hello");}( );

That will cause the anonymous function to execute, which will cause the statements inside the function body to execute, which will cause the line:

two("hello");

to execute. Note: since the anonymous function does not return a value, result will be undefined. Function calls are replaced in the code by their return values.

In this code:

Code:

addToStart(two("hello"); );

two executes because:

a) two is not inside a function definition
b) two is followed by the function execution operator

One final point.

Code:

function someFunc()
{
     alert("hello");
}

When part of a function definition, the function executing operator '( )' does not cause the function to execute.

**SpaceFrog** · Jan 16, 2007, 03:45

thanks for sparing time to make thing clearer for me

The SitePoint Forums have moved.

User Tag List

Thread: array of functions

Thread Tools

Display

array of functions

Bookmarks

Bookmarks

Posting Permissions