zoukankan      html  css  js  c++  java
  • 16、Javascript——数组对象的方法(含jQuery 转载)

    详细方法、属性请见: Array——MDN

    来源:JavaScript1.6数组新特性和JQuery的几个工具方法  

      JavaScript 1.6 引入了几个新的Array 方法,具体的介绍见:New in JavaScript 1.6 。这些方法已经被写进了ECMA262 V5。现代浏览器(IE9/Firefox/Safari/Chrome/Opera)都已经支持,但IE6/7/8不支持。jquery的工具方法中提供了类似的功能。

    1、Array.forEach()和jquery的$().each()。

      在数组中的每个项上运行一个函数。

    1 var ary = [2,4,6,8];
    2  
    3 // js1.6 Array.forEach方法
    4  ary.forEach(function(item,index){alert(item);});  //index是元素的索引,item是该元素
    5 
    6 // jquery的写法 7 $(ary).each(function(){alert(this);}); 8 //还可以写成这样 9 $(ary).each(function(index,item){alert(item);});

    2、Array.filter()和jquery的$.grep()。

      在数组中的每个项上运行一个函数,并将函数返回真值的项作为数组返回。简单的说就是用一个条件过滤掉不符合的数组元素,剩下的符合条件的元素组合成新的数组返回。

     1 var ary = [2,4,6,8];
     2  
     3 // js1.6 Array.filter()方法
     4 var otherAry1 = ary.filter(function(item){return item>4;});
     5 alert(otherAry1);//返回大于4的元素,输出6,8
     6  
     7 // jquery写法(注意和$.each的区别)
     8 // 此处函数中第一个参数是数组元素自身,第二个参数是数组元素索引
     9 // 而$().each方法刚好相反,作者应该统一下。
    10 var otherAry2 = $.grep(ary,function(item,index){
    11      return item>4;
    12 });
    13 alert(otherAry2);//输出6,8

    3、Array.map()和jquery的$.map()。

      在数组中的每个项上运行一个函数,并将全部结果作为数组返回。这个方法非常强大,尤其是作用于DOM数组时(在abcc项目上用过,对每个查询模块DOM生成查询字符串)。简单说就是把每个数组元素运算的结果作为新数组元素。

    1 var ary = [2,4,6,8];
    2  
    3 // js1.6 Array.map()方法
    4 var newAry1 = ary.map(function(item){return item+1;});//每个元素加1
    5 alert(newAry1);//输出3,5,7,9
    6  
    7 // jquery写法
    8 var newAry2 = $.map(ary,function(item,index){return item+1;});
    9 alert(newAry2);//输出3,5,7,9

    4、Array.every()方法。

      检查数组元素是否都符合某个条件,只要有一个不符合返回false,否则返回true。

    1 var ary = [2,4,6,8,10];
    2  
    3 alert(ary.every(function(item){return item>1}));  //true
    4 alert(ary.every(function(item){return item>2}));  //false

    5、Array.some()方法。

      检查数组中元素是否符合某个条件,只要有一个符合返回true,否则返回false。

    1 var ary = [2,4,,6,8,10];
    2  
    3 alert(ary.some(function(item){return item>9;}));//true
    4 alert(ary.some(function(item){return item>10;}));//false

    最后给出 IE6/7/8的解决方案,让这些浏览器完美支持JS1.6的Array新方法。

     1 function(){
     2      
     3 function applyIf(o, c) {
     4     if(o) {
     5         for(var p in c) {
     6             if(o[p]===undefined) {
     7                 o[p] = c[p];
     8             }
     9         }
    10     }
    11     return o;
    12 }
    13 applyIf(Array.prototype, {
    14     indexOf : function(obj, idx) {
    15         var from = idx == null ? 0 : (idx < 0 ? Math.max(0, arr.length + idx) : idx);
    16         for(var i = from, l = this.length; i < l; i++) {
    17             if(i in this && this[i] === obj) {
    18                 return i;
    19             }
    20         }
    21         return -1;
    22     },
    23     lastIndexOf : function(obj, idx) {
    24         var len = this.length, from = idx == null ? len - 1 : idx;
    25         if(from < 0) {
    26             from = Math.max(0, len + from);
    27         }
    28         for(var i = from; i >= 0; i--) {
    29             if (i in this && this[i] === obj) {
    30                 return i;
    31             }
    32         }
    33         return -1;
    34     },
    35     every : function(fn, thisObj) {
    36         var l = this.length;
    37         for(var i = 0; i < l; i++) {
    38             if(i in this && !fn.call(thisObj, this[i], i, this)) {
    39                 return false;
    40             }
    41         }
    42         return true;
    43     },
    44     some : function(fn, thisObj) {
    45         var l = this.length;
    46         for(var i = 0; i < l; i++) {
    47             if(i in this && fn.call(thisObj, this[i], i, this)) {
    48                 return true;
    49             }
    50         }
    51         return false;
    52     },
    53     filter : function(fn, thisObj) {
    54         var l = this.length, res = [], resLength = 0;
    55         for(var i = 0; i < l; i++) {
    56             if(i in this) {
    57                 var val = this[i];
    58                 if(fn.call(thisObj, val, i, this)) {
    59                     res[resLength++] = val;
    60                 }
    61             }
    62         }
    63         return res;
    64     },
    65     map : function(fn, thisObj) {
    66         var l = this.length, res = [];
    67         for(var i = 0; i < l; i++) {
    68             if(i in this) {
    69                 res[i] = fn.call(thisObj, this[i], i, this);
    70             }
    71         }
    72         return res;
    73     },
    74     forEach : function(fn, thisObj) {
    75         var l = this.length;
    76         for(var i = 0; i < l; i++) {
    77             if(i in this) {
    78                 fn.call(thisObj, this[i], i, this);
    79             }
    80         }
    81     }
    82 });
    83 }();

    其他Array 对象方法如下:

    方法描述
    concat() 连接两个或更多的数组,并返回结果。
    join() 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
    pop() 删除并返回数组的最后一个元素
    push() 向数组的末尾添加一个或更多元素,并返回新的长度。
    reverse() 颠倒数组中元素的顺序。
    shift() 删除并返回数组的第一个元素
    slice() 从某个已有的数组返回选定的元素
    sort() 对数组的元素进行排序
    splice() 删除元素,并向数组添加新元素。
    toSource() 返回该对象的源代码。
    toString() 把数组转换为字符串,并返回结果。
    toLocaleString() 把数组转换为本地数组,并返回结果。
    unshift() 向数组的开头添加一个或更多元素,并返回新的长度。
    valueOf() 返回数组对象的原始值
  • 相关阅读:
    与开发团队高效协作的8个小技巧
    9本java程序员必读的书(附下载地址)
    NPOI导出饼图到Excel
    EF6不支持sqlite Code First解决方案
    C#程序访问底层网络
    如何自己开发软件测试工具?
    .Net mvc 根据前台参数动态绑定对象
    在SSM框架里新增一个功能
    2018-10-12 例会总结
    2018-10-11 java从入门到放弃--方法
  • 原文地址:https://www.cnblogs.com/cjlalala/p/5810640.html
Copyright © 2011-2022 走看看