函数初级
一 概念
#### 1、函数的定义
- ES5
```js
function 函数名 (参数列表) {
函数体;
}
var 函数名 = function (参数列表) {
函数体;
}
```
- ES6
```js
let 函数名 = (参数列表) => {
函数体;
}
```
- 匿名函数
```js
(function (参数列表) {
函数体;
})
// 匿名函数需要自调用
(function (参数列表) {
函数体;
})(参数列表);
```
#### 2、函数的调用
- 函数名(参数列表)
#### 3、函数的参数
- 个数不需要统一
```js
function fn (a, b, c) {
console.log(a, b, c); // 100 undefined undefined
}
fn(100);
function fn (a) {
console.log(a) // 100
}
fn(100, 200, 300) // 200,300被丢弃
```
- 可以任意位置具有默认值
```js
function fn (a, b=20, c, d=40) {
console.log(a, b, c, d); // 100 200 300 40
}
fn(100, 200, 300);
```
- 通过...语法接收多个值
```js
function fn (a, ...b) {
console.log(a, b); // 100 [200 300]
}
fn(100, 200, 300);
// ...变量必须出现在参数列表最后
```
#### 4、返回值
```js
function fn () {
return 返回值;
}
// 1.可以空return操作，用来结束函数
// 2.返回值可以为任意js类型数据
// 3.函数最多只能拥有一个返回值
```
二 代码示范
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>函数初级</title>
</head>
<body>
函数初级
</body>
<script type="text/javascript">
// 0.函数的调用
// 函数名(参数列表)
// 1.ES5函数定义
function fn1() {
console.log("fn1 函数");
}
fn1();
var fn2 = function () {
console.log("fn2 函数");
}
fn2();
// 2.ES6函数定义
let fn3 = () => {
console.log("fn3 函数");
}
fn3();
// 3.匿名函数
// (function () {
// console.log("匿名函数");
// })
// 匿名函数定义后,无法使用,所以只能在定义阶段自调用
let d = "匿名";
(function (t) {
console.log(t + "函数");
})(d);
</script>
<script type="text/javascript">
// 函数的参数
// 注:js参数都是位置参数
// 参数不统一
function fun1 (a, b, c) {
console.log(a, b, c); // 100 undefined undefined
}
fun1(100);
function fun2 (a) {
console.log(a); // 100
}
fun2(100, 200, 300); // 200,300被丢弃
// 默认值参数
function fun3 (a, b=20, c, d=40) {
console.log(a, b, c, d); // 100 200 300 40
}
fun3(100, 200, 300);
// 不定长参数
function fun4 (a, ...b) {
console.log(a, b); // 100 [200 300]
}
fun4(100, 200, 300);
// ...变量必须出现在参数列表最后
</script>
<script type="text/javascript">
// 返回值
// 1.空返回
var func1 = function (num) {
if (num == 0) return; // 用来结束函数
console.log('num: ', num);
}
func1(100);
// 2.返回值类型任意,但只能为一个值
var func2 = function (a, b) {
// return a, b, a + b; // 不报错,但只返回最后一个值
return a + b;
}
// 注:函数返回值就是函数的值,外界可以用变量结束函数执行后的函数值
var res = func2(10, 20);
console.log("和:%d", res);
</script>
</html>
