Home > Article > Web Front-end > 【JavaScript Tutorial】JavaScript Function

【JavaScript Tutorial】JavaScript Function

黄舟Original: 2016-12-24 14:50:05904browse

JavaScript Functions

A function is an event-driven or reusable block of code that executes when it is called.

Example

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}
</script>
</head>

<body>
<button onclick="myFunction()">Try it</button>
</body>
</html>

JavaScript function syntax

A function is a block of code wrapped in curly braces, with the keyword function used in front:

function functionname()
{
执行代码
}

When the function is called, the code within the function will be executed.

Functions can be called directly when an event occurs (such as when the user clicks a button), and can be called from anywhere by JavaScript.

JavaScript is case sensitive. The keyword function must be lowercase, and the function must be called with the same case as the function name.

Call a function with parameters

When you call a function, you can pass it values, which are called parameters.

These parameters can be used in functions.

You can send as many parameters as you like, separated by commas (,):

myFunction(argument1,argument2)

When you declare a function, declare the parameters as variables:

function myFunction(var1,var2)
{
代码
}

Variables and parameters must appear in the same order. The first variable is the given value of the first parameter passed, and so on.

Example

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>

<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>

The above function will prompt "Welcome Harry Potter, the Wizard" when the button is clicked.

The function is flexible, you can call it with different parameters, which will give different messages:

Example

<button onclick="myFunction(&#39;Harry Potter&#39;,&#39;Wizard&#39;)">Try it</button>
<button onclick="myFunction(&#39;Bob&#39;,&#39;Builder&#39;)">Try it</button>

Depending on the different buttons you click, the above example will prompt "Welcome Harry Potter, the Wizard" or "Welcome Bob, the Builder".

Functions with return values

Sometimes, we want a function to return a value to the place where it was called.

This can be achieved by using the return statement.

When using the return statement, the function will stop execution and return the specified value.

Syntax

function myFunction()
{
var x=5;
return x;
}

The above function will return the value 5.

Note: The entire JavaScript will not stop executing, just the function. JavaScript will continue executing code from where the function was called.

Function calls will be replaced by return values:

var myVar=myFunction();

The value of the myVar variable is 5, which is the value returned by the function "myFunction()".

Even without saving it as a variable, you can use the return value:

document.getElementById("demo").innerHTML=myFunction();

The innerHTML of the "demo" element will be 5, which is the value returned by the function "myFunction()".

You can make the return value based on the parameters passed into the function:

Example

Calculate the product of two numbers and return the result:

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

document.getElementById("demo").innerHTML=myFunction(4,3);

The innerHTML of the "demo" element will be:

In case you just want You can also use the return statement when exiting a function. The return value is optional:

function myFunction(a,b)
{
if (a>b)
  {
  return;
  }
x=a+b
}

If a is greater than b, the above code will exit the function and not calculate the sum of a and b.

Local JavaScript Variables

A variable declared inside a JavaScript function (using var) is a local variable, so it can only be accessed inside the function. (The scope of this variable is local).

You can use local variables with the same name in different functions because only the function in which the variable is declared will recognize the variable.

As soon as the function completes running, the local variable will be deleted.

Global JavaScript variables

Variables declared outside a function are global variables and can be accessed by all scripts and functions on the web page.

JavaScript 变量的生存期

JavaScript 变量的生命期从它们被声明的时间开始。

局部变量会在函数运行以后被删除。

全局变量会在页面关闭后被删除。

向未声明的 JavaScript 变量分配值

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：

carname="Volvo";

将声明一个全局变量 carname，即使它在函数内执行。

以上就是【JavaScript教程】JavaScript 函数的内容，更多相关内容请关注PHP中文网（www.php.cn）！

Statement：

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Previous article：[JavaScript Tutorial] JavaScript data typesNext article：[JavaScript Tutorial] JavaScript data types

See more

【JavaScript Tutorial】JavaScript Function

Related articles