JavaScript function definition

Define function

In JavaScript, the way to define a function is as follows:

function abs(x) {
if (x >= 0) { return x ;
} else { return -x;
}
}

The above abs() function is defined as follows:

function points out that this is A function definition; abs is the name of the function; the parameters of the function are listed in (x) brackets, and multiple parameters are separated by,; the code between {...} is the function body, which can contain several statements, or even without any statement.

Please note that when the statements inside the function body are executed, once the return is executed, the function will be executed and the result will be returned. Therefore, very complex logic can be implemented inside the function through conditional judgment and looping.

If there is no return statement, the result will be returned after the function is executed, but the result will be undefined.

Since a JavaScript function is also an object, the abs() function defined above is actually a function object, and the function name abs can be regarded as a variable pointing to the function.

Therefore, the second way to define a function is as follows:

var abs = function (x) {
if (x >= 0) { return x;
} else { return -x;
}
};

##In this way, function (x) { ... } is an anonymous function, it has no function name. However, this anonymous function is assigned to the variable abs, so the function can be called through the variable abs.

The above two definitions are completely equivalent. Note that the second method requires adding a ; at the end of the function body according to the complete syntax, indicating the end of the assignment statement.

Function is one of the core of JavaScript language. Its basic syntax is as follows: ##function functionName(arg0, arg1, ...) {

statements

}

Grammar interpretation

Use the function keyword to define a function

The function keyword is followed by a space followed by the function name

The function name is followed by a pair of parentheses. arg0 and arg1 represent the parameters of the function. The parameters are separated by ",". The number of parameters can be 0-25 (0 means no parameters). When there are no parameters, the () brackets cannot be omitted. Parameters exceeding 25 will be ignored by JavaScript

{} is the function body, which contains the functional statements to be implemented by the function

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
    <script type="text/javascript">  
          function hello(name){
          document.write((name + "，你好！"));
        }
    </script>  
</head>  
<body>  
  <input type="button" onclick="hello('小明')" value="确定"/>
</body>  
</html>

Function expression

#JavaScript functions can be defined by an expression.

Function expressions can be stored in variables:

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

After the function expression is stored in the variable, the variable can also be used as a function:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
var x = function (a, b) {return a * b};
document.getElementById("demo").innerHTML = x(6, 9);
</script>
</body>
</html>

##Function Hoisting(Hoisting)

In the previous tutorial we have Learned about "hoisting".

Hoisting is JavaScript’s default behavior of hoisting the current scope to the front.

Hoisting is applied to variable declarations and function declarations.

Therefore, the function can be called before declaration:

myFunction(5);
function myFunction(y) {
return y * y;
}

Cannot be promoted when using an expression to define a function.

arguments

JavaScript also has a free keyword arguments, which is only inside the function Works and always points to all parameters passed in by the caller of the current function.

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
    <script type="text/javascript">  
       function foo(x) {
            alert(x); // 10
            for (var i=0; i<arguments.length; i++) {
            alert(arguments[i]); // 10, 20, 30
            }
          }
        foo(10, 20, 30);
    </script>  
</head>  
<body>  
</body>  
</html>

Function is an object

Using the typeof operator in JavaScript to determine the function type will return "function".

But it is more accurate to describe a JavaScript function as an object.

JavaScript functions have properties and methods.

arguments.length property returns the number of parameters received by the function calling process:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<p id="demo"></p>
<script>
function myFunction(a, b) {
    return arguments.length;
}
document.getElementById("demo").innerHTML = myFunction(4,7,3);
</script>
</body>
</html>

Continuing Learning

new file

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> <script type="text/javascript"> function hello(name,age){ document.write("我叫" + name + "，今年" + age + "岁！"); } </script> </head> <body> <input type="button" onclick="hello('小明',18)" value="确定" /> </body> </html>

submit Reset Code

Automatic operation

JavaScript function definition

ElementaryImperial CMS enterprise imitation website tutorial

ElementaryNewbies with zero foundation in WordPress build personal blogs and corporate websites

ElementaryUltimate CMS zero-based website building instruction video

ElementaryFront-end project-Shangyou [HTML/CSS/JS technology comprehensive practice]

IntermediateVue3.0 from 0 to build a universal backend management system project practice

ElementaryZero-based front-end course [Vue advanced learning and practical application]

ElementaryWEB front-end tutorial [HTML5+CSS3+JS]

ElementaryQuick introduction to apipost

IntermediateVue3+TypeScript practical tutorial-enterprise-level project practice

ElementaryLet's briefly talk about starting a business in PHP

IntermediateVUE e-commerce project (front-end & back-end dual project actual combat)

ElementaryApipost practical application [api, interface, automated testing, mock]