整理一下常用的几种遍历方法,for和while循环就不再说了,说一下其他几种非常好用的方法
1.for in
for in可定是接触比较早的遍历数组的方法,其实它也可遍历对象(遍历字符串也是可以的!),这个方法主要是针对对象,遍历数组最好不要用!!!实例演示一下
遍历数组
<script>var arr = ['a', 'b', 'c', 'd'];// 遍历数组 key是索引for (var key in arr) {console.log(arr[key] + '---' + key);}</script>
遍历对象
var obj = {name: '张三',age: '20',sex: '男',}// 遍历对象 key是属性 obj[key]是属性值for (let key in obj) {console.log(obj[key] + '---' + key);}
遍历字符串 和数组类似
// 遍历字符串 key是索引var str = 'abcd';for (let key in str) {console.log(str[key] + '---' + key);}
2.for of (ES6)
p就是数组中的每个元素,for of 遍历可迭代数据,不能遍历对象!!!
var arr = ['a', 'b', 'c', 'd'];// 遍历数组 key是索引for (let p of arr) {console.log(p);//输出a b c d}
3.forEach()方法对数组的每个元素执行一次给定的函数。
var arr = ['a', 'b', 'c', 'd'];// 遍历数组 element是每个元素arr.forEach((element) => {console.log(element);});
高阶用法
语法
arr.forEach(callback(currentValue [, index [, array]])[, thisArg])
参数
callback
为数组中每个元素执行的函数,该函数接收一至三个参数:
currentValue
数组中正在处理的当前元素。
index
可选
数组中正在处理的当前元素的索引。
array
可选
forEach()
方法正在操作的数组。
thisArg
可选
可选参数。当执行回调函数callback
时,用作this
的值。
4.find() 返回第一个满足条件的元素,否则返回undefined
<script>var arr = [1, 2, 3, 4, 5];// 遍历数组 element是每个元素const a = arr.find(element => element > 3);console.log(a);//输出4</script>
5.findIndex 返回第一个满足条件的索引,否则返回-1
<script>var arr = [1, 2, 3, 4, 5];// 遍历数组 element是每个元素const a = arr.findIndex(element => element > 3);console.log(a);//输出3</script>
6.filter()所有满足条件的元素组成一个新数组返回,否则为空数组
<script>var arr = [1, 2, 3, 4, 5];// 遍历数组 element是每个元素const a = arr.filter(element => element > 3);console.log(a);</script>
7.Object.keys(obj) 可以遍历对象,也可以遍历数组
<script>var arr = [1, 'a', 3, 4, 5];var obj = { a: 1, b: 2 }// 遍历数组返回每个元素的索引let a = Object.keys(arr);console.log(a);// 遍历对象把对象中的每个属性转换成字符组成新数组返回let b = Object.keys(obj);console.log(b);</script>