美文网首页JavaScript < ES5、ES6、ES7、… >
高阶函数使用(作为参数和返回值的使用)

高阶函数使用(作为参数和返回值的使用)

作者: nomooo | 来源:发表于2019-03-22 04:30 被阅读14次

    在看使用之前,先复习下函数中的几个常见成员
    属性和方法都是一个对象中的成员

       function f1() {
         console.log(f1.name);//函数的名字
       }
       f1.name="f5";
    //就是为f1这个实例对象添加了一个新的属性,属性的值是:f5,恰巧,f1这个对象中有name属性,这个操作是相当于改变f1中name属性的值.又因为f1这个对象中的name属性是只读的,
       f1();//f1
       console.dir(f1);//f1()
       console.log(f1.name);//f1
    

    函数中的name属性是函数的名字
    arguments属性,是传入的参数形成的一个对象,arguments.length是实参的个数
    length属性是函数的形参的个数
    caller属性:是调用者,函数1如果在函数2中被调用,那么函数中的caller就是函数2

       function f1(x) {
         console.log(f1.caller);//null
        //  该函数调用的时候传入的参数的个数:实参的个数
         console.log(f1.arguments.length);//0
        //  函数定义的时候的形参的个数
         console.log(f1.length);
       }
      f1();//1
    
       function f1(x,y) {
         console.log(x+y);//30
         console.log(f1.caller.name);
       }
       function f2() {
         f1(10,20);
       }
    
       //如果f2这个函数调用了,那么会在f2的函数中去调用f1函数
       f2();
        //30 
        //f2
    

    函数作为参数属性
    函数可以作为参数使用,命名函数或者是匿名函数都可以,注意:命名函数只传入函数的名字

       function f1(fn) {
         console.log("函数f1调用开始");
         fn();//fn就是一个函数
         console.log("函数f1调用结束");
       }
    
       function f2() {
         console.log("我是f2函数");
       }
       f1(f2);
    //函数f1调用开始
    //我是f2函数
    //函数f1调用结束
    

    下面这段代码可以看到当函数作为参数使用时候的调用顺序

    function f1(fn) {
          setInterval(function () {
            console.log("我是定时器中的,我开始执行了");
            fn();//作为函数使用
            console.log("哎呀,马上就结束了");
            console.log("========");
          },1000);
        }
        f1(function () {
          console.log("我在执行喽");
        });
    //我是定时器中的,我开始执行了
    //我在执行喽
    //哎呀,马上就结束了
    //========
    //ps:会每隔一秒打印上面四行
    

    函数作为返回值使用

           function f1(x) {
             console.log("哈哈,我又变帅了");
             return function (y) {
               console.log("我是f1函数的返回值,但是我是函数"+x+"===>"+y);
             };
           }
           var ff=f1(10);
           ff(20);
    
    
        //函数的作用就是判断当前的这个对象是不是某个数据类型
        function getFunc(type) {
          return function (obj) {//obj中存储的就是一个对象
            //判断[10,20,30] 和[object Array]是否相等
            return Object.prototype.toString.call(obj) == type;
          }
        }
    

    作为返回值使用扩展

        //构造函数
        //创建三个对象,分别把三个对象加入到数组中,每个对象中有三个属性,把三个对象排序,但是是按照每个对象的属性进行排序---影片的信息
    
        function File(name, size, time) {
          this.name = name;//影片的名字
          this.size = size;//影片的大小
          this.time = time;//上映的时间
        }
        var f1 = new File("jack.avi", "400M", "1997-12-12");
        var f2 = new File("zhujiao.avi", "200M", "2017-12-12");
        var f3 = new File("tom.avi", "800M", "2010-12-12");
        var arr = [f1, f2, f3];
        function fn(attr) {
          //函数作为返回值使用
          return function (obj1, obj2) {
            //对象不能直接对比,但是对象中的属性的值是可以对比
            if (obj1[attr] > obj2[attr]) {
              return 1;
            } else if (obj1[attr] == obj2[attr]) {
              return 0;
            } else {
              return -1;
            }
          }
        }
        var str = "time";
        arr.sort(fn(str));//函数作为参数使用
    
        //输出排序后的结果
        for (var i = 0; i < arr.length; i++) {
          console.log(arr[i].name + "----" + arr[i].size + "----" + arr[i].time);
        }
    

    相关文章

      网友评论

        本文标题:高阶函数使用(作为参数和返回值的使用)

        本文链接:https://www.haomeiwen.com/subject/xbwxvqtx.html