Javascript Question: What is the difference between calling funcName and funcName()?

[sikuneh]

I have never fully understood this and it's been bothering me. What is the difference between calling a function like this funcName and funcName(). I know that funcName returns the result but I don't know exactly when I should use either.

Thanks in advance.

 

[descalzo]

Re: Javascript Question: What is the difference between calling funcName and funcName

You do not call a function without using the parentheses.

Please give an example where you think you do.

 

[essellar]

Re: Javascript Question: What is the difference between calling funcName and funcName

The parentheses are an invocation. Without them, you are just naming a variable. However, when you tell something else to use the function, you often pass it as a variable by name, as in setTimeout(), assigning an event listener, or assigning a callback. In those cases, you aren't calling a function; rather, you are telling another function which function to call. (And you can invoke an anonymous function—a function that is never given a name—by putting parentheses after the lambda definition.)

 

[sikuneh]

Re: Javascript Question: What is the difference between calling funcName and funcName

Okay, I think I understand. Now if you assign a variable function to say, an element onclick event, is it possible to sent parameters through that onclick?

function foo() {
    // Initialize e
    e.onclick=bar(param1)
}

Something that would have that effect.

 

[descalzo]

Re: Javascript Question: What is the difference between calling funcName and funcName

You are assigning the output of calling bar with parameter param1 to the handler. The output of bar(param1) must be itself a function.

 

[essellar]

Re: Javascript Question: What is the difference between calling funcName and funcName

At this point, we're getting away from what a knowledge of procedural programming style can help you with. I know that JavaScript looks like a C-style/Java-esque language on the surface (syntactic elements like curly braces and semicolons can lead you down the garden path), and as Ed Post remarked in '82, a "determined Real Programmer can write FORTRAN in any language,"* but there are some things that just can't be understood about JS unless you realise that looks can be incredibly deceiving.

JS may have inherited its looks from the Algol/C family of languages, but it got its prototypal inheritance from Self and the best parts of its behaviour from Scheme (a dialect of Lisp).† In order to use the language effectively, you really need to "get" higher-order functions (and what functional programming is in general) and closures. If you want to pass "sticky" parms, you'd use a closure; if you want to be able to pass parms at a deferred time, you'd use a higher-order function (a function that creates the function that you actually need on demand); and there are times when you don't really need either since the function can determine what it needs on its own.

Probably the best current description of the language at that level is in Douglas Crockford's book JavaScript: The Good Parts. (The PDF is about $24, it's DRM-free, and you own it forever and once you've bought it, you can download it for as long as you and O'Reilly media both shall live.) And even that might be a bit of a stretch if you're walking into it cold, so I usually suggest that people at least watch the SICP (Structure and Interpretation of Computer Programs) lecture series by Hal Abelson and Gerry Sussman. That series was recorded at a company-sponsored fast-track version of MIT's 6.001 computer science course for Hewlett Packard employees, it's very accessible to just about anybody who can remember tiny flashes of, say, a tenth-grade math education, and it's free (modulo bandwidth charges from your ISP, since the entire series—20 lectures averaging about an hour each—is about 8.5 GB in size). It's really hard to express how much of an effect that one course can have on the way you think about programming in any language and computing in general, even if all you do is watch the lectures.‡
__________________________________________
* Back in the day, when Netscape Navigator still roamed the planet, it's safe to say that almost all of us were using JavaScript as if it were Visual Basic.

† It's a bit of a mess, but when you consider that Brendan Eich knocked it together in ten days and had to add all sorts of "just get it working right now" hooks for his fellow Netscapers to use in a rush to release, you can almost forgive the inelegance.

‡ Getting the book and doing the exercises, or actually taking the full MIT OpenCourseware version of the course can lead to immense dissatisfaction with the state of computing in the wild, a strong addiction to Lisp, an irrational belief that the whole universe should be tail-call optimised and general curmudgeonliness. You have been warned.

 

[ellescuba27]

Re: Javascript Question: What is the difference between calling funcName and funcName

Hello, I am not a Computer Scientist, so I am going to explain this in the most basic way, because, frankly, that's really the only way I know it myself. So I am sorry for any technical mistakes I make, but this is my understanding of how this works.
In the case of document.onclick, it is already passing a parameter to the function, called, depending on your browser, either "e" or "window.event". It contains information about what button was pressed among many other bits of data you probably don't need. Since a parameter is already passed, you cannot choose another to pass.
The other case where you don't want brackets is if you are just calling it, to see it's properties, but not actually execute it. For example:

function bar(param1, param2) {
window.alert("If the function is executed, this pops up.");
}
if (!bar) {
// avoid errors if the function is undefined.
} else {
window.alert("See, the bar function exists, but even though I found out it does exist, I did not actually execute the function in doing so. Therefore, I do not need parameters.");
}

 

[essellar]

Re: Javascript Question: What is the difference between calling funcName and funcName

It goes way past that. And while you can get the event locally or as it bubbles from within a function, the event isn't being passed to the function (unless you specifically pass it); it's just there to be looked at in the context/environment in which the function is called. You certainly can pass other variables into event code; you just have to be careful about how you do it since you are (usually) creating a closure when you assign a function to an event handler.

One of the things you need to be aware of to get beyond the most basic use of JavaScript is that there isn't really any difference between a function and any other value. This statement:

function doSomething(aParam, anotherParam) {
   // do something in here
}

is exactly equivalent to this:

var doSomething = function(aParam, anotherParam) {
                               // do something in here
                          }

The first example is "syntactic sugar" for the second example, which is the "real" code. Both create a variable named doSomething that becomes the name of a function (a lambda) of two formal parameters aParam and anotherParam. doSomething identifies the function; doSomething() invokes it. (Note that I didn't pass anything to the function when invoking it here. As the lambda is defined here, that won't cause an error -- although e can define formal parameters in JavaScript, JS functions actually have variable arity. What that means is that you can pass as little or as much as you want into a function, and it won't make any difference until you try to use something that wasn't passed in. Then it's an oops. A lot of what I write has no formal parameters and just uses the arguments[] collection.)

Old information on the web (or in books that are more than a couple of years old) isn't going to be of much help; as I indicated in a footnote above, almost nobody was using JavaScript as a functional language until Ajax became part of the idiom, and even then most of us were doing little more than assigning callbacks for asynchronous requests. It really is a powerful little language.

 

[rajdeep01]

Re: Javascript Question: What is the difference between calling funcName and funcName

the example
function bar(param1, param2) {
window.alert("If the function is executed, this pops up.");
}
if (!bar) {
// avoid errors if the function is undefined.
} else {
window.alert("See, the bar function exists, but even though I found out it does exist, I did not actually execute the function in doing so. Therefore, I do not need parameters.");
}