day05

80 阅读4分钟

1.函数的概念

  • 函数的概念

      *      首先一定要明确, 和数学中的函数完全是两回事
      * 
      *      在 JS 中, 函数可以理解为 一段在程序(页面)中  多次出现的代码段 封装起来的盒子
      * 
      * 
      *      简单来说, JS 的函数就是一个盒子, 盒子里边装的是  在当前页面中 多次出现的 较为复杂的代码段
    

2.函数的使用

     *  函数的使用
     * 
     *      1. 函数的定义(创建一个盒子)
     * 
     *      2. 函数的调用(使用盒子内的代码)
     * 
     * 
     *      如果函数只定义 不调用, 那么没有任何意义
    */

    /**
     *  1. 函数的定义
     *          分为两种方式定义
     * 
     *              1.1 声明式定义
     *                      语法: function fn () {}
     *                              function:   关键字 -> 表明后续的是一段函数
     *                              fn:         函数的名字 -> 将来函数调用的时候需要用到, 函数名自定义
     *                              ():         内部填写参数 -> 欠着, 后续详细的讲解
     *                              {}:         内部填写函数调用时要执行的代码段
     * 
     *              1.2 赋值式定义
     *                      语法: var fn = function () {}
    */

    // 1.1 声明式定义函数
    function fn1() {
        console.log('我是 fn1 函数')
    }

    // 1.2 赋值式定义函数
    var fn2 = function () {
        console.log('我是 fn2 函数')
    }

    /**
     *  2. 函数的调用
     *      不管是 声明式还是赋值式定义的函数, 调用方式都是一样的
     * 
     *          调用语法: 函数名()  /   变量名()
    
    

3.声明式与赋值式

*  声明式与赋值式的区别
     * 
     *      1. 写法不同
     *      2. 调用上略有不同
     *              声明式定义的函数, 可以在 函数定义前 去调用  (先不考虑原理)
     *              赋值式定义函数, 不能再函数定义前 去调用
     *          
     *     赋值式定义函数不能再函数定义前调用的原因
     
     *          赋值式定义, 其实就是声明一个变量, 然后给他赋值为一个函数
     *          
     *          再 JS 中, 如果再定义变量之前 使用变量的话, 那么变量的值为 undefined     (变量提升   面试可能会问)
     * 
     *      函数的执行结果, 一般默认都是 undefined,     除非手动更改
     
    // 1.1 声明式定义函数
    // fn1()
    // console.log('我是fn1函数定义前的 输出~~~~~~~')
    function fn1() {
        console.log('我是 fn1 函数')
    }
    // fn1()
    // fn1()

    // 1.2 赋值式定义函数
    // fn2()
    // console.log(fn2)    // undefined
    var fn2 = function () {
        console.log('我是 fn2 函数')
    }
    // fn2()
     
     

4.函数的参数

*  函数的参数
     * 
     *      函数的参数如何书写?
     *              书写再 function 后的 小括号内
     *      参数的作用?
     *          如果一个函数没有书写参数, 那么这个函数的功能相对来说比较单一
     *          如果书写了参数, 能够使我们这个函数的使用更加灵活
     * 
     *      参数的书写, 分为两个
     *              1. function 后的小括号内 书写的参数我们叫做 "形参"!!!
     *                      形参的作用: 书写之后, 相当于在函数内部创建了一个变量, 变量实际的值由  "实参" 传递
     *              2. 函数名后的小括号内 书写的参数我们叫做 "实参"!!!
     *                      实参的作用: 将自身的值, 按照一一对应的关系, 传递给 形参
     
     

5.函数参数的注意

*  函数的参数
     *      形参 和 实参    两个的数量, 要一一对应
     * 
     *          1. 形参的数量如果大于实参
     *                  如果 形参的数量大于实参的数量, 那么会将 实参按照顺序一一传递给 对应的形参
     *                  多出来的形参, 相当于变量只定义没赋值, 所以他们的值  是 undefined
     * 
     *          2. 实参的数量如果大于形参
     *                  如果 实参的数量大于形参的数量, 那么会将 实参按照顺序 一一传递给对应的形参
     *                  多出来的实参, 无法在函数内部通过参数的方式调用
    */

    // function fn(a, b, c, d) {
    //     console.log(a, b, c, d)
    // }
    // fn(1, 2)

    // function fn1(a, b) {
    //     console.log(a, b)
    // }
    // fn1(100, 200, 300, 400, 500)

    /**
     *  函数参数的默认值
     * 
     *      函数再创建形参的时候, 默认给一个值, 将来在调用函数的时候, 
     *      如果没有传递那么这个形参的值也不会是 undefined 而是给的默认值
     * 
     *      如果传递了对应的值, 那么形参的值是实参传递进来的值, 否则按照默认值来运行
     
     
     

6.函数的返回值

*  函数的返回值(函数的执行结果)
     * 
     *      JS 有一个规定: 在函数内部创建(定义)的变量, 只能在函数内部使用
     *                    后续学习作用域的时候, 会详细讲解
     * 
     * 
     *      我们如果想在函数外部得到函数内部的某一个值, 或者运算结果, 
     *      我们可以通过 return 这个关键字来帮我们完成

7.return的注意事项

 *  retrun 的注意事项
     * 
     *      return 具有中断函数的能力
     * 
     *      所以一般来说我们将它放在函数的尾部
     
       function fn() {
        console.log(1)
        console.log(2)
        return 666
        console.log(3)
        console.log(4)
        console.log(5)
    }
    fn()
    

8.