函数的基本概念以及函数封装

函数的基本概念

    // 什么是函数:
    
    // 实现固定功能的代码块
    // 函数是工具,是实现功能的工具
    // 函数是通过其中的代码,来实现所谓的功能

    // 函数的特点:
    //   封装: 将需要的代码,写入到函数中
    //   重复: 一个函数可以反复调用
    //   调用: 可以在任意需要位置上调用执行代码

    // 函数的定义/函数的封装
    // 函数的定义/封装 有固定的语法形式
    /*
        function 函数名称(函数的参数){
            函数的代码;
            return 内容;
        }
    
        function    定义函数/封装 的关键词,作用类似于 关键词var 
                    告诉计算机程序,我正在封装的是一个函数

        函数名称     也就是这个函数的名称,之后调用函数时,是通过函数名称来调用函数,并且执行函数

        函数的参数   执行函数时,输入给函数的数据信息

        函数的代码   定义在{}中的程序,是函数执行时,调用的程序内容

        return      函数的返回值;

    */
    
    // 函数的封装/函数的定义
    // 函数封装时,程序并没有被执行,只有在函数调用时,程序才会被执行
    function fun(){
        console.log(123);
    }

    // 函数的调用和执行
    fun();

    // 1,定义函数阶段,只是将程序定义在函数内,程序并没有执行
    //   是有在调用函数时,封装在函数内部的程序,才会被执行

    // 2,函数命名的规范 --- 与变量的命名规范相同
    //     规则 : 只能使用 数字,字母,下划线_,美元$
    //            不能以数字开头
    //            区分大小写
    //     规范 : 见名知意
    //            驼峰命名法

    // 3,所谓的封装,就是将程序,放在 函数的 { } 中,就是函数程序的封装

    // 4,函数的调用
    //   调用执行执行,必须使用函数的固定语法, 函数名称() 的方式来调用函数

// 在定义函数之前,先调用函数

    // 声明方式定义的函数,可以正常执行
    fun1();

    // 赋值方式 / 匿名函数,不能正常执行,会报错
    fun2();

    // JavaScript中,函数的定义方式/语法

    // 1,声明方式
    // 通过关键词,function 来定义和声明函数

    // 封装函数,但是函数不会执行
    // 也就是我现在组装好了一个微波炉,但是就放在那儿没有用
    function fun1(){
        console.log('我是声明方式定义的函数1');
    }
    
    // 调用函数,执行执行
    // 相当于我在这里使用微波炉
    // fun1();

    // 2,匿名函数 / 赋值方式
    // 定义函数时,不定义函数,名称,将函数赋值给一个变量
    // 然后通过调用变量名称()的形式来调用函数

    var fun2 = function(){
        console.log('我是匿名函数,也叫赋值方式,定义的函数');
    };

    // 调用时,是通过变量名称()来调用函数
    // fun2();
    
    // 定义函数的语法的区别
    // 声明方式:  可以在程序的任意位置上,调用函数,甚至可以在定义函数之前,就调用函数,执行函数
    // 赋值方式/匿名函数: 只能在定义函数之后,再调用函数

函数在封装时和调用时,计算机的基本执行步骤和执行原理

        1,基本数据类型和复杂数据类型,在定义和存储数据时的区别
            基本数据类型 : 布尔 数值 字符串 undefined null
            复杂数据类型 : 对象 数组 函数

            在计算机存储数据的过程中,将变量,存储在内存当中

            在内存中计算机程序执行是,将内存中的存储空间虚拟的分成了两个部分

                栈 和 堆  两个部分 来存储数据

                基本数据类型,都存储在 栈 当中 

                复杂数据类型,都存储在 堆 当中
            
             
        var a = 100; 
            这是在定义一个基本数据类型
            a = 100 存储在 栈 中
            变量名称 a 中 存储的就是 数值100
            调用变量a,就是调用其中存储的数据100

        var b = function (){}
            这是在定义一个复杂数据类型
            function(){}  函数存储在 堆 当中,并且计算机操作系统,给这个函数定义了一个 内存地址 例如 0f0
            b 这个变量 存储在 栈 当中 
            b 这个变量 存储的是 函数的内存地址 0f0
            调用变量b , 实际上是调用 0f0 这个地址 , 找到地址对应的函数 , 调用函数中的程序
  // 参数
    // 是函数执行时,定义的数据,或者是执行的对象,内容等

    // 定义一个累加求和的函数

    // 在函数的()中,来定义函数的参数
    // 参数定义,也就是定义函数使用的两个变量

    function add(min,max){
        var res = 0;
        for(var i = min ; i <= max ; i++){
            res += i;
        }
        console.log(res);            
    }

    add(1,100);

    add(1,10);

    add(90,100);

// 定义累加求和函数

    // 定义在函数内部的变量,参数等,在函数外部不能直接使用
    // 相当于冰箱里的熊猫,不能直接拿出来用,必须要打开冰箱门,才能获取到熊猫

    // return关键词的作用
    //   1,定义函数的返回值
    //     如果没有 return , 函数的返回值是 undefined
    //   2,return会终止之后,函数程序的执行

    function add(min , max){
        var res = 0;
        for(var i = min ; i <= max ; i++){
            res += i;
        }
        return res;
    }

    var a = add(1,100);

    console.log(a);

// 函数的基本封装步骤

    // 1,定义程序来实现功能的需求
    // 2,定义函数,将程序放在{}中,封装程序
    // 3,定义参数
    // 4,定义返回值
    // 5,考虑容错机制
    //     函数的执行,对于参数是要有要求的,如果参数出现问题
    //     要么终止程序的执行,要么对参数进行处理
    //     方式1: 使用return来终止函数的执行
    //         在switch判断和循环语句中,可以使用break来终止程序
    //         在函数中药终止函数的执行,不能使用break
    //         需要使用return关键词;
    //     方式2: 对数据进行调整
    // 6,考虑函数参数的默认值
    // 7,给函数定义函数说明
    //     代码规范中规定,所有的自定义函数,都要写函数说明
    //     每个公司对于函数说明的语法规范都不相同,我们现在先了解一个基本格式

    // 函数说明   param  参数的意思  是对参数的说明
    //           一般写  参数的名称  数据类型  作用
    //           return  返回值的意思 是对返回值的说明
    //           return  返回值的名称 数据类型 作用

    // @param min int 累加求和的起始数值,默认值是1,整数类型
    // @param max int 累加求和的终止数值,整数类型
    // @return res int 累加求和的结果,整数类型

    // 函数功能作用的描述:
    // 累加求和函数,默认累加求和的起始值是1,终止值需要输入,累加求和的结果是res
    // 对于输入数据的大小顺序有容错处理
    // 对于输入数据的类型判断,有待后期增加

    // 封装累加求和函数

    // 默认是从1开始执行累加
    // 给形参定义默认值是1,并且写在形参的最后

    // 现在要交换 a 和 b 两个变量中存储的数据
    // 不能直接相互赋值,必须要建立一个中间变量

    // 定义中间变量
    var c = 0;
    // 中间变量存储a
    c = a;
    // a中存储b
    a = b;
    // b存储中间变量,也就是a的原始值
    // 完成数据交换
    b = c;

    console.log(a,b);

// 函数参数的默认值

    // 因为实参赋值是有顺序的
    // 带有默认值的形参,一般都写在形参的最后
    
    
    // 正常定义函数和参数
    function fun(name,age){
        console.log(`姓名是${name},年龄是${age}`);
    }
    // 函数执行是输入实参
    fun('李四' , 180);

    // 给函数的参数定义默认值
    // 语法与给变量赋值是相同的语法 形参 = 数值

    // 给形参定义默认值
    function fun2(name,age=18){
        console.log(`姓名是${name},年龄是${age}`);
    }
    // 调用执行函数时,如果没有对应形参赋值
    // 王五 只是给 name 形参赋值
    // age 形参在调用函数时 没有赋值实参 
    // 就执行 定义的默认值

    // 如果有赋值,执行的是重复赋值,定义的实参会覆盖定义的默认值

    // 如果形参,没有默认值,也没有赋值实参,也就是形参没有赋值
    // 执行结果是undefined
    fun2('王五');

总结
一,定义:
实现功能的代码块
工具,实现项目功能的工具

    二,优点:
        封装
        重复使用
        任意位置调用

    三,语法
        1,关键词 : function
        2,函数名称 : 符合变量的命名规范
        3,函数的参数 : 函数的执行数据
        4,函数的程序 : 封装在函数{}中的程序内容
        5,函数的返回值 : return 定义函数的返回值,并且会终止之后函数程序的执行

    四,函数的封装方式
        1,声明式
            function fun(){
                return 100;
            }

        2,匿名式,赋值式
            var fun1 = function(){
                return 200;
            }

    五,函数的存储执行方式
        1,栈  存储基本数据类型
              变量名称存储的是数值数据

        2,堆  存储复杂数据类型
              变量名称存储在栈中,其中存储的是函数的内存地址
              函数存储在堆中,有一个内存地址
              调用变量,通过内存地址,找到函数,执行函数中的程序

    六,函数的基本封装过程
        1,定义程序,实现功能
        2,定义函数,封城程序,也就是将程序写入{}中
        3,定义参数
        4,定义返回值

        5,考虑输入数据的容错
        6,考虑参数的默认值
        7,添加函数说明