Home > Developer > JavaScript

Definition and invocation of JavaScript functions Learning notes

Source: Internet
Author: User
Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

Definition of JavaScript function

The definition of a function uses a keyword function with the following syntax:
function FuncName ([parameters]) {
statements;
[Return expression;]
}

The meaning of each part of the function:

FuncName is the function name. The function name can be defined by the developer and is the same as the naming rule for the variable.
parameters is the parameter of the function. When you call a function, you pass the actual data to the parameter list to complete the function's specific function. One or more parameters can be defined in the argument list, and multiple arguments are separated by commas "," and, of course, the argument list can be empty. The arguments here are "formal parameters", that is, formal arguments.
statements is a function body. function body is the function of function, is the main part of function.
return the return value of the specified function. A function that can be specified with the return statement or without a return value. When a function executes to the return statement, the execution of the function ends, regardless of whether there is code behind it.
Calls to JavaScript functions
Once the function definition is complete, it can be invoked. When calling a function, simply add parentheses after the function name.

If you define a function that requires passing arguments, you need to add parameters within the parentheses, with multiple arguments separated by commas "." The argument here is "argument", which is the real argument.


The following defines a function that functions by using document.write () to output information.

The code is as follows Copy Code

function Print (msg) {
document.write (msg);
}

var welcome = "Welcome to Nowamagic!www.111cn.net";
Print (welcome);
function Print (msg) {
document.write (msg);
}

var welcome = "Welcome to nowamagic!";
Print (welcome);

Run Demo: Welcome to Nowamagic!www.111cn.net

JavaScript is a relaxed type of language, so you cannot specify a data type for the parameters of a function, and JavaScript does not detect that the data being passed is not the type required by that function.

Let's look at the example of a JavaScript function that calculates the square of a number.

The code is as follows Copy Code

function Square (x) {
return x*x;
}

function Print (msg) {
document.write (msg);
}

var i = 5;
var result = Square (i);
print (result);
function Square (x) {
return x*x;
}

function Print (msg) {
document.write (msg);
}

var i = 5;
var result = Square (i);
print (result);

Run Demo: 25

In some stylized programming languages, or in some well-defined programming, it is useful to always use a short function name. For example, the Prototype in JavaScript gracefully uses a function name of $ (yes, only one dollar sign) to replace the very common but difficult to enter document.getElementById (). Dollar sign $ and underscore _ are symbols that can be legitimately used for JavaScript markers in addition to numbers and letters.

Refer to the following code:

The code is as follows Copy Code


<script language=javascript>
Function $ (DOM)
{
return document.getElementById (DOM);
}
var con = $ (' Listcontainer ');
</SCRIPT>

JavaScript allows functions to be defined using the direct amount of the function. The direct amount of a function is an expression that can define an anonymous function. The syntax of the direct volume of a function is very similar to a function statement, except that it is used as an expression, not as a statement, and does not need to specify a function name.

The following program defines and invokes a direct measure function.

The code is as follows Copy Code


var f = (function (x) {return x*x;}) (10);
document.write (f);
var f = (function (x) {return x*x;}) (10);
document.write (f);


Run Result: 100

If the function has a return value, it can be received with a variable.

Find values for m+ (m+1) + (m+2) +...+ (n-1) +n:

The code is as follows Copy Code

<title> Find m+ (m+1) + (m+2) +...+ (n-1) +n value </title>
<body>
<script language= "JavaScript" type= "Text/javascript" >
function Gettotal (m,n) {
var total=0;
if (m>=n) {
return false; n must be greater than m, otherwise meaningless
}
for (Var i=m;i<=n;i++) {
Total+=i;
}
return total;
}
</script>
<p onclick= "alert (gettotal (1,100));" > Show 1+2+3+...+99+100 values </p>
</body>

Save and run the code, click on the text and show 5050.

We generally do this in the application

One, in HTML, you can invoke JavaScript in the form of "javascript:" Functions or methods, as follows:

The code is as follows Copy Code
<title> use "javascript:" </title>
<body>
<a href= "Javascript:alert (' You clicked the Hyperlink ')" > Please point me </a>
</body>

Second, "javascript:" Not only can invoke the JavaScript method, you can also invoke user-defined functions, as shown in the following code:

The code is as follows Copy Code
<title> use "javascript:" </title>
<script language= "javascript" type= "Text/javascript" >
<!--
function Onclicklink ()
{
Alert ("You clicked on this button");
}
-->
</script>
<body>
<a href= "Javascript:onclicklink ()" > Please point me </a>
</body>

Iii. Integration with events

  code is as follows copy code
<HTML>
    <title> combined with events </title
  <script language= "javascript" type= "Text/javascript"
   <!--
     function Onmouseoverlink ()
    {
     alert ("Your mouse is over the first hyperlink");
   }
  
  </script>
   <body
  <a href= "#" onmouseover= "Onmouseoverlink ()" > Please put the mouse over </a><br>
  <a href= "#" onclick= "Javascript:alert (' you clicked a second hyperlink ')" > Please click me </a> 
 </body>

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

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

Get Started for Free

  • Sales Support

    1 on 1 presale consultation

    Chat Contact Sales

  • After-Sales Support

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

    Open a Ticket

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

    Learn More