1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4.    <meta charset="utf-8"/>  
  5.    <title>数组的遍历方式</title>  
  6.    <script type="text/javascript">  
  7.        var arr = [11,22,33,55];  
  8.        //普通的循环遍历方式  
  9.        function first(){  
  10.            for(var i= 0;i<arr.length;i++){  
  11.                console.log("第一种遍历方式\t"+arr[i]);  
  12.            }  
  13.            console.log("111111111111111111111111111111");  
  14.        }  
  15.        //2、for ..in 遍历方式  
  16.        function second(){  
  17.            // for in 遍历需要两个形参 ，index表示数组的下标(可以自定义)，arr表示要遍历的数组  
  18.            for(var index in arr){  
  19.                console.log("第二种遍历方式\t"+arr[index]);  
  20.            }  
  21.            console.log("222222222222222222222222222222");  
  22.        }  
  23.        //3，很鸡肋的遍历方式  
  24.        function third(){  
  25.            //第一个参数为数组的元素，第二个元素为数组的下标  
  26.            arr.forEach(function(ele,index){  
  27.                console.log("第三种遍历方式\t"+arr[index]+"-----"+ele);  
  28.            });  
  29.            console.log("333333333333333333333333333333");  
  30.        }  
  31.        //4,for-of遍历方式  
  32.        function forth(){  
  33.            //第一个变量ele代表数组的元素（可以自定义） arr为数组（数据源）  
  34.            for(var ele of arr){  
  35.                console.log("第四种遍历方式\t"+ele);  
  36.            }  
  37.            console.log("444444444444444444444444444444");  
  38.        }  
  39.    </script>  
  40. </head>  
  41. <body>  
  42.    <input type="button" value="第一种遍历方式" name="aa" onclick="first();"/><br/>  
  43.    <input type="button" value="第二种遍历方式" name="aa" onclick="second();"/><br/>  
  44.    <input type="button" value="第三种遍历方式" name="aa" onclick="third();"/><br/>  
  45.    <input type="button" value="第四种遍历方式" name="aa" onclick="forth();"/><br/>  
  46. </body>  
  47. </html>