js遍历数组有多少种方法
2021-04-23 10:26
标签：value 对象 nbsp 一个人 场景 js遍历数组 类型 code reduce 如果你看完了你会体会到一个人能有多无聊，这东西都能看完！！？？ 大概js有以下几种循环遍历的方法： over js遍历数组有多少种方法 标签：value 对象 nbsp 一个人 场景 js遍历数组 类型 code reduce 原文地址：https://www.cnblogs.com/rainbowLover/p/13269993.html 1 let arr = [‘aaa‘,‘bbb‘,‘ccc‘]
2 let obj = {a:‘aaa‘,b:‘bbb‘,c:‘ccc‘}
3 let deepObj = {a:‘aaa‘, b:{c:‘ccc‘}}
4
5 // foriFn(arr);// 经典for循环
6 // index :>> 0
7 // item :>> aaa
8 // index :>> 1
9 // item :>> bbb
10 // index :>> 2
11 // item :>> ccc
12
13 // foriFnPlus(arr);// 经典for循环稍微优化一下子
14 // index :>> 0
15 // item :>> aaa
16 // index :>> 1
17 // item :>> bbb
18 // index :>> 2
19 // item :>> ccc
20
21 // forEachFn(arr);// forEach遍历数组 return不会终止循环，return相当于for循环里的continue
22 // index :>> 0
23 // item :>> aaa
24 // index :>> 1
25 // item :>> bbb
26 // index :>> 2
27 // item :>> ccc
28
29 // forinFn(arr)// forin循环 循环时候得到的key时字符串类型的
30 // index :>> 0
31 // typeof index :>> string
32 // item :>> aaa
33 // index :>> 1
34 // typeof index :>> string
35 // item :>> bbb
36 // index :>> 2
37 // typeof index :>> string
38 // item :>> ccc
39 // forinFn(obj)//forin循环 可以遍历对象
40 // index :>> a
41 // typeof index :>> string
42 // item :>> aaa
43 // index :>> b
44 // typeof index :>> string
45 // item :>> bbb
46 // index :>> c
47 // typeof index :>> string
48 // item :>> ccc
49 // forinFn(deepObj)//forin循环 可以遍历对象 只遍历一层
50 // index :>> a
51 // typeof index :>> string
52 // item :>> aaa
53 // index :>> b
54 // typeof index :>> string
55 // item :>> { c: ‘ccc‘ }
56
57 // forofFn(arr)// forof循环 循环时候没有index
58 // index :>> 0
59 // item :>> aaa
60 // index :>> 1
61 // item :>> bbb
62 // index :>> 2
63 // item :>> ccc
64
65 // doWhileFn(arr)// do While循环
66 // item :>> aaa
67 // item :>> bbb
68 // item :>> ccc
69 // whiledoFn(arr)// while do循环
70 // item :>> aaa
71 // item :>> bbb
72 // item :>> ccc
73
74 // mapFn(arr)// map循环 return不会终止循环，return相当于for循环里的continue
75 // index :>> 0
76 // item :>> aaa
77 // 0
78 // index :>> 1
79 // item :>> bbb
80 // index :>> 2
81 // item :>> ccc
82
83 // filterFn(arr)// filter循环 return不会终止循环，return相当于for循环里的continue
84 // index :>> 0
85 // item :>> aaa
86 // 0
87 // index :>> 1
88 // item :>> bbb
89 // index :>> 2
90 // item :>> ccc
91
92
93 // reduceFn(arr)// reduce方法 特殊应用场景使用 和上边的循环不一样
94 // i :>> aaa
95 // j :>> bbb
96 // i :>> aaabbb
97 // j :>> ccc
98 // res :>> aaabbbccc
99
100 // entriesFn(arr)// 遍历器entries循环
101 // Array.isArray(val) :>> true
102 // val :>> [ 0, ‘aaa‘ ]
103 // index :>> 0
104 // item :>> aaa
105 // val :>> [ 1, ‘bbb‘ ]
106 // index :>> 1
107 // item :>> bbb
108 // val :>> [ 2, ‘ccc‘ ]
109 // index :>> 2
110 // item :>> ccc
111 // entriesFnPlus(arr)// 遍历器entries循环优化
112 // Array.isArray(val) :>> true
113 // val :>> [ 0, ‘aaa‘ ]
114 // index :>> 0
115 // item :>> aaa
116 // Array.isArray(val) :>> true
117 // val :>> [ 1, ‘bbb‘ ]
118 // index :>> 1
119 // item :>> bbb
120 // Array.isArray(val) :>> true
121 // val :>> [ 2, ‘ccc‘ ]
122 // index :>> 2
123 // item :>> ccc
124
125 // keysValuesFn(arr)// 用数组的 arr.keys() arr.values() 方法遍历
126 // index :>> 0
127 // index :>> 1
128 // index :>> 2
129 // item :>> aaa
130 // item :>> bbb
131 // item :>> ccc
132
133 // ObjectKeysValuesFn(arr)// 用对象的 Object.keys(arr)、Object.values(arr)方法返回的字符串数组 遍历
134 // index :>> 0
135 // index :>> 1
136 // index :>> 2
137 // item :>> aaa
138 // item :>> bbb
139 // item :>> ccc
140 // ObjectKeysValuesFn(obj)// 可以遍历对象
141 // index :>> a
142 // index :>> b
143 // index :>> c
144 // item :>> aaa
145 // item :>> bbb
146 // item :>> ccc
147 // ObjectKeysValuesFn(deepObj)// 可以遍历对象 只遍历一层
148 // index :>> a
149 // index :>> b
150 // item :>> aaa
151 // item :>> { c: ‘ccc‘ }
152
153 /**
154 * 经典for循环 据说性能最高
155 * @param {Array} arr
156 */
157 function foriFn(arr){
158 for(let i=0; i