【js知识】数组相关方法——for循环和filter & map & findIndex
/*
数组相关方法:
map
filter
forEach
some
every
slice
splice
findIndex
sort
*/
实例
1、for循环和filter ——找出数组中大于3的数组
<script type="text/javascript">
// 找出数组中大于3的数组
//方法一
let arr = [1, 2, 3, 4, 5, 6];
let ret = [];
for (let i = 0; i < arr.length; i++) {
if (arr[i] > 3) {
ret.push(arr[i])
}
}
console.log(ret)
//方法二
let ret = arr.filter(item => {
return item > 3
})
console.log(ret)
</script>
显示
2、map——对数组中的每一项数据进行加工处理,形成一个新的数组
<script type="text/javascript">
let arr = [1, 2, 3, 4, 5, 6];
let ret = arr.map(item => {
return item * item;
})
//箭头函数写法
// let ret = arr.map(item => item * item)
console.log(ret)
</script>
显示
3、findIndex ——找出数组中3对应的下标值
<script type="text/javascript">
let arr = [1, 2, 3, 4, 5, 6];
// 找出数组中3对应的下标值
let index = arr.findIndex(item => {
return item === 3
})
console.log(index)
</script>
显示
相关原理拆解实现-回调函数
<script type="text/javascript">
let arr = [1, 2, 3, 4, 5, 6];
// 找出数组中3对应的下标值
// 相关原理实现-回调函数
Array.prototype.myIndex = function (callback) {
// 查找索引:根据回调函数的返回值进行查找
// 这里的this是谁?其实数组的实例对象
let resultIndex = -1
this.forEach((item, index) => {
// item就是数组的其中一项数据
let flag = callback(item)
if (flag) {
// 找到索引了
resultIndex = index
}
})
return resultIndex
}
let index = arr.myIndex(item => {
return item === 3
})
console.log(index)
</script>
显示结果,同上
4、concat——数组的合并
<script type="text/javascript">
var arr1 = ['tom', 'kitty']
var arr2 = ['jerry']
// var arr = [...arr1, ...arr2]
// 数组的合并
var arr = arr1.concat(arr2)
console.log(arr)
</script>
显示