Day06 函数_综合

一、函数的概念

1.概念：实现功能/效果的代码块

.理解:将需要的程序封装定义在一个函数中,通过调用函数调用对应的程序

// 这个是我们以前写的一段代码
for (var i = 0; i < 10; i++) {console.log(i)
}// 函数，这个 {} 就是那个 “盒子”
function fn() {// 这个函数我们以前写的代码for (var i = 0; i < 10; i++) {console.log(i)}
}

2.优点

定义一次可以多次调用执行

减少冗余代码提高程序的执行效率 高内聚低耦合

有更好的可操作性和可维护性

二.函数的两个阶段/步骤(重点)

封装定义（只是在定义函数程序，没有调用执行函数程序）

声明式

使用 function 这个关键字来声明一个函数

语法：

function fn（）{
//一段代码
//function：声明函数的关键字，表示接下来是一个函数了
//fn：函数的名字，我们自己定义的（遵循变量名的命名）
//（）必须写，是用来放参数的位置
//{}用来放代码的位置（也就是上面说的的盒子）}

赋值式

其实就是和我们使用 var 关键字是一个道理了
首先使用 var 定义一个变量，把一个函数当作值直接赋值给这个变量就可以了

语法：

var fn = function () {  
// 一段代码
}
// 不需要在 function 后面书写函数的名字了，因为在前面已经有了

调用执行（函数程序正事的被调用执行）

就是让盒子里面的代码执行一下，让函数执行，两种定义函数的方式不同，但是调用函数的方式都以一样的

函数调用就是直接写 `函数名()` 就可以了
//声明式函数
function fn（）{console.log（‘我是fn函数’）；
}
//调用函数
fn（）//赋值式函数
var fn2 =function（）{
console.log('我是fn2函数');
}//调用函数
fn（）

注： 定义完一个函数以后，如果没有函数调用，那么写在 { } 里面的代码没有意义，只有调用以后才会执行

调用上的区别：

声明式函数：调用可以在 定义之前或者定义之后

// 可以调用
fn()// 声明式函数
function fn() {console.log('我是 fn 函数')
}// 可以调用
fn()

赋值式函数：调用只能在定义之后

// 会报错
fn()// 赋值式函数
var fn = function () {console.log('我是 fn 函数')
}// 可以调用
fn()

三，函数的参数（重点）

1.参数分为两种行参和实参

// 声明式
function fn(行参写在这里) {// 一段代码
}fn(实参写在这里)// 赋值式函数
var fn = function (行参写在这里) {// 一段代码
}
fn(实参写在这里)

2.行参和实参的作用

A..行参

就是在函数内部可以使用的变量，在函数外部不能使用
每写一个单词，就相当于在函数内部定义了一个可以使用的变量（遵循变量名的命名规则和命名规范）

多个单词之间以 , 分隔

// 书写一个参数
function fn(num) {// 在函数内部就可以使用 num 这个变量
}var fn1 = function (num) {// 在函数内部就可以使用 num 这个变量
}// 书写两个参数
function fun(num1, num2) {// 在函数内部就可以使用 num1 和 num2 这两个变量
}var fun1 = function (num1, num2) {// 在函数内部就可以使用 num1 和 num2 这两个变量
}注：
- 如果只有行参的话，那么在函数内部使用的值个变量是没有值的，也就是 `undefined`
- **行参的值是在函数调用的时候由实参决定的

B.实参

在函数调用的时候给行参赋值的

也就是说，在调用的时候是给一个实际的内容的

function fn(num) { // 函数内部可以使用 num}
?// 这个函数的本次调用，书写的实参是 100
// 那么本次调用的时候函数内部的 num 就是 100
fn(100)?// 这个函数的本次调用，书写的实参是 200
// 那么本次调用的时候函数内部的 num 就是 200
fn(200)

**函数内部的行参的值，由函数调用的时候传递的实参决定**

**多个参数的时候，是按照顺序一一对应的**

function fn(num1, num2) {// 函数内部可以使用 num1 和 num2
}// 函数本次调用的时候，书写的参数是 100 和 200
// 那么本次调用的时候，函数内部的 num1 就是 100，num2 就是 200
fn(100, 200)

3.参数个数的关系

1.行参比实参少

因为是按照顺序一一对应的

行参少就会拿不到实参给的值，所以在函数内部就没有办法用到这个值

function fn(num1, num2) {// 函数内部可以使用 num1 和 num2
}// 本次调用的时候，传递了两个实参，100 200 和 300
// 100 对应了 num1，200 对应了 num2，300 没有对应的变量
// 所以在函数内部就没有办法依靠变量来使用 300 这个值
fn(100, 200, 300)

2.行参比实参多

因为是按照顺序一一对应的

所以多出来的行参就是没有值的，就是 `undefined`

function fn(num1, num2, num3) {// 函数内部可以使用 num1 num2 和 num3
}// 本次调用的时候，传递了两个实参，100 和 200
// 就分别对应了 num1 和 num2
// 而 num3 没有实参和其对应，那么 num3 的值就是 undefined
fn(100, 200)

四，函数的return（重点）

`return` 返回的意思，其实就是给函数一个 返回值 和 终断函数

终断函数

当我开始执行函数以后，函数内部的代码就会从上到下的依次执行
必须要等到函数内的代码执行完毕

而 return 关键字就是可以在函数中间的位置停掉，让后面的代码不在继续执行

function fn() {console.log(1)console.log(2)console.log(3)// 写了 return 以后，后面的 4 和 5 就不会继续执行了returnconsole.log(4)console.log(5)
}// 函数调用
fn()

返回值

函数调用本身也是一个表达式，表达式就应该有一个值出现

现在的函数执行完毕之后，是不会有结果出现的

// 比如 1 + 2 是一个表达式，那么 这个表达式的结果就是 3
console.log(1 + 2) // 3function fn() {// 执行代码
}// fn() 也是一个表达式，这个表达式就没有结果出现
console.log(fn()) // undefined

`return` 关键字就是可以给函数执行完毕一个结果

function fn() {// 执行代码return 100
}// 此时，fn() 这个表达式执行完毕之后就有结果出现了
console.log(fn()) // 100我们可以在函数内部使用 `return` 关键把任何内容当作这个函数运行后的结果

return的基本作用
	1, 定义函数的执行结果返回值
	2, 终止函数中之后程序的操作

 function fun() {// console.log() 是 函数程序的一部分 // 调用函数程序 函数程序执行 执行后的效果 是 向 控制台输出数值 111// 不是函数程序的 执行结果 返回值console.log(111);// 通过 return 关键词 定义了函数的执行结果返回值是 字符串abc// 也就是 fun() 的 执行结果 是 字符串abcreturn `abc`;// return 之后的程序 会被 终止 不再执行console.log(222);}// 调用 fun() 的执行结果是 return的内容 也就是 字符串abc// 也就是 变量res 中 存储的数据是 字符串abcvar res = fun();console.log(res);//  为什么有returnfunction fun2(id, age) {var int = 100;// 通过return 将形参id中  存储的数值 张三// 作为函数的执行结果返回值 抛出函数之外// 作为fun2（）调用结果 可以赋值 输出  操作。。return id;}// 定义了return 也就是函数定义了 执行结果的返回值// 也就是fun 2（‘张三’，18）；的执行结果是形参id中存储的数值数据// 也就是fun2（‘张三’，18）；的执行结果是 字符串张三// 也就是 变量res中 存储的是fun2（‘张三’，18）；的执行结果是字符串张三var res = fun2(`张三`, 18);console.log(res);//此时显示的是张三// fun2(`张三`,18);// 定义在函数内部的变量int// 定义在函数内部的形参name  形参age// console.log(int);// console.log(id);// 此时会出现报错，不能用，只能通过return/*函数的执行结果返回值1.函数中定义的  变量/参数/数据只要是写在函数里面的   还是外部的都不能直接调用2.函数（）/变量名称（）调用函数就可以理解为在执行一个程序运算也就是函数()/变量名称()调用函数 一定会有一个执行结果 /返回值通过return 关键词 来定义函数的执行结果/返回值return 定义的 数据是什么   函数的执行结果/返回值就是什么3.return返回的是   变量/表达式/形参 的数据数值不是在函数之外  可以调用return的变量/形参4.没有定义的return的函数  执行结果 /返回值   一律是undefinedreturn的作用2终止函数程序的执行return 定义执行执行结果返回值 同时会终止函数中之后程序的执行*/

Day06 函数