SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    array of functions

    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 ?
    Last edited by SpaceFrog; Jan 11, 2007 at 09:46. Reason: tabs in code

  2. #2
    SitePoint Zealot
    Join Date
    Jul 2006
    Posts
    151
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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

  3. #3
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    sorry it looks like I had a few tabulations in the copy / paste of my code ...

  4. #4
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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>

  5. #5
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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 ?

  6. #6
    SitePoint Wizard Pepejeria's Avatar
    Join Date
    Jan 2005
    Location
    Too far up north
    Posts
    1,566
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  7. #7
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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 ...

  8. #8
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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"); });

  9. #9
    SitePoint Wizard
    Join Date
    Nov 2004
    Location
    Nelson BC
    Posts
    2,310
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.

  10. #10
    SitePoint Wizard
    Join Date
    Mar 2001
    Posts
    3,537
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    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.
    Last edited by 7stud; Jan 15, 2007 at 20:44.

  11. #11
    SitePoint Evangelist SpaceFrog's Avatar
    Join Date
    Jan 2005
    Location
    Outerspace
    Posts
    511
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks for sparing time to make thing clearer for me


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •