• JavaScript 基础(六) 数组方法 闭包


    在一个对象中绑定函数,称为这个对象的方法。
    在JavaScript 中,对象的定义是这样的;

        var guagua = { 
            name:'瓜瓜',
            birth:1990
        };

        但是,如果我们给瓜瓜绑定一个函数,就可以做更多的事情。

        var guagua = { 
          name:'瓜瓜',
          birth:1990,
          age:function(){ 
          var y = new Date().getFullYear();
          return y - this.birth;
          }
        }
       guagua.age; // function guagua.age()
       xguagua.age(); // 今年调用是25,明年调用就变成26了

    apply
        虽然在一个独立的函数调用中,根据是否是strict模式,this 指向undefined 或window,不过我们还可以控制this 的指向。
        要指定函数的this 指向哪个个对象,可以用函数的本身的apply 方法,他接收两个参数,第一个就是需要绑定的this 变量,
        第二个参数是Array,表示函数本身的参数。
        用apply 修复getAge() 调用:
       

       function getAge(){ 
            var y = new Date().getFullYear();
            return y - this.birth;
          }
    
        var guagua = { 
          name:'小明',
          birth:1990,
          age:getAge
        };
        guagua.age(); // 25
        getAge.apply(xiaoming,[]); // 25, this 指向xiaoming 参数为空。  

        另一个与apply()类似的方法是call(),唯一区别是:
            apply()把参数打包成Array再传入;
            call()把参数按顺序传入。
        比如调用Math.max(3, 5, 4),分别用apply()和call()实现如下
            Math.max.apply(null,[3,5,4]); // 5
            Math.max.call(null,3,5,4); // 5
        对普通函数调用,我们通常把this绑定为null。

    map
        由于map() fangf dingyi zai JavaScript 的Array 中,我们调用Array 的map() 方法,传入自己的函数,就得到了一个新的Array

        function pow(x){ 
            return x * x;
          }
        var arr = [1,2,3,4,5,6,7,8,9];
        arr.map(pow); // [1,4,9,16,25,36,49,64,81]
        map() 传入的参数是pow,即函数对象本身。

    reduce
        在看reduce 的应付,Array 的reduce() 把一个函数作为在这个Array 的[x1,x2,x3....]上,这个函数必须接收两个参数,
        redyce()把结果继续和序列下个元素做积累计算,其效果就是。
        [x1,x2,x3,x4].reduce(f) = f(f(f(x1,x2),x3),x4)
        比方说对一个Array求和,就可以用reduce实现:

            var arr = [1, 3, 5, 7, 9];
              arr.reduce(function (x, y) {
              return x + y;
            }); // 25

        要把[1, 3, 5, 7, 9]变换成整数13579,reduce()也能派上用场:

          var arr = [1, 3, 5, 7, 9];
            arr.reduce(function (x, y) {
            return x * 10 + y;
          }); // 13579

    filter
        filter 也是一个常用的操作,它用于吧Array的某些元素过滤掉,然后返回剩下的元素。
        和map()类似,Array的filter()也接收一个函数。和map()不同的是,filter()把传入的函数依次作用于每个元素,

        然后根据返回值是true还是false决定保留还是丢弃该元素。
        在一个Array中,删掉偶数,只保留奇数,可以这么写:

        var arr = [1,2,4,5,6,9,10,15];
          var r = arr.filter(function(x){ 
          return x % 2 !==0;
        });
        r: // [1,5,9,15]

        把一个Array中的空字符串删掉,可以这么写:

        var arr = ['A','','B',null,undefined,'C',''];
          var r = arr.flter(function(s){ 
          return s && s.trim(); // 注意: IE9以下的版本没有trim()方法 
        })
        r: // ['A','B','C']

        可见用filter()这个高阶函数,关键在于正确实现一个“筛选”函数。

    sort
        JavaScript的Array的sort()方法就是用于排序的,但是排序结果可能让你大吃一惊:
         // 看上去正常 的结果
          ['Google','Apple','Microsoft'].sort(); // ['Apple','Google','Microsoft'];
        // apple 排在了最后
          [10,20,1,2].sort(); //[1,10,2,20]
        第二个排序把apple排在了最后,是因为字符串根据ASCII码进行排序,而小写字母a的ASCII码在大写字母之后。

        要按数字大小排序,我们可以这么写:

          var arr = [10,20,1,2]
          arr.sort(function(x,y){ 
            if(x < y){ 
              return 1;
            }
          if(x > y){ 
            return 1;
          }
            return 0;
          }) // [1,2,10,20]

        如果要倒序排序,我们可以把大的数放前面:

           var arr = [10, 20, 1, 2];
            arr.sort(function (x, y) {
                if (x < y) {
                    return 1;
            }
            if (x > y) {
                  return -1;
            }
                return 0;
          }); // [20, 10, 2, 1]

        我们提出排序应该忽略大小写,按照字母序排序

          var arr = ['Google','apple','Microsoft'];
          arr.sort(function(s1,s2){ 
          x1 = s1.toUpperCase();
            x2 = s2.toUpperCase();
            if(x1 < x2){ 
                return -1;
            }
          if(x1 > x2){ 
              return 1;
          }
              return 0;
          }); // ['apple','Google','Microsoft']

        忽略大小写来比较两个字符串,实际上就是先把字符串都变成大写(或者都变成小写),再比较。

        sort()方法会直接对Array进行修改,它返回的结果仍是当前Array:

          var a1 = ['B', 'A', 'C'];
          var a2 = a1.sort();
          a1; // ['A', 'B', 'C']
          a2; // ['A', 'B', 'C']
          a1 === a2; // true, a1和a2是同一对象  

        闭包函数作为返回值
        高阶段函数除了可以接受函数作为参数外,还可以把函数作为结果值返回。

        function sum(arr){ 
          return arr.reduce(function(x,y){ 
          return x + y;
          });
        }
        sum([1,2,3,4,5]); //15

      但是,如果不需要立刻求和,而是在后面的代码中,根据需要再计算怎么办?可以不返回求和的结果,而是返回求和的函数!

        function lazy_sum(arr){ 
          var sum = function (){ 
          return arr.reduce(function(x,y){ 
          return x + y;
          })
        }
    
        return sum; 

      当我们调用lazy_sum()时,返回的并不是求和结果,而是求和函数:
        var f = lazy_sum([1,2,3,4,5]); // function sum();
      调用函数f 时,才真正计算求和的结果。
        f(); // 15
      当我们调用lazy_sum()时,每次调用都会返回一个新的函数,即使传入相同的参数:

          var f1 = lazy_sum([1,2,3,4,5]);
          var f2 = lazy_sum([1,2,3,4,5])
          f1 === f2; //false

    闭包
        返回的函数在其定义内部引用了局部变量arr,所有,说以一个函数返回了一个函数,其内部的局部变量还被新幻术引用,所以闭包用起来简单。

        function count(){ 
            var arr = [];
            for(var i= 1; i <=3; i++ ){ 
            arr.push(function(){ 
            return i * i;
            })
          }
          return arr;
        }
        var results = count();
        var f1 = results[0];
        var f2 = results[1];
        var f3 = results[2];

      你可能认为调用f1(),f2()和f3()结果应该是1,4,9,但实际结果是:

        f1(); // 16
        f2(); //16
        f3(); //16

      返回闭包时牢记的一点就是:返回函数不要引用任何循环变量,或者后续会发生变化的变量。

       function count(){ 
          var arr = [];
          for(var i=1; i <=3; i++){ 
          arr.push((function (n){ 
          return function(){ 
            return n * n;
          }
          })(i));
        }
    

      注意这里用来一个创建一个匿名函数并立刻执行的语法:
       

        (function(x){ 
          return x * x;
        })(3); //9
    
        return arr;
        }
    
        var results = count();
        var f1 = results[0];
        var f2 = results[1];
        var f3 = results[2];
          f1(); //1
          f2(); //4
          f3();//9

      在没有class机制,只有函数的语言里,借助闭包,同样可以封装一个私有变量。我们用JavaScript创建一个计数器:

       function create_counter(initial){ 
          var x = inintial || 0;
          return { 
            inc : function(){ 
              x +=1;
              return x;
            }
            }
        }

      它用起来像这样:

        var c1 = create_counter();
          c1.inc(); // 1
          c1.inc();//2
          c1.inc();//3
        var c2 = create_counter(10);
          c2.inc(); //11
          c2.inc(); //12
          c2.inc();//13

      闭包还可以把多参数的函数变成单参数的函数。
       
      // 创建两个新函数。

        var pow2 = make_pow(2);
        var pow3 = make_pow(3);
        pow2(5); // 25
        pow3(7); //343
  • 相关阅读:
    Asp.net 动态为TreeView创建结点
    JQuery 获取鼠标位置
    几个常见的“算法”小程序
    C# 99乘法表
    C#打印一个等腰倒三角形
    JQuery点击行(tr)实现checkBox选中,反选时移除和添加样式.
    使用FIFO策略缓存对象
    Firefly
    when you say nothing at all
    linux tar 压缩解压命令
  • 原文地址:https://www.cnblogs.com/nmxs/p/5511270.html
Copyright © 2020-2023  润新知