Basic knowledge of JavaScript function calls and parameter transfer

Source: Internet
Author: User
This article describes how to call and PASS Parameters of JavaScript functions. It is a basic knowledge in JavaScript beginners. For more information, see JavaScript function call
JavaScript functions can be called in four ways.
The difference between each method is the initialization of this.
This keyword
In Javascript, this points to the current object during function execution.
Note that this is a reserved keyword and you cannot modify the value of this.
Call JavaScript Functions
The code in the function is executed after the function is called.
As a function call
Instance

Function myFunction (a, B) {return a * B;} myFunction (10, 2); // myFunction (10, 2) returns 20


The preceding functions do not belong to any object. However, in JavaScript, it is always the default global object.
In HTML, the default global object is the HTML page, so the function belongs to the HTML page.
The page object in the browser is a browser window object ). The above functions will automatically become functions of the window object.
MyFunction () and window. myFunction () are the same:
Instance

Function myFunction (a, B) {return a * B;} window. myFunction (10, 2); // window. myFunction (10, 2) returns 20


Note: This is a common method for calling JavaScript functions, but it is not a good programming habit.
The bug that global variables, methods, or functions may cause name conflicts.
Global Object
If a function is not called by its own object, the value of this becomes a global object.
In a web browser, the global object is a browser window object ).
The value of this returned by this instance is a window object:
Instance

Function myFunction () {return this;} myFunction (); // return the window object


The Note function, called as a global object, will make the value of this a global object.
Using the window object as a variable can easily cause program crash.
Function as method call
In JavaScript, you can define a function as an object.
The following example creates an object (myObject) with two attributes (firstName and lastName) and a method (fullName ):
Instance

Var myObject = {firstName: "John", lastName: "Doe", fullName: function () {return this. firstName + "" + this. lastName ;}} myObject. fullName (); // return "John Doe"


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

Var myObject = {firstName: "John", lastName: "Doe", fullName: function () {return this ;}} myObject. fullName (); // return [object Object] (owner object)


The Note function, called as an object method, will make the value of this the object itself.
Call a function using a constructor
If the new keyword is used before a function call, the constructor is called.
This looks like creating a new function, but in fact JavaScript Functions are re-created objects:
Instance

// Constructor: function myFunction (arg1, arg2) {this. firstName = arg1; this. lastName = arg2;} // This creates a new objectvar x = new myFunction ("John", "Doe"); x. firstName; // return "John"


The constructor creates a new object. The new object inherits the attributes and methods of the constructor.
Note constructor does not have any value for this keyword.
This value is created when an object (new object) is instantiated during function calls.
Call a function as a Function Method
In JavaScript, functions are objects. JavaScript functions have their attributes and methods.
Call () and apply () are predefined function methods. Two methods can be used to call functions. The first parameter of the two methods must be the object itself.
Instance

Function myFunction (a, B) {return a * B;} myFunction. call (myObject, 10, 2); // return 20

Instance

Function myFunction (a, B) {return a * B;} myArray = [10, 2]; myFunction. apply (myObject, myArray); // return 20


Both methods use the object itself as the first parameter. The difference between the two lies in the second parameter: apply is a parameter array, that is, multiple parameters are combined into an array for input, call is passed in as the call parameter (starting with the second parameter ).
In strict mode of JavaScript, the first parameter becomes the value of this when calling a function, even if the parameter is not an object.
In non-strict mode of JavaScript, if the value of the first parameter is null or undefined, it is replaced by a global object.
Note you can use the call () or apply () method to set the value of this and call it as a new method of an existing object.

JavaScript function parameters
The JavaScript function does not check the parameter values (arguments.
Explicit parameters and hidden parameters (arguments)
In the previous tutorial, we have learned the explicit parameters of the function:

functionName(parameter1, parameter2, parameter3) {  code to be executed}


Explicit parameters are listed during function definition.
The real value passed to the function during function calling.
Parameter rules
When defining JavaScript Functions, the parameter does not specify the data type.
The JavaScript function does not detect the hidden parameters (arguments.
The JavaScript function does not detect the number of hidden parameters (arguments.
Default parameters
If a parameter is missing when a function is called, the parameter is set to undefined by default.
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, the simpler method is as follows:
Instance

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

Note: If y has been defined, y | returns y because y is true. Otherwise, 0 is returned because undefined is false.
If too many parameters are set during function calling, the parameter cannot be referenced because the corresponding parameter name cannot be found. Only arguments objects can be called.
Arguments object
JavaScript functions have a built-in object arguments object.
The argument object contains an array of function call parameters.
In this way, you can easily find the value of the last parameter:
Instance

x = findMax(1, 123, 500, 115, 44, 88);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 calculate the sum of all values:
Instance

x = sumAll(1, 123, 500, 115, 44, 88);function sumAll() {  var i, sum = 0;  for (i = 0; i < arguments.length; i++) {    sum += arguments[i];  }  return sum;}


PASS Parameters by value
The parameters called in the function are the function parameters.
If the function modifies the parameter value, the initial value of the parameter is not modified (defined outside the function ).
Changes to function parameters do not affect external variables (local variables) of the function ).
Passing parameters through objects
In JavaScript, the object value can be referenced.
Therefore, when we modify the attributes of an object within the function, the initial value is modified.
Modifying object attributes can act on external functions (global variables ).

Related Article

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.