ES5新增数组方法总结
ES5新增了一些关于数组的方法,使得代码更加简洁,让程序员更加方便敲代码
静态方法——Array.isArray()
确定传递的值是否是一个数组
js代码块
var arr = ['张三', '李四', '王五']
var str = '张三'
console.log(Array.isArray(arr))//返回true
console.log(Array.isArray(str))//返回false
</script>
执行结果
Array.isArray().png
数组原型方法
一、forEach()
forEach()方法的功能是循环遍历数组中的每一个元素;
forEach()方法会接收一个函数;这个函数包含三个形参,分别为:item, index, array, 用不到时可以不写
item 表示该数组中的每个数组元素,index 表示每个数组元素的下标,array 表示原数组
js代码块
<script>
var arr = ['张三', '李四', '王五']
arr.forEach(function(item, index, arr) {
console.log(item, index, arr)
})
</script>
执行结果
forEach.png
二、some()
判断数组中是否存在满足指定条件的数组元素,只要有一个数组元素满足指定条件就返回true
some()方法会自己遍历数组,它会接收一个函数;这个函数包含三个形参,分别为:item, index, array, 用不到时可以不写
item 表示该数组中的每个数组元素,index 表示每个数组元素的下标,array 表示原数组
js代码块
<script>
var arr = [100, 200, 300, 400]
var newArr = arr.some(function(item, index, arr) {
return item > 200//满足数组元素大于200
})
var newArr1 = arr.some(function(item, index, arr) {
return item > 400//满足数组元素大于400
})
console.log(newArr)//返回true
console.log(newArr1)//返回false
</script>
执行结果
some.png
三、every()
判断数组中是否存在满足指定条件的数组元素,只有所有数组元素都满足指定条件才会返回true,只要有一个数组元素不满足条件都会返回false
every()方法会自己遍历数组,它会接收一个函数;这个函数包含三个形参,分别为:item, index, array, 用不到时可以不写
item 表示该数组中的每个数组元素,index 表示每个数组元素的下标,array 表示原数组
js代码块
<script>
var arr = [100, 200, 300, 400]
var newArr1 = arr.every(function(item, index, arr) {
return item < 200//满足数组元素小于200
})
var newArr2 = arr.every(function(item, index, arr) {
return item <= 400//满足数组元素小于等于400
})
console.log(newArr1)//返回false
console.log(newArr2)//返回true
</script>
执行结果
every.png
四、filter()
筛选出满足指定条件的数组元素,并且返回由满足指定条件的数组元素组成的新数组
filter()方法会自己遍历数组,它会接收一个函数;这个函数包含三个形参,分别为:item, index, array, 用不到时可以不写
item 表示该数组中的每个数组元素,index 表示每个数组元素的下标,array 表示原数组
js代码块
<script>
var arr = [100, 200, 300, 400]
var arr = [100, 200, 300, 400]
var newArr = arr.filter(function(item) {
return item < 400//满足数组元素小于400
})
console.log(newArr)//返回[100,200,300]
</script>
执行结果
filter.png
五、map()
根据指定的条件来处理数组元素,并且返回处理之后的数组元素组成的新数组
map()方法会自己遍历数组,它会接收一个函数;这个函数包含三个形参,分别为:item, index, array, 用不到时可以不写
item 表示该数组中的每个数组元素,index 表示每个数组元素的下标,array 表示原数组
js代码块
<script>
var arr = [100, 200, 300, 400]
var newArr = arr.map(function(item) {
return item * 2 //将数组元素乘以2
})
var newArr1 = arr.map(function(item) {
return item / 2 //将数组元素除以2
})
console.log(newArr) //返回[200,400,600,800]
console.log(newArr1) //返回[50,100,150,200]
</script>
执行结果
map.png
六、reduce()
reduce() 方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce()方法会自己遍历数组,它会接收一个函数;这个函数包含四个形参,分别为:preval,item, index, array, 用不到时可以不写
preval代表上一次调用回调函数的返回值,item 表示该数组中的当前正在处理的数组元素,index 表示该数组中的当前正在处理的数组元素的下标,array 表示原数组
注意: reduce() 对于空数组是不会执行回调函数的。
js代码块
<script>
var arr = [100, 200, 300, 400]
var newArr = arr.reduce(function(preval, item, index, arr) {
console.log(preval, item, index, arr)
return preval + item
})
console.log(newArr)
</script>
执行结果
reduce.png
网友评论