filter
filter的作用是过滤,当我们需要对已知数组进行过滤时,可以使用此方法。
filter,会接收一个回调函数作为参数,对这个回调函数也有要求。回调函数最多接收三个参数,参数顺序为:数组某一项、数组某一项对应的下标、数组本身,返回值需要是boolean类型,也就是true/false。
filter方法执行完成之后会返回一个新的数组,新数组的内容是过滤后符合条件的项。而原数组的内容并不会被改变。
回调函数:把一个函数a作为参数传入另一个函数中,那么函数a就是一个回调函数。
代码示例:
/**
我们已知一个数组,他由数字组成,当我们需要过滤掉其中小于5的项时,我们可以这么写。
过滤完成后,我们方法会返回过滤后的结果数组,而我们去看原数组,并没有改变。
所以这个代码执行之后,可以在控制台上看到:
arr1 依旧是 [1, 2, 6, 7]
arr2 是 [6, 7]
*/
const arr1 = [1, 2, 6, 7];
const arr2 = arr1.filter(function (item) {
return item >= 6;
})
console.log(arr1, arr2)
/**
依旧是用arr1来举例,现在我们需要过滤掉下标为奇数的项,我们可以这么写。\
通过对2取余的方式判断他是不是奇数,如果余数为1则是奇数
这个代码执行之后,可以在控制台上看到:
arr1 依旧是 [1, 2, 6, 7]
arr2 是 [2, 7]
*/
const arr1 = [1, 2, 6, 7];
const arr2 = arr1.filter(function (item, index) {
return index % 2 == 1;
})
console.log(arr1, arr2)
forEach
forEach可以代替for循环来进行数组的循环,他的作用就是循环遍历。
forEach方法接收一个回调函数,回调函数最多有三个参数,参数的顺序为:数组的某一项、数组某一项的下标、数组本身,不要求回调函数的返回值,可以不加返回值。当然如果有返回值,也没有对返回值做任何的处理。
forEach方法的作用是循环,执行完成后,是没有返回值的,也不会改变原数组。
调用forEach方法时,别忘了E是大写的。
代码示例:
/**
数组arr1, 我们可以循环数组数组的每一项。
代码执行之后,可以在控制台上看到:
1
2
6
7
*/
const arr1 = [1, 2, 6, 7];
arr1.forEach(function(item) {
console.log(item)
})
/**
数组arr1, 循环遍历,取得数组的某一项之后,先加一,再输出。
代码执行之后,可以在控制台上看到:
2
3
7
8
arr1 依旧是 [1, 2, 6, 7]
*/
const arr1 = [1, 2, 6, 7];
arr1.forEach(function(item) {
item++;
console.log(item)
})
console.log(arr1)
map
map和forEach很相似,都是循环遍历,但是又有所不同,forEach仅仅是简单的循环遍历,而map的功能则更多。
map也是接受一个回调函数作为参数,回调函数的参数与forEach是相同的,但是他要求回调函数需要有返回值,并且map会用回调函数的返回值替换调原数组的对应项,如果回调函数没有返回值,会用undefined代替。
map执行后会返回一个新数组,新数组的内容是回调函数的返回值。map是不会改变原数组的。
代码示例:
/**
数组arr1,将数组每一项都乘以2。
代码执行之后,可以在控制台上看到:
arr1 依旧是 [1, 2, 6, 7]
arr2 是 [2, 4, 12, 14]
*/
const arr1 = [1, 2, 6, 7];
const arr2 = arr1.map(function(item) {
return item * 2;
})
console.log(arr1, arr2)
join
join的作用是将数组拼接成一个字符串,他会在数组的每一项之间添加指定的字符串。
join接受一个参数,参数是字符串类型,用于拼接在数组每项之间。如果没有传入参数,则默认以逗号隔开。
join执行完成会返回拼接好的字符串。
代码示例:
/**
数组arr1,将数组拼接成一个字符串,并以“ - ”隔开。
代码执行之后,可以在控制台上看到:
1-2-6-7
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.join("-"))
slice
slice的作用是切割数组,执行后会返回切割的数组,并且不会改变原数组。
slice最多接受两个参数,参数为下标,Number类型,他会根据参数的不同进行不同的切割方式。
参数分为负数和非负数。非负数的情况,指的是下标。负数的情况,是指的是从后向前数的下标,比如-1,代表的是最后一位。
参数类型示例
- 无参数
- 一个参数:非负数
- 一个参数:负数
- 两个参数:非负数、非负数
- 两个参数:非负数、负数
- 两个参数:负数、非负数
- 两个参数:负数、负数
代码示例:
/**
无参数时,返回的是整个数组,但此时是浅拷贝,要注意记住这一点。
代码执行之后,可以在控制台上看到:
[1, 2, 6, 7]
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.slice())
/**
一位参数时,返回的是从对应下标开始,到最后一位所组成的新数组。
比如arr1,传入参数1,是指从下标为1的位置开始,到数组结束的位置
代码执行之后,可以在控制台上看到:
[2, 6, 7]
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.slice(1))
/**
数组arr1,传入参数-1,是指从数组倒数第一位的位置开始,到数组结束的位置
代码执行之后,可以在控制台上看到:
[2, 6, 7]
*/
const arr1 = [7];
console.log(arr1.slice(-1))
/**
两位参数时,返回的是第一个参数对应下标的位置开始,到第二个参数对应下标的位置结束。
会包含开始位置,不包含结束位置,如果开始与结束位置相同,则判定为不包含。
如果下标区间内没有内容,则返回空数组。
比如arr1,传入参数1, 3,是指从下标为1的位置开始,到下标为3的位置结束,不包含下标3
代码执行之后,可以在控制台上看到:
[2, 6]
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.slice(1, 3))
/**
比如arr1,传入参数1, 1,是指从下标为1的位置开始,到下标为1的位置结束,不包含下标1
代码执行之后,可以在控制台上看到:
[]
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.slice(1, 1))
/**
比如arr1,传入参数-3, -1,是指从下标为-3的位置开始,到下标为-1的位置结束,不包含下标-1
代码执行之后,可以在控制台上看到:
[2, 6]
*/
const arr1 = [1, 2, 6, 7];
console.log(arr1.slice(1, 1))