每次操作数组、字符串时,记忆力偶尔会抽风。清晰的归类方便查阅,也让记忆更加顺畅,毕竟大脑喜欢有规律的事务👊
一、数组遍历
map
不改变原数组:遍历数组中每一个值, 根据所需定义返回值
[1, 1].map((item) => { return '自定义' }) // ['自定义', '自定义']
forEach
不改变原数组:遍历数组中每一个值,没有返回值
[1].forEach((item) => { console.log(item) }) // 1
filter
不改变原数组: 返回满足条件的数据项(数组)
[{num: 2}].filter((item) => { return item.num > 1 }) // 找到:[{num: 2}] | 未找到: []
find
不改变原数组:返回满足条件的第一个元素的值(对象)
记忆补充: 总把filter与find返回值记混,filter既是过滤,可存在多个满足条件,一定是数组。而find是找满足条件第一个值,故对象非它莫属。
[{num: 2}].find((item) => { return item.num > 1 }) // 找到:{num: 2} | 未找到: undefined
findIndex
不改变原数组:返回满足条件的第一个元素的索引位置,如果不存在,则返回-1
[{num: 2}].findIndex((item) => { return item.num > 1 }) // 找到:0 | 未找到: -1
indexOf
不改变原数组:返回数组/字符串中指定元素首次出现的位置,如果不存在,则返回-1
数组/字符串通用:粗看indexOf与findIndex类似,都是寻找索引位置。但实际对比来看,findIndex拓展性更好,更适合数组。而indexOf相比适合简单的查询~
// 数组
['hello', 'world'].indexOf('world') // 1
// 字符串
'hello'.indexOf('e') // 1
some
不改变原数组:存在一项为true,则返回true
[2, 3].some((item) => { return item > 2 }) // true
every
不改变原数组:每一项为true,则返回true
[2, 3].every((item) => { return item > 1 }) // true
reduce
不改变原数组:返回累计处理的结果,常用于求和等
let purchases = [
{ item: "Widget", price: 10 },
{ item: "Gadget", price: 5 },
{ item: "Doodad", price: 5 }
];
let totalPrice = purchases.reduce((accumulator, currentPurchase) => {
return accumulator + currentPurchase.price;
}, 0); // 20
二、数组操作
push
改变原数组:将元素添加到数组的末尾,并返回该数组的新长度
let arr = [1, 2, 3]
let length = arr.push(4)
console.log(arr) // [1, 2, 3, 4]
console.log(length) // 4
pop
改变原数组:删除数组最后一个元素,并返回该元素的值;数组为空时,返回undefined
let arr = [1, 2, 3]
let value = arr.pop()
console.log(arr) // [1, 2]
console.log(value) // 3
unshift
改变原数组:将元素添加到数组的头部,并返回该数组的新长度
let arr = [1, 2, 3]
let length = arr.unshift(0)
console.log(arr) // [0, 1, 2, 3]
console.log(length) // 4
shift
改变原数组:删除数组中第一个元素,并返回该元素的值;数组为空时,返回undefined
let arr = [1, 2, 3]
let value = arr.shift()
console.log(arr) // [2, 3]
console.log(value) // 1
splice
改变原数组:用于添加或删除数组中的元素。(从0开始)
数组/字符串通用:👊
array.splice(index, howmany, item1)(从何处添加/删除元素、应该删除多少元素、要添加的元素)
// 添加元素
let fruits = ["A", "B", "E"]
fruits.splice(2,0,"C","D") // fruits输出:["A", "B", "C", "D", "E"]
// 删除元素
let fruits = ["A", "B", "C", "D"]
fruits.splice(2,2) // fruits输出:["A", "B"]
// 替换元素
let fruits = ["A", "D", "C"]
fruits.splice(1,1,'B') // fruits输出:["A", "B", “C”]
slice
不改变原数组:返回选定的元素(从0开始)。
数组/字符串通用:👊
array.splice(start, end)// start:开始位置(包括该元素), end:结束位置(不包括该元素)
// 数组
['hello', 'world'].slice(1, 2) // world
// 字符串
'hello'.slice(1,2) // 'e'
concat
不改变原数组:合并两个或两个以上数组,返回一个新数组
let arr1 = [1, 2]
let arr2 = [3, 4]
let arr3 = [5]
let arr = arr1.concat(arr2, arr3)
console.log(arr) // [1, 2, 3, 4, 5]
join
不改变原数组:把数组中所有元素转换为一个字符串,可设置参数指定数组元素之间的分隔符
let arr = [1, 2, 3]
let value = arr.join('a')
console.log(value) // '1a2a3a'
includes
不改变原数组:检测数组元素中是否含有指定元素
[1, 2, 3].includes(2) // true
总结
基于以上有如下归类:
改变原数组的方法: splice、push、pop、unshift、shift
不改变原数组方法: slice、map、forEach、filter、find、findIndex、indexOf、some、every、reduce、concat、join、includes