JavaScript function invocation and parameter Pass _ basics

Source: Internet
Author: User
Tags html page

JavaScript function calls
There are 4 ways to invoke JavaScript functions.
The different ways of each approach are the initialization of this.
This keyword
In general, in JavaScript, this points to the current object when the function executes.
Note that this is a reserved keyword and you cannot modify the value of this.
Calling JavaScript functions
The code in the function executes after the function is called.
called as a function
instance

function MyFunction (A, b) {return
  a * b;
}
MyFunction (2);      MyFunction (10, 2) return 20


The above function does not belong to any object. However, it is always the default global object in JavaScript.
The default global object in HTML is the HTML page itself, so the function belongs to an HTML page.
The Page object in the browser is the browser window (Window object). The above function automatically changes to the function of the Window object.
MyFunction () and window.myfunction () are the same:
Instance

function MyFunction (A, b) {return
  a * b;
}
Window.myfunction (2);  Window.myfunction (10, 2) return 20


Note this is a common method of calling JavaScript functions, but not good programming habits
Global variables, methods, or functions can easily cause a naming conflict bug.
Global Objects
When a function is not called by its own object, this value becomes the global object.
In a Web browser, the global object is a browser window (Window object).
The value of this instance returns this is the Window object:
Instance

function MyFunction () {return this
  ;
}
MyFunction ();        Return Window Object


The note function, called as a global object, makes the value of this the global object.
Using a Window object as a variable can easily cause a program to crash.
function as a method call
in JavaScript You can define a function as an object's method.
The following instance creates an object (MyObject) with two properties (FirstName and LastName), and one method (FullName):
Instance

var myObject = {
  firstName: "John",
  lastName: "Doe",
  fullname:function () {return
    This.firstname + " "+ This.lastname;
  }
}
Myobject.fullname ();     Back to "John Doe"


The FullName method is a function. The function belongs to the object. MyObject is the owner of the function.
This object, owning JavaScript code. The value of this in the instance is the MyObject object.
Test the following! Modify the FullName method and return the This value:
Instance

var myObject = {
  firstName: "John",
  lastName: "Doe",
  fullname:function () {return this
    ;
  }
}
Myobject.fullname ();     return [Object] (Owner object)


The note function is called as an object method, which makes the value of this the object itself.
calling functions using constructors
If the new keyword is used before the function call, the constructor is invoked.
This looks like creating a new function, but actually a JavaScript function is a recreated object:
Instance

Constructor: Function
myfunction (arg1, arg2) {
  this.firstname = arg1;
  This.lastname = arg2;
}

This creates a new object
var x = new MyFunction ("John", "Doe");
X.firstname;               Return to "John"


The call to the constructor creates a new object. The new object inherits the properties and methods of the constructor.
The This keyword in the note constructor does not have any values.
The value of this is created when the object (new object) is instantiated when the function is called.
calling functions as function methods
In JavaScript, a function is an object. The JavaScript function has its properties and methods.
Call () and apply () are predefined function methods. Two methods can be used to invoke a function, and the first parameter of two methods must be the object itself.
Instance

function MyFunction (A, b) {return
  a * b;
}
Myfunction.call (MyObject, 2);   return 20

Instance

function MyFunction (A, b) {return
  a * b;
}
MyArray = [10,2];
Myfunction.apply (MyObject, myarray);  return 20


All two methods use the object itself as the first argument. The difference lies in the second argument: Apply is passed in an array of arguments, that is, multiple arguments are grouped into an array, and call is passed as a call parameter (starting with the second argument).
In JavaScript Strict mode (strict mode), the first parameter becomes the value of this when the function is called, even if the parameter is not an object.
In JavaScript non-strict mode (non-strict mode), if the value of the first argument is null or undefined, it will use global object substitution.
Note through the call () or apply () method you can set the value of this and be invoked as a new method of an existing object.

JavaScript function Arguments
The JavaScript function does not perform any checks on the value of the parameter (arguments).
function explicit parameters and hidden parameters (arguments)
In the previous tutorial, we have learned the explicit parameters of a function:

functionname (Parameter1, Parameter2, Parameter3) {
  code to is executed
}


Function explicit parameters are listed when the function is defined.
function hidden parameters (arguments) are passed to the true value of the function when called by the function.
parameter Rules
The parameter does not specify a data type when the JavaScript function is defined.
The JavaScript function does not detect a hidden parameter (arguments).
The number of hidden parameters (arguments) is not detected by JavaScript functions.
Default Parameters
If the function is missing a parameter at call time, the parameter defaults to: undefined
Sometimes this is acceptable, but it is recommended that you set a default value for the parameter:
Instance

function MyFunction (x, y) {
  if (y = = undefined) {
     y = 0;
  } 
}

Or, in a simpler way:
Instance

function MyFunction (x, y) {
  y = y | | 0;
}

Note If Y is already defined, y | | Returns y because Y is true, otherwise 0 is returned because undefined is false.
If too many arguments are set when the function is called, the argument cannot be referenced because the corresponding parameter name cannot be found. Can only be invoked using the arguments object.
Arguments Objects
The JavaScript function has a built-in object arguments object.
The argument object contains an array of arguments for the function call.
In this way you can easily find the value of the last parameter:
Instance

x = Findmax (1, 123, M, M, V,);

function Findmax () {
  var i, max = 0;
  for (i = 0; i < arguments.length; i++) {
    if (Arguments[i] > max) {
      max = arguments[i];
    }
  }
  return max;
}

or create a function to count the values of all numbers:
Instance

x = SumAll (1, 123, M, M, V,);

function SumAll () {
  var i, sum = 0;
  for (i = 0; i < arguments.length i++) {
    sum + = Arguments[i];
  }
  return sum;
}


Pass parameters by value
The parameter that is called in the function is the parameter of the function.
If the function modifies the value of the parameter, the parameter's initial value (defined outside the function) will not be modified.
Changes to function parameters do not affect variables outside the function (local variables). The
passes parameters
Through an object in JavaScript, you can reference the value of an object.
So we modify the object's properties inside the function to modify its initial value. The
Modify object properties can be used for external functions (global variables).

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.