JavaScript--函数：

函数：

认识函数

• 函数是一个 js 的数据类型, 叫做 Function

• 是一个复杂数据类型(地址/引用

• 私人: 就是一个 “盒子”, 这个 “盒子” 可以承载一段代码

• 涉及到两个过程：

  函数定义阶段: 把代码装进盒子的过程

  函数调用阶段: 把盒子内的代码执行的过程

函数定义阶段

• 就是一个把代码装进 “盒子” 的过程
• 在这个过程中, 被装进去的代码是不会执行的

方式1: 声明式函数

语法: function 函数名() { 你要装进盒子的代码 }

• function 定义函数的关键字
• 函数名 你给这个盒子起的一个名字, 遵守变量命名规则和规范
• () 书写参数的位置
• {} 代码段, 你要装进盒子的代码

方式2: 赋值式函数(函数表达式)

• 就是把函数当做一个表达式赋值给另外的内容
• 语法: var fn = function () {}

函数调用阶段

两种定义函数的方式, 他们的 调用方式 是一样的

语法: 函数名()

函数名 表示你需要哪一个函数内的代码执行

() 把函数内的代码执行一遍

两种定义函数的方式, 他们的 调用时机 是不一样的

• 声明式函数可以先调用也可以后调用
• 赋值式函数(函数表达式) 只能后调用, 先调用会报错

// 函数调用的时机问题
   // 在函数声明以前调用
    fn()
    function fn() { console.log('我是一个声明式函数') }
    // 在函数声明以后调用
    fn()

// 在函数声明以前调用, 直接报错
    // fn2() // fn2 is not a function
    var fn2 = function () { console.log('我是一个赋值式函数') }
    // 在函数声明以后调用
    fn2()

函数的参数

在函数内, 参数有两种:

形参:

• 书写在函数定义阶段的 () 内
• 就是一个只能在函数内部使用的变量
• 可以书写多个, 书写多个的时候中间使用 逗号(,) 分隔
• 形参的值有函数调用时传递的实参决定

实参

• 书写在函数调用阶段的 () 内
• 就是按照顺序依次给形参进行赋值的数据
• 可以书写多个, 书写多个的时候中间使用 逗号(,) 分隔

函数的参数默认值

• 给函数的形参添加一个默认值
• 当你没有传递实参的时候, 可以使用默认值
• 语法: 直接给形参进行赋值即可

// 函数的参数默认值
    function fn(a = 100, b = 200) {
      console.log('a : ', a)
      console.log('b : ', b)
    }

    // 本次调用没有传递实参, a 和 b 形参都使用默认值
    fn()

    // 本次调用传递了一个实参给到 a, 那么 a 就是被赋值为 1, b 依旧是用默认值
    fn(1)

    // 本次调用传递了两个实参分别给到 a 和 b 了
    fn(10, 20)

//案例1: 求任意两个数字的和, 把结果显示在控制台
function fn1(a, b) {
      // a 和 b 就是要求和的两个数字
      // 1. 求和
      var res = a + b

      // 2. 输出
      console.log(res)
    }

    // 将来想求 10 和 20 的和
    fn1(10, 20)

案例2: 求任意三个数字的和, 把结果显示在控制台

  function fn2(a, b, c) {

​    var res = a + b + c

​    console.log(res)

   }



   fn2(10, 20, 30)

案例3: 求任意个数字的和, 把结果显示在控制台

​ + 当可变的内容数量不可控的时候

​ + 我们的参数不好决定了

​ + 可以利用 arguments 解决问题

​ => 遍历 arguments, 把每一个数据叠加

  function fn3() {

   // 1. 准备变量接受求和结果

   var sum = 0



   // 2. 遍历 arguments

   for (var i = 0; i < arguments.length; i++) {

​    // 3. 把 arguments 内的每一个数据叠加到 sum 身上

​    sum += arguments[i]

   }



   // 4. 把 sum 输出

   console.log(sum)

  }



  fn3(10, 20, 30, 40, 50)

  fn3(10, 20, 30, 40)

  fn3(10, 20, 30)

  fn3(10, 20)

  fn3(10)

  fn3()