首先对于数组的API,我是以原数组是否改变去分的两类,一种是会改变自身数组的方法,另一种不会.
至于是ES6还是ES5的方法并没有过多的记忆,会用即可
| 序号 | 数组方法 | 功能 | 原数组是否改变 |
|---|---|---|---|
| 1 | push() | 在数组的最后一位新增一个或多个数据,返回值是长度 | 改变 |
| 2 | unshift() | 在数组的第一位新增一个或多个数据,返回值是长度 | 改变 |
| 3 | pop() | 删除最后一位,并返回删除的数据 | 改变 |
| 4 | shift() | 删除第一位,并返回删除的数据 | 改变 |
| 5 | reverse() | 反转数组,返回结果 | 改变 |
| 6 | join() | 使用分隔符,将数组转为字符串并返回 | 不改变 |
| 7 | slice() | 截取指定位置的数组,并返回 | 不改变 |
| 8 | concat() | 合并数组,并返回合并之后的数据 | 不改变 |
| 9 | sort() | 排序(字符规则),返回结果 | 改变 |
| 10 | splice() | 删除指定位置,并替换,返回删除的数据 | 改变 |
| 11 | toString() | 直接转为字符串,并返回 | 不改变 |
| 12 | valueOf() | 返回数组对象的原始值 | 不改变 |
| 13 | indexOf() | 查询并返回数据的索引 | 不改变 |
| 14 | lastIndexOf() | 反向查询并返回数据的索引 | 不改变 |
| 15 | forEach() | 参数为回调函数，会遍历数组所有的项，回调函数接受三个参数，分别为value，index，self； forEach返回值undefind | 不改变 |
| 16 | map() | 同forEach，同时回调函数返回数据，组成新数组由map返回 | 不改变 |
| 17 | filter() | 同forEach，同时回调函数返回布尔值，为true的数据组成新数组由filter返回 | 不改变 |
| 18 | every() | 同forEach，同时回调函数返回布尔值，全部为true，由every返回true | 不改变 |
| 19 | some() | 同forEach，同时回调函数返回布尔值，只要由一个为true，由some返回true | 不改变 |
| 20 | reduce() | 归并，同forEach，迭代数组的所有项，并构建一个最终值，由reduce返回 | 不改变 |
| 21 | reduceRight() | 反向归并，同forEach，迭代数组的所有项，并构建一个最终值，由reduceRight返回0 | 不改变 |
| 22 | some() | 会遍历数组中的每个元素，让每个值都执行一遍callback函数, 如果有一个元素满足条件，返回true , 剩余的元素不会再执行检测。 如果没有满足条件的元素，则返回false。 | 不改变 |
1.push(),在数组的最后一位新增一个或多个数据,返回值是长度
-
let arr1 = [
1,
2,
3,
4,
5]
-
let num =
6
-
let result = arr1.
push(num)
-
console.
log(arr1);
// [1, 2, 3, 4, 5, 6]
-
console.
log(result);
//6
2.unshift(),在数组的第一位新增一个或多个数据,返回值是长度
-
let arr1 = [
1,
2,
3,
4,
5]
-
let num =
6
-
let result = arr1.
unshift(num)
-
console.
log(arr1);
//[6, 1, 2, 3, 4, 5]
-
console.
log(result);
//6
3.pop(),删除最后一位,并返回删除的数据
-
let arr1 = [
1,
2,
3,
4,
5]
-
let result = arr1.
pop()
-
console.
log(arr1);
//[1, 2, 3, 4]
-
console.
log(result);
//5
4.shift(),删除第一位,并返回删除的数据
-
let arr1 = [
1,
2,
3,
4,
5]
-
let result = arr1.
shift()
-
console.
log(arr1);
//[2, 3, 4, 5]
-
console.
log(result);
//1
5.reverse(),反转数组,返回结果
-
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
reverse()
-
console.
log(arr);
//[5, 4, 3, 2, 1]
-
console.
log(result);
//[5, 4, 3, 2, 1]
6.join("连接符"),使用分隔符,将数组转为字符串并返回
常用场景一:
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
join()
-
console.
log(arr);
// [1, 2, 3, 4, 5]
-
console.
log(result);
// 1,2,3,4,5
常用场景二:
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
join(
"")
-
console.
log(arr);
// [1, 2, 3, 4, 5]
-
console.
log(result);
// 12345
常用场景三:
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
join(
"|")
-
let result2 = arr.
join(
" and ")
-
console.
log(arr);
// [1, 2, 3, 4, 5]
-
console.
log(result);
// 1|2|3|4|5
-
console.
log(result2);
// 1 and 2 and 3 and 4 and 5
7.slice((start[,end]),截取指定位置的数组,并返回
tips:第一个参数为起始索引,
第二个参数为结束索引,可传可不传
截取结果含头不含尾
省略第二个参数表示start位置开始一直截取到末尾
支持附属,表示倒数第几个开始
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
slice(
1,
3)
//含头不含尾
-
let result2 = arr.
slice(
1)
//省略第二个参数表示从start位置开始一直截取到末尾
-
let result3 = arr.
slice(-
3)
//支持负数，表示倒数第几个
-
console.
log(arr);
// [1, 2, 3, 4, 5] //含头不含尾
-
console.
log(result);
// [2, 3]
-
console.
log(result2);
// [2, 3, 4, 5]
-
console.
log(result3);
// [3, 4, 5]
8.concat(),合并数组,并返回合并之后的数据
tips:不会修改原数组，返回新数组;
concat() 的某个参数本身是一个数组，则会将该数组的元素衔接到 arr 中
-
let arr = [
1,
2,
3]
-
let arr2 = [
6,
7,
8,
9]
-
let arr3 = [
4, [
5, [
7,
8]]]
-
let result = arr.
concat(arr2)
-
let result2 = arr.
concat(
4,
5)
-
let result3 = arr.
concat(arr3)
-
console.
log(result);
//[1, 2, 3, 6, 7, 8, 9]
-
console.
log(result2);
//[1, 2, 3, 4, 5]
-
console.
log(result3);
//[1, 2, 3, 4, Array(2)]
9.sort(),排序(字符规则),返回结果,会改变原数组
(1)默认按照数组元素第一位的ASCII码从小到大排列,并不是从大到小!
-
let arr = [
9,
311,
81,
1,
2,
8,
3,
4,
9,
2,
1,
6,
7]
-
let result = arr.
sort()
-
console.
log(arr)
//直接修改原数组
-
console.
log(result);
//[1, 1, 2, 2, 3, 311, 4, 6, 7, 8, 81, 9, 9]
(2)设置回调函数,即可实现升序降序的实现
-
let arr = [
9,
311,
81,
1,
2,
8,
3,
4,
9,
2,
1,
6,
7]
-
let result = arr.
sort(
function (
a, b) {
-
return a - b
-
})
-
console.
log(arr)
//[1, 1, 2, 2, 3, 4, 6, 7, 8, 9, 9, 81, 311]
-
console.
log(result);
//[1, 1, 2, 2, 3, 4, 6, 7, 8, 9, 9, 81, 311]
-
-
result = arr.
sort(
function (
a, b) {
-
return b - a
-
})
-
console.
log(arr)
//[311, 81, 9, 9, 8, 7, 6, 4, 3, 2, 2, 1, 1]
-
console.
log(result);
//[311, 81, 9, 9, 8, 7, 6, 4, 3, 2, 2, 1, 1]
(3)随机打散(拓展)
-
-
let arr = [
9,
311,
81,
1,
2,
8,
3,
4,
9,
2,
1,
6,
7]
-
arr.
sort(
function (
) {
-
undefined
-
return
Math.
random() >
.5 ?
1 : -
1
-
})
-
console.
log(arr);
//[6, 81, 7, 2, 8, 4, 2, 1, 9, 311, 1, 3, 9]
10.splice(start, deleteCount [,value1,value2...]) ,删除指定位置,并替换,返回删除的数据
1.只传star参数,删除后面所有元素,并返回删除的元素
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
splice(
1)
-
console.
log(arr);
//[1]
-
console.
log(result);
//[2, 3, 4, 5]
2.两个参数,从 start 开始，并包含 start 处的元素,删除deleteCount个元素
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
splice(
1,
2)
-
console.
log(arr);
//[1, 4, 5]
-
console.
log(result);
//[2, 3]
3.三个参数
替换写法: 第三个参数为替换的值
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
splice(
2,
1,
"6")
-
console.
log(arr);
// [1, 2, '6', 4, 5]
-
console.
log(result);
//[3]
插入写法:第二个参数为0,插入元素在start前面
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
splice(
2,
0,
"6")
-
console.
log(arr);
// [1, 2, '6', 3, 4, 5]
-
console.
log(result);
//[]
11.toString() ,直接转为字符串,并返回,不会改变原数组
也可以写成 String(arr)
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
toString()
-
console.
log(arr);
//[1, 2, 3, 4, 5]
-
console.
log(result);
//1,2,3,4,5
12.valueOf(),返回数组对象的原始值 不改变原数组,对于数组几乎不用
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
valueOf()
-
console.
log(arr);
//[1, 2, 3, 4, 5]
-
console.
log(result);
//[1, 2, 3, 4, 5]
13.indexOf(),查询并返回数据的索引,不改变数组本身
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
indexOf(
5)
-
let result2 = arr.
indexOf(
6)
-
console.
log(arr);
//[1, 2, 3, 4, 5]
-
console.
log(result);
//4 找到返回目标索引
-
console.
log(result2);
//-1 未找到返回-1
14.lastIndexOf() ,反向查询并返回数据的索引,不改变数组本身
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
lastIndexOf(
1)
-
let result2 = arr.
indexOf(
6)
-
console.
log(arr);
//[1, 2, 3, 4, 5]
-
console.
log(result);
//0 找到返回目标索引
-
console.
log(result2);
//-1 未找到返回-1
15.forEach(),参数为回调函数，会遍历数组所有的项，回调函数接受三个参数，分别为value，index，self； forEach返回值undefind
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
forEach(
(item, index, self) => {
-
console.
log(item, index, self)
-
// 参数item: 数组中每一项的内容
-
// 参数index: 数组索引
-
// 参数a: 指的是数组本身
-
})
-
console.
log(result);
// undefined
16.map() 同forEach，同时回调函数返回数据，组成新数组由map返回,不改变原数组
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
map(
(item) => {
-
return item +
1
-
})
-
console.
log(result)
// [2, 3, 4, 5, 6]
-
console.
log(arr)
//原数组不变[1, 2, 3, 4, 5]
17.filter() 同forEach，同时回调函数返回布尔值，为true的数据组成新数组由filter返回,不改变原数组
tips:返回是过滤的数组喔~
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
filter(
(item) => {
-
return item >
2
//true的时候返回item,false不返回
-
})
-
console.
log(result)
// 返回筛选结果[3, 4, 5]
-
console.
log(arr)
//原数组不变[1, 2, 3, 4, 5]
18.every(),同forEach，同时回调函数返回布尔值，全部为true，由every返回true
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
every(
(item) => {
-
return item >=
1
-
})
-
console.
log(result)
// 全部满足条件返回true
-
console.
log(arr)
//原数组不变[1, 2, 3, 4, 5]
如果有一个不满足条件 例如:
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
every(
(item) => {
-
return item >=
2
-
})
-
console.
log(result)
// false
-
console.
log(arr)
//原数组不变[1, 2, 3, 4, 5]
19.some(),同forEach，同时回调函数返回布尔值，只要由一个为true，由some返回true,不会改变原数组
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
some(
(item) => {
-
return item >=
4
-
})
-
console.
log(result);
//true 当有item其中一项为true的时候就会返回true
-
console.
log(arr);
//[1, 2, 3, 4, 5]
20.reduce(),归并，reduce的第2个参数是可选的，也就是初始值是可选的。当不指定初始值时，它将使用数组的第一个元素作为初始值。函数里面的 index 是当前 value 在数组中的索引。当不传入初始值的时候，index 是从 1 开始的，总的循环次数比数组长度少1。当传入初始值的时候，index 是从 0 也就是第一个元素开始，数组有多长就会遍历几次。
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
reduce(
(total, value, index, arr) => {
-
return total + value
-
},
0)
-
console.
log(result);
//15
-
console.
log(arr);
//[1, 2, 3, 4, 5]
21.reduceRight(),reduceRight() 的工作原理和 reduce() 一样，不同的是它按照数组索引从高到低（从右到左）处理数组。
-
let arr = [
1,
2,
3,
4,
5]
-
let result = arr.
reduceRight(
function (
x, y) {
-
return x / y;
-
});
-
console.
log(arr);
// [1, 2, 3, 4, 5]
-
console.
log(result);
//0.20833333333333334
22.some(),会遍历数组中的每个元素，让每个值都执行一遍callback函数,
如果有一个元素满足条件，返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素，则返回false,不改变本身
-
let arr = [
1,
2,
3,
4,
5,
6,
7,
8]
-
let result = arr.
some(
(item) => {
-
return item >
9
-
})
-
let result2 = arr.
some(
(item) => {
-
return item >
5
-
})
-
console.
log(arr);
// [1, 2, 3, 4, 5, 6, 7, 8]
-
console.
log(result);
//false
-
console.
log(result2);
//true
173
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
