3

What is the relationship between a function and a value? I thought that a function was a type of value; however, functions both contain values (arguments) and return values too.


I'm (obviously) new to programming, and want to ensure that I have a solid conceptual foundation as I move my way through JavaScript.

Michael Petrotta
  • 56,954
  • 26
  • 136
  • 173

2 Answers2

4

Functions do things. Variables hold values (data).

A function can accept data as arguments. A function can also return data, but does not have to. Consider this function which just adds two numbers together:

function addNumbers(numberA, numberB) {
    var total = numberA + numberB;
    console.log(total);
}

This is a function which accepts two arguments. Within the function's code block, those arguments' values are assigned to the variables numberA and numberB. The function's code creates another variable, total, and assigns the value of numberA added to the value of numberB. The function then calls another function, console.log, with the value of total passed in as an argument.

Now, the function can also return values. Let's modify this function a bit:

function addNumbers(numberA, numberB) {
    var total = numberA + numberB;
    return total;
}

If you were to call this function now, you get back the value of total. If I were to run this:

console.log(addNumbers(5, 5));

You would see 10 in the console. My number literal values were passed as arguments to addNumbers. The function did its work and returned to me the value of its total variable. This value is now passed in as an argument to console.log.

If that isn't crystal clear yet, then please read other tutorials online before continuing.

Now, in JavaScript functions are just like anything else. You can assign them to variables as well!

var newAddNumbers = addNumbers;
console.log(newAddNumbers(5, 5)); // Also returns 10 in the console

When you type:

function someFunction () {

This is no different than:

var someFunction = function () {

The function itself is assigned to the variable someFunction. In our original example, the function itself was assigned to addNumbers. So yes, function is a type just like number, object, boolean, etc.

Brad
  • 146,404
  • 44
  • 300
  • 476
  • _"...is no different than..."_ - Well, the difference may not matter for this question, but there _is_ a significant difference. – nnnnnn Apr 12 '13 at 04:45
  • @nnnnnn, Can you elaborate? I got into this discussion on another thread awhile back, and that was the conclusion we came to. I'll see if I can dig it up. – Brad Apr 12 '13 at 04:46
  • Try calling the function on the line _before_ it is defined - you'll find that it works with the first declaration style but not with the second. Also something like `var func = makeFunction();` (where `makeFunction()` returns a reference to some other function) can only work the second way. No need to repeat any further explanation here when there are [quite a few questions about this](http://stackoverflow.com/search?q=[javascript]+function+declaration+style), for example [this one](http://stackoverflow.com/questions/336859/javascript-var-functionname-function-vs-function-functionname). – nnnnnn Apr 12 '13 at 05:26
  • @nnnnnn, Yes, that makes sense. Functions defined as `function someFunction` are hoisted with the variable, whereas with `var someFunction = function`, the variable is hoisted but as with anything else, setting it isn't. I've never thought about that! – Brad Apr 12 '13 at 13:09
2

If I have a function:

function add(a, b) {
    return a + b;
}

add is a function. All functions are values; I can place them in a variable or pass them as an argument, for example.

a and b are arguments of add, but the function has not been called, so they do not have values. Similarly, the function has been called, so it has no return value.

When I call the function:

add(1, 2);

The function executes with a and b initially set to 1 and 2 respectively for that invocation.

If I call it again with different arguments:

add(3, 4);

Then this time a and b are initially set to 3 and 4; however, these a and b not only have different values than the last time; they really are different variables. Every time you call a function, the arguments are essentially variables, which are local not only to that function but to that invocation of that function.

icktoofay
  • 117,602
  • 18
  • 233
  • 223