JavaScript入门第十四章（高阶函数 ）

Posted 2021-09-02 海海呐

1.arguments关键字

• 1.arguments关键字：获取函数的所有实参

• 2.为什么要有arguemnts关键字

  • js是一门弱语言：声明函数的时候假如只有一个形参，实际上在调用的时候无论我们传入多少实参程序都不会报错

  • 为了防止这种情况:函数有一个arguments关键字来获取所有的实参

• 3.arguments特点

  • 1.只能在函数体中使用，在函数外使用会报错

  • 2.是一个特殊的数组（伪数组）

    • 有数组的三要素，但是没有数组其他的方法

  • 3.arguemngs数组中的元素与形参 一一对应

• 4.arguements好处:可以让函数变得更加灵活

  • 可以让函数根据实参的不同而实现不同的功能

<script>
    /**arguments关键字作用：获取函数的所有实参
     * 本质：当前函数的内置对象，每一个函数都有一个arguments对象，作用是存储调用者传递过来的所有实参
     * 特点：1.只能在函数体中使用，函数外部使用会报错
     *          2.是一个特殊的数组（伪数组）
     *          3.arguments伪数组的元素与形参一一对应
     *
     * 说明：1.可以用函数变得更加灵活
     *           2.arguments是一个伪数组
     *              * 伪数组：只有数组的下标、元素、长度，没有数组其他方法
     */
    /**一：argument用法演示*/

    //1.这行代码会报错，因为函数外部无法使用arguments
    // console.log ( arguments );

    //2.定义一个无参的函数，作用是打印该函数的所有参数
    function fn ( num1 ) {

        //(1)arguemnt保存的是所有的实参的值

        // console.log ( num1 );
        // console.log ( arguments );//arguments只能在函数内部使用

        //(2)arguemnt与形参是一一对应的

        //修改了形参，arguemnt也会修改
        num1 = 100;
        console.log ( arguments );//修改了形参，arguments也会修改

        //反之，修改了argeumnts，形参也会变化

    }

    fn(10,20);//实参与形参一一对应


    /** 二：arguments实际用途展示：求不确定数量的参数的和 */
    function add() {
        //定义变量保留数据
        let sum = 0;
        console.log(arguments);

        //有参数：遍历数组统计结果
        for (let i = 0; i < arguments.length; i++) {
            // 防止字符串和其他类型乱入，需要做安全判定
            let value = arguments[i];

            if (isNaN(value)) {
                return false;
            }

            //说明value肯定是数值了，但是还要保证不是字符串（影响+号运算）
            sum += Number(value);
        }

        return sum;
    }

    console.log(add());
    console.log(add(100));
    console.log(add(10,20));


</script>

2.回调函数

• 1.什么是回调函数：如果一个函数的参数也是一个函数，那么这个参数函数就叫做回调函数

• 2.为什么要有回调函数？

  • 当一个函数调用执行完毕之后，我想执行另一段代码块，也就是调用另一个函数

  • 但是有时候可能本函数执行完毕后，根据不同的情况需要调用的函数也不同，那么我们可以使用形参来接收这个函数，然后再调用

    • 此时：这个形参函数就称之为回调函数

<script>
    //回调函数：如果一个函数的参数也是一个函数，那么这个参数函数就叫做回调函数
    //回调函数在什么地方会执行呢？   函数名() 的时候执行
    //回调函数难点： 本质是一个参数
    //谁来传：调用者传参   （函数名）
    //谁来收,调用：函数调用  （函数执行完函数体之后，调用保存在这个参数中的一段代码）


    function a (  ) {
        console.log ( "哈哈" );

    }

    function b (  ) {
        console.log ( "呵呵" );
    }

    //c函数有一个功能，可以接收调用者传递过来的一段代码，并且在执行完自身函数体之后，会帮调用者执行这一段代码
    function c ( fn ) {
        console.log ( "嘿嘿" );
        //fn里面是调用者传递过来的一段代码，怎么让这段代码执行呢？
        fn();
    };

    //调用函数c，传的是变量a中存储的一段代码
    c(a);
    c(b);
    
    // 注意：回调函数是将函数的代码传递给形参，让函数内部调用
    // 注意：在传递实参给形参的时候，如果是要回调函数，那么只要传入函数名字（此时不掉用，函数内部调用）：c(a)，fn = a
    // 如果在传入实参的时候，给函数名增加了括号：c(a())，此时表示将a函数先执行，然后将a()函数的返回值，传递给形参fn = a()
  
</script>

3.自调用函数

• 1.什么是自调用函数：函数自己调用自己

  • 最常见的：匿名函数自调用

• 2.自调用函数作用

  • 开辟作用域，js中只有函数才可以开辟作用域：防止全局污染

• 3.匿名函数自调用语法:( function(){} ) ()

  • 将整个函数使用小括号包裹，然后在后面再加上小括号调用

<script>

    /*自调用函数：函数自己调用自己
        * 最常见的：匿名函数自调用
     */


    //作用：开辟作用域，js中只有函数才可以开辟作用域

    //匿名函数相当于字面量函数,由于没有函数名，所以只能在声明的同时调用
    //语法：  ( function(){} ) ()     将整个函数使用小括号包裹，然后在后面再加上小括号调用
    (function (  ) {
        console.log ( "我是匿名函数" );
    })();

    //其实有名字的函数也可以自己调用自己，只是比较少见
    (function test(  ) {
        console.log ( "我是有名字的函数，我也可以自调用" );
    })();
   
</script>

  上一章：JavaScript入门第十三章（函数）

  下一章：JavaScript入门第十五章（对象）