JS中遍历数组的一些方法总结

版权声明：您可以转载我的文章，但是请标明文章出处。谢谢！ https://blog.csdn.net/qq_41485414/article/details/82220838

<link rel="stylesheet" href="https://csdnimg.cn/release/phoenix/template/css/ck_htmledit_views-e2445db1a8.css">
<div class="htmledit_views">

Js里面数组是很重要的一块内容，其实就是我们做项目的时候也是很重要的一种数据格式，大部分的数据都不会是一个个或者两个，那么数据多的时候一般是以数组的形式的存放的，那么后端给前端的时候是数据，我们要展示给用户看的时候遍历数组就显得尤为重要，今天就简单的说一下一些常见的遍历数据的方法！能力有限，写的好与不好，全与不全都请多多谅解！

首先我们说一下常见的数组类型，我们一般见到的数组有Array、Set和Map，那么我们分别说一下：

1. var ary = new Array();
2. ary[0] = "第一";
3. ary[1] = "第二";
4. ary[2] = "第一";
5. ary[3] = "第二";
6. var Test = ["a","b","c","d","e","f"]

[/code]

这是Array数组，一般情况下我们怎么遍历的呢？

1. document.write("下面是使用for循环进行的数组遍历","</br>");
2. for(let i = 0;i<ary.length;i++){
3. document.write(ary[i]);
4. }
5. for(let i = 0;i<Test.length;i++){
6. document.write(Test[i]);
7. }

[/code]

这是最常见的一种遍历的方法，for循环遍历

还有一种常见的for/in循环的遍历

1. document.write("</br>","下面是使用for/in循环进行的数组遍历","</br>");
2. /* for/in遍历数组 */
3. for(let i in ary){
4. document.write(ary[i]);
5. }
6. for(let i in Test){
7. document.write(Test[i]);
8. }

[/code]

那么其实还可以使用forEach进行遍历这样的数组：

1. document.write("</br>","下面是使用forEach进行的数组遍历","</br>");
2. /* 使用forEach遍历数组 */
3. ary.forEach(i=>{
4. document.write(i);
5. })
6. Test.forEach(i=>{
7. document.write(i);
8. })
9. document.write("<br>","forEach的第二种写法","<br>")
10. ary.forEach(function(i){
11. document.write(i);
12. })
13. Test.forEach(function(i){
14. document.write(i);
15. })

[/code]

那么在ES6之后呢新出的有一种是for/of的写法进行数组的遍历：

1. document.write("</br>","下面是使用ES6里面新出的for/of进行的数组遍历","</br>");
2. for(let i of ary){
3. document.write(i);
4. }
5. for(let i of Test){
6. document.write(i);
7. }

[/code]

还有一种是可枚举对象数据，也是可以进行遍历的：

1. document.write("</br>","下面是使用for/in进行的enumerable（可枚举）对象遍历","</br>");
2. var A = {a:1,b:2,c:3,d:4,e:"hello"};
3. for(let i in A){
4. document.write(i,A[i]);
5. }

[/code]

下面我们说一下set和map的数组进行遍历

1. document.write("</br>","下面是使用for/of进行的set数组遍历","</br>");
2. /* 操作map和Set */
3. var set = new Set();
4. set.add("1").add("2").add("e").add("hello");
5. for(let i of set){
6. document.write(i);
7. }
8. document.write("</br>","下面是使用for/of进行的map数组遍历","</br>");
9. var map = new Map();
10. map.set("a",1).set("b",2).set("c",3).set(4,"999").set(5,6);
11. for(let[i,j] of map){
12. document.write(i,j);
13. }

[/code]

下面是遍历的结果：

谢谢阅读

 

阅读更多