Contents tagged with Functions
-
JavaScript Functions
When coming from a strongly-typed, object-oriented background, there may be some surprising elements when looking at how functions are used in JavaScript.
Functions in JavaScript don’t have any real concept of a signature, like they would in .NET. All functions return a value (which will be the value
undefined
if nothing is explicitly returned), so there are no void functions, and, while you can define named parameters for a function, callers of the function can provide more or less parameters than specified. If less parameters are provided, the other parameters will beundefined
, if more are provided, they are accessible via an implicit array-like variable namedarguments
. This also means that it’s not possible to have function overloads which have the same name and differ just by signature.There are also two different ways to create a function. The one that looks more like the object-oriented style is a function statement. This is a statement that starts with function, then gives the function name, parameter list, and body. One special characteristic of function statements is that they are defined throughout the entire scope of their containing function (i.e. they can be used before they are defined). They are said to be hoisted to the top of the containing function.
The other option is a function expression. This can look just like a function statement, but doesn’t require a function name, and is a value that can be assigned to a variable, passed to another function, or invoked. Let’s see some examples:
var myFunc = function (x) { if (typeof x === 'undefined') { return 'no args'; } else if (typeof x === 'function') { return x(); } else if (arguments.length === 1) { return 'x was ' + x; } else { return arguments.length - 1 + ' extra arguments provided'; } }, result1 = myFunc(), result2 = myFunc(function (y) { console.log(y); }), result3 = myFunc(statement), result4 = myFunc(1), result5 = myFunc({}, true, 'text'); console.log(result1, result2, result3, result4, result5); function statement(x, y, z) { console.log(x, y, z); }
So, we start here by defining a variable
myFunc
, whose value is a function expression. The function has one parameter,x
, and returns a string value indicating what was passed in. Forresult1
, we callmyFunc
without any arguments, and see thatx
isundefined
. Forresult2
andresult3
, we callmyFunc
with a function argument (forresult2
it’s a function expression, forresult3
it’s a reference to a function defined via a function statement), call that function, and return the result. Because both functions we pass in don’t return anything, the result isundefined
. Note that inresult3
, we were able to use statement before it was defined. Forresult4
, we callmyFunc
with one argument, and refer to the value via the parameterx
. Forresult5
, we callmyFunc
with more than one argument, and refer to thearguments
collection.