函数的概念

对于 js 来说，函数就是把任意一段代码放在一个 盒子 里面
在我想要让这段代码执行的时候，直接执行这个 盒子 里面的代码就行
函数也可以叫方法，将一段公共的代码封装起来，下次直接使用
定义一次可以多次调用

函数的两个阶段（重点）

按照我们刚才的说法，两个阶段就是 放在盒子里面 和 让盒子里面的代码执行

• 放在盒子里面（定义函数）
• 让盒子里面的代码执行（调用函数）

函数定义阶段

• 定义阶段就是我们把代码 放在盒子里面
• 我们就要学习怎么 放进去，也就是书写一个函数
• 我们有两种定义方式 声明式 和 赋值式

赋值式

• 其实就是和我们使用 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()

函数的参数（重点）

• 我们在定义函数和调用函数的时候都出现过 ()
• 现在我们就来说一下这个 () 的作用
• 就是用来放参数的位置
• 参数分为两种 行参 和 实参

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

脚下留心：

• function和函数名之间必须空格，函数名的命名规则和命名规范同变量
• 定义函数参数：叫形参，多个之间逗号隔开
• 调用函数参数：叫实参，多个之间逗号隔开
• 函数的形参个数和实参个数，必须一样，否则undefined 可能会导致代码有瑕疵
• 函数的形参顺序和实参顺序，必须一致，否则逻辑BUG 大瑕疵

行参和实参的作用

行参

就是在函数内部可以使用的变量，在函数外部不能使用
每写一个单词，就相当于在函数内部定义了一个可以使用的变量（遵循变量名的命名规则和命名规范）
多个单词之间以 , 分隔
如果只有行参的话，那么在函数内部使用的值个变量是没有值的，也就是 undefined
行参的值是在函数调用的时候由实参决定的

实参

在函数调用的时候给行参赋值的
也就是说，在调用的时候是给一个实际的内容的
函数内部的行参的值，由函数调用的时候传递的实参决定
多个参数的时候，是按照顺序一一对应的

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

参数的顺序和个数（细节）

• 函数的形参个数和实参个数，必须一样，否则undefined 可能会导致代码有瑕疵
• 函数的形参顺序和实参顺序，必须一致，否6则逻辑BUG 大瑕疵

函数(return★)

明确需求:

// 定义计算工资函数
function money(day, qian) {
    console.log('工作', day, '天，每天', qian, '块，共计：', day*qian);
}
// 调用
money(30, 1000);
// 有时候调用完函数后，需要里面的结果进一步判断等  关键怎么获取呢？

说明：在实在工作中，调用函数有时候需要直接输出，有时候需要返回数据让后面代码进一步判断操作
思考：直接输出五种输出语句根据情况选择，但是如何返回结果数据呢?
解决：在函数中使用return关键词

语法

// 定义
function 函数名(形参1,....,形参n) {
// 代码
return 数据;
}
​
// 调用
函数名(实参1,....,实参n);

脚下留心：
默认return undefined
return 返回的意思，作用1： 返回值、作用2： 终断函数

返回值

// 1.定义计算工资函数
function money(day, qian) {
// console.log('工作', day, '天，每天', qian, '块，共计：', dayqian);
return dayqian;
}
​
// 2.声明变量接受函数返回的结果
var data = money(30, 1000);
alert(data);
​
// 3.实战工作中可以进一步处理data

终断函数

• 当我开始执行函数以后，函数内部的代码就会从上到下的依次执行
• 必须要等到函数内的代码执行完毕
• 而 return 关键字就是可以在函数中间的位置停掉，让后面的代码不在继续执行
  function fn() {
  console.log(1)
  console.log(2)
  console.log(3)

// 写了 return 以后，后面的 4 和 5 就不会继续执行了
// return 666;
return; //相当于return undefined
//因为return终止代码执行，相当于循环中的break
//脚下留心：函数终止必须用return，循环终止必须用break
console.log(4)
console.log(5)
}
​
// 函数调用
fn()

函数(知识点总结)

函数三要素
函数三要素包括：函数名、参数、返回值

• 函数名：必写
• 参 数：根据需求，看函数体是否需要根据不同情况 变化
• 返回值：根据需求，看调用后，后续代码是否要根据函数结果进一步判断

定义函数参数叫：形参
调用函数参数叫：实参
形参个数和实参个数不一样：则没传的undefined、可能会带来代码问题
形参顺序和实参顺序不一致：逻辑错误 绝对大BUG

return作用
1返回结果数据（注：return不写则默认或return; 都是 return undefined）
2终止代码执行

函数的优点

• 明确：什么是函数，就是将一段代码的封装起来，一次定义多次调用
• 好处：
  1.封装、减少代码冗余，复用代码
  2.方便维护开发 一个地方改其他地方都好了