zoukankan      html  css  js  c++  java
  • JavaScript数组循环遍历之forEach

    1.  js 数组循环遍历。

    数组循环变量,最先想到的就是 for(var i=0;i<count;i++)这样的方式了。

    除此之外,也可以使用较简便的forEach 方式

    2.  forEach 函数。

    Firefox 和Chrome 的Array 类型都有forEach的函数。使用如下:

    [html]
     
    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    2. <HTML>  
    3. <HEAD>  
    4. <TITLE> New Document </TITLE>  
    5. </HEAD>  
    6. <BODY>  
    7. <script>  
    8. var arryAll = [];  
    9. arryAll.push(1);  
    10. arryAll.push(2);  
    11. arryAll.push(3);  
    12. arryAll.push(4);  
    13.   
    14. arryAll.forEach(function(e){  
    15.     alert(e);  
    16. })  
    17. </script>  
    18. </BODY>  
    19. </HTML>  

    但是以上,代码在IE中却无法正常工作。

    因为IE的Array 没有这个方法

    [javascript]
     
    1. alert(Array.prototype.forEach);  

    执行以上这句得到的是  "undefined", 也就是说在IE 中 Array 没有forEach的方法。

    3.  让IE兼容forEach方法

    既然IE的Array 没哟forEach方法, 我们就给它手动添加这个原型方法。
    [javascript] 
     
    1. //Array.forEach implementation for IE support..  
    2. //https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach  
    3. if (!Array.prototype.forEach) {  
    4.     Array.prototype.forEach = function(callback, thisArg) {  
    5.         var T, k;  
    6.         if (this == null) {  
    7.             throw new TypeError(" this is null or not defined");  
    8.         }  
    9.         var O = Object(this);  
    10.         var len = O.length >>> 0; // Hack to convert O.length to a UInt32  
    11.         if ({}.toString.call(callback) != "[object Function]") {  
    12.             throw new TypeError(callback + " is not a function");  
    13.         }  
    14.         if (thisArg) {  
    15.             T = thisArg;  
    16.         }  
    17.         k = 0;  
    18.         while (k < len) {  
    19.             var kValue;  
    20.             if (k in O) {  
    21.                 kValue = O[k];  
    22.                 callback.call(T, kValue, k, O);  
    23.             }  
    24.             k++;  
    25.         }  
    26.     };  
    27. }  
    详细介绍可以参照:
    https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach
     

    4. 如何跳出循环?

     Js 此种状况的forEach 不能使用continue, break;  可以使用如下两种方式:
    1. if 语句控制
    2. return . (return true, false)
    return --> 类似continue 


    以下例子是取出数组中2的倍数和3的倍数的数;
    [html] 
     
    1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">  
    2. <HTML>  
    3. <HEAD>  
    4. <TITLE> New Document </TITLE>  
    5. </HEAD>  
    6.   
    7. <BODY>  
    8. <script>  
    9. if (!Array.prototype.forEach) {  
    10.     Array.prototype.forEach = function(callback, thisArg) {  
    11.         var T, k;  
    12.         if (this == null) {  
    13.             throw new TypeError(" this is null or not defined");  
    14.         }  
    15.         var O = Object(this);  
    16.         var len = O.length >>> 0; // Hack to convert O.length to a UInt32  
    17.         if ({}.toString.call(callback) != "[object Function]") {  
    18.             throw new TypeError(callback + " is not a function");  
    19.         }  
    20.         if (thisArg) {  
    21.             T = thisArg;  
    22.         }  
    23.         k = 0;  
    24.         while (k len) {  
    25.             var kValue;  
    26.             if (k in O) {  
    27.                 kValue = O[k];  
    28.                 callback.call(T, kValue, k, O);  
    29.             }  
    30.             k++;  
    31.         }  
    32.     };  
    33. }  
    34.   
    35. var arryAll = [];  
    36. arryAll.push(1);  
    37. arryAll.push(2);  
    38. arryAll.push(3);  
    39. arryAll.push(4);  
    40. arryAll.push(5);  
    41.   
    42. var arrySpecial = [];  
    43.   
    44. arryAll.forEach(function(e){  
    45.     if(e%2==0)  
    46.     {  
    47.         arrySpecial.push(e);  
    48.     }else if(e%3==0)  
    49.     {  
    50.         arrySpecial.push(e);  
    51.     }  
    52. })    
    53. </script>  
    54. </BODY>  
    55. </HTML>  
    使用return 达到以上效果
    [javascript] 
     
    1. arryAll.forEach(function(e){  
    2.     if(e%2==0)  
    3.     {  
    4.         arrySpecial.push(e);  
    5.         return;  
    6.     }  
    7.     if(e%3==0)  
    8.     {      
    9.         arrySpecial.push(e);  
    10.         return;  
    11.     }  
    12. })  

    至于如何写类似break 的效果,目前尚未找到比较好的办法。

    有搜索一下,有的说return false 可以达成, 试了一下, 效果和return 和return ture 是一样的。

    本文摘自http://blog.csdn.net/oscar999/article/details/8671546

  • 相关阅读:
    struts2_maven_learning
    test_maven_实现表单验证
    Struts2_learning
    计算机信息安全技术_学习
    SQL_sql语言的学习
    ios视图加载时所涉及到的事件
    ios 判断版本更新
    ios 裁剪图片(1裁多)
    iOS 设置与配置
    ios Auto Layout中Stack View的使用
  • 原文地址:https://www.cnblogs.com/jasonxu19900827/p/5282356.html
Copyright © 2011-2022 走看看