Ad

Ad

Showing posts with label Function. Show all posts
Showing posts with label Function. Show all posts

Sunday, 4 May 2014

JavaScript Function Parameters

A JavaScript function does not perform any checking on parameter values (arguments).

Function Parameters and Arguments

Earlier in this tutorial, you learned that functions can have parameters.
The parameters are listed in the function definition:
function functionName(parameter1, parameter2, parameter3) {
  code to be executed
}
When the function is invoked (called), the values used for these parameters, are called arguments.

Parameter Rules

JavaScript function definitions do not specify data types for parameters.
JavaScript functions do not perform type checking on the passed arguments.
JavaScript functions do not check the number of arguments received.

Parameter Defaults

If a function is called with missing arguments (less than declared in the definition), the missing values are set to:
undefined
Sometimes this is acceptable, sometimes it is better to assign a default value to the parameter.
This can be done like this:

Example

function myFunction(x, y) {
  if (y === undefined) y = 1;
  return x * y
}

Try it Yourself »
Or, even simpler, like this:

Example

function myFunction(x, y) {
  y = y || 1;
  return x * y
}

Try it Yourself »
If a function is called with too many arguments (more than declared in the definition), these arguments cannot easily be referred to, because they don't have a name. They can only be reached in the arguments object.

Arguments are Passed by Value

The parameters, in a function call, are the function's arguments.
JavaScript arguments are passed by value: The function only gets to know the values, not the argument's locations.
If a function changes an argument's value, it does not change the parameter's original value.
Changes to arguments are not visible (reflected) outside the function.

Objects are Passed by Reference

In JavaScript, object references are values.
Because of this, it looks like objects are passed by reference:
If a function changes an object property, it changes the original value.
Changes to object properties are visible (reflected) outside the function.

The Arguments Object

JavaScript functions have a built-in object called the arguments object.
The argument object contains an array of the arguments used when the function was called (invoked).
This way you can simply use a function to find (for instance) the highest value in a list of numbers:

Example

x = findMax(1,123,500,115,44,88);

function findMax() {
  max = 0;
  for(var x = 0; x < arguments.lenght; x++) {
    if (arguments[i] > max) max = arguments[i];
  }
  return max;
}

Try it Yourself »

JavaScript Function Definitions

JavaScript functions are defined with the function keyword.
You can use a function declaration or a function expression.

Function Declarations

Earlier in this tutorial, you learned that functions are declared with the following syntax:
function functionName(parameters) {
  code to be executed
}
Declared functions are not executed immediately. They are "saved for later use", and will be executed later, when they are invoked (called upon).

Example

function myFunction(a, b) {
  return a * b;
}

Try it Yourself »

NoteSemicolons are used to separate executable JavaScript statements.
Since a function declaration is not an executable statement, it is not common to end it with a semicolon.


Function Expressions

A JavaScript function can also be defined using an expression.
A function expression can be stored in a variable:

Example

var x = function(a, b) {return a * b};

Try it Yourself »
After a function expression has been stored in a variable, the variable can be used as a function:

Example

var x = function(a, b) {return a * b};
var z = x(4, 3);

Try it Yourself »
The function above is actually an anonymous function (a function without a function name).
Functions stored in variables, do not need function names. They are always invoked (called) using the variable name.
NoteThe function above ends with a semicolon because it is a part of an executable statement.


The Function() Constructor

As you have seen in the previous examples, JavaScript functions are defined with the function keyword.
Functions can also be defined with a built-in JavaScript function constructor called Function().

Example

var myFunction = new Function("a", "b", "return a * b");

var x = myFunction(4, 3);

Try it Yourself »
You actually don't have to use the function constructor. The example above is the same as writing:

Example

var myFunction = function(a, b) {return a * b}

var x = myFunction(4, 3);

Try it Yourself »

NoteMost of the time, you should avoid using the new keyword in JavaScript.


Function Hoisting

Earlier in this tutorial, you learned about "hoisting".
Hoisting is JavaScript's default behavior of moving declarations to the top of the current scope.
Hoisting applies to variable declarations and to function declarations.
Because of this, JavaScript functions can be called before they are declared:
myFunction(5);

function myFunction(y) {
  return y * y;
}
Functions defined using an expression are not hoisted.

Self-Invoking Functions

Function expressions can be made "self-invoking".
A self-invoking expression is invoked (started) automatically, without being called.
Function expressions will execute automatically if the expression is followed by ().
But it would generate an error if you place a self-invoking function directly in your code like this:
function() {
  code to be executed
}();
You cannot self-invoke a function declaration.
You have to add parentheses around the function to indicate that it is a function expression:

Example

(function () {
  var x = "Hello!!";      // I will invoke myself
})();

Try it Yourself »


Functions Can Be Used as Values

JavaScript functions can be used as values:

Example

function myFunction(a, b) {
  return a * b;
}

var x = myFunction(4, 3);

Try it Yourself »
JavaScript functions can be used in expressions:

Example

function myFunction(a, b) {
  return a * b;
}

var x = myFunction(4, 3) * 2;

Try it Yourself »


Functions are Objects

The typeof operator in JavaScript returns "function" for functions.
But, JavaScript functions can best be described as objects.
JavaScript functions have both properties and methods.
The arguments.length property returns the number of arguments received when the function was invoked:

Example

function myFunction(a, b) {
  return arguments.length;
}

Try it Yourself »
The toString() method returns the function as a string:

Example

function myFunction(a, b) {
  return a * b;
}

var txt = myFunction.toString();

Try it Yourself »

NoteA function defined as the property of an object, is called a method to the object.
A function designed to create new objects, is called an object constructor.