Javascript anonymous function vs normal function

Question

What's the difference between:

<script type="text/javascript">
        $().ready(function() {
            InitialDictionary = new Array();
            LoadCurrentValues(InitialDictionary);
            $("a[id*=SomeLink]").click(function() {
                if (!CompareDictionaries(InitialDictionary)) 
                {
                    alert('Hello')
                }
            }
        )
        })
</script>

and

<script type="text/javascript">
    $().ready(function () {
        InitialDictionary = new Array();
        LoadCurrentValues(InitialDictionary);
        $("a[id*=SomeLink]").click(CheckValuesChanged(InitialDictionary));
    })

    function CheckValuesChanged(InitialDictionary) {
        if (!CompareDictionaries(InitialDictionary)) 
        {
            alert('Hello')
        }
    } 
</script>

Without going into details into what I'm trying to achieve here, is there any reason why an anonymous method works fine and the call to a function doesn't? Shouldn't they produce the same results?

Naftali · Accepted Answer · 2011-05-11 17:18:30Z

2

To call a function you have to do this:

$("a[id*=LogoLink]").click(function(){CheckValuesChanged(InitialDictionary)});

Or:

$("a[id*=LogoLink]").click("CheckValuesChanged(InitialDictionary)"); //might work

answered May 11, 2011 at 17:18

Naftali

147k41 gold badges247 silver badges304 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

SLaks Over a year ago

No, that won't work. When calling setTimeout, it would work (except for the variable), but it's heavily frowned upon.

Naftali Over a year ago

@SLaks, hence the might, better to go with option 1

Peter Olson Over a year ago

And the first solution still uses an anonymous function. The OP seems to want to do it w/o the anonymous function.

Peter Olson · Accepted Answer · 2011-05-11 17:21:01Z

2

They both work, but you cannot bind a function to an event like this

$("a[id*=LogoLink]").click(CheckValuesChanged(InitialDictionary));

because the a function must be bound to the click event. When you pass an argument to the function it returns undefined, which is not a function. You can fix this by changing your second code sample like so:

$().ready(function () {
    InitialDictionary = new Array();
    LoadCurrentValues(InitialDictionary);
    $("a[id*=LogoLink]").click(CheckValuesChanged);

  function CheckValuesChanged() {
      if (!CompareDictionaries(InitialDictionary)) {
                alert('Hello')
      }
  } 
});

answered May 11, 2011 at 17:21

Peter Olson

144k49 gold badges209 silver badges249 bronze badges

4 Comments

Naftali Over a year ago

InitialDictionary is not in the scope of CheckValuesChanged

Naftali Over a year ago

not always best to use variables like that, than what is the point in the function if the variable is global?

Dimitri Over a year ago

Declare InitialDictionary outside of any function, right in the begining of your javascript body. Document.Ready function will asign value to it and CheckValuesChanged will be able to access it later.

Peter Olson Over a year ago

@Dmitri Neal's point would still stand, because it would rely on an evil global variable.

Darin Dimitrov · Accepted Answer · 2011-05-11 17:17:44Z

1

The second example is wrong:

$("a[id*=LogoLink]").click(CheckValuesChanged(InitialDictionary));

It should be:

$("a[id*=LogoLink]").click(CheckValuesChanged);

But because you want to pass InitialDictionary as argument you need to use the first approach which will capture it in the anonymous function.

answered May 11, 2011 at 17:17

Darin Dimitrov

1.0m276 gold badges3.3k silver badges3k bronze badges

3 Comments

Naftali Over a year ago

Not if the OP wants a parameter

Dante Over a year ago

Can't I pass a parameter into the function? Because I want to reuse that method in several .click(...) calls.

Darin Dimitrov Over a year ago

@Dante, yes you can, using the first approach.

Collectives™ on Stack Overflow

Javascript anonymous function vs normal function

3 Answers 3

3 Comments

4 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

3 Comments

4 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related