本文归纳了 JavaScript 十四类常见数组实例方法:并、展、排、归;增、删、改、截;填、判、位、选;迭、转
并、展、排、归
合并方法 (concat & ...)
let arr = ["foo","bar"]
let str = "baz"
let morArr = ["baz", "mor"]
...与 .concat() 方法
将值或数组并入原数组组成一个新数组(忽略二维数组结构)
- ✅
...扩展操作符(常用)let newArr = [...arr, str] // [foo, bar, baz]let newArr = [...arr, ...morArr) // ["foo", "bar", "baz", "mor"]
.concat()方法let newArr = arr.concat(str) // ["foo", "bar", "baz"]let newArr = arr.concat(morArr) // ["foo", "bar", "baz", "mor"]
Symbol.isConcatSpreadable
合并一个二维数组(保留二维数组结构)
morArr[Symbol.isConcatSpreadable] = falsearr.concat(morArr)输出["foo", "bar", ["baz", "mor"]]
展平方法 (flat & flatMap)
flat()
默认展平一层
[1, 2, [3, [4, 5]]].flat()
// [1, 2, 3, [4, 5]]
[1, 2, [3, [4, 5]]].flat(2)
// [1, 2, 3, 4, 5]
[1, [2, [3]]].flat(Infinity)
// [1, 2, 3]
flatMap()
相当于
map()+flat(),但只能展开一层数组
[2, 3, 4].flatMap((x) => [x, x * 2])
// [2, 4, 3, 6, 4, 8]
[1, 2, 3, 4].flatMap(x => [[x * 2]])
// [[2], [4], [6], [8]]
排序方法 (sort & reverse)
let arr = [1, 0, 5, 10]
按 数值大小 升序排列 (ascend)
.sort((a, b) => a - b); // 0, 1, 5, 10
按 字符串值顺序 升序排列
.sort() // 0, 1, 10, 5
按 数值大小 逆序 (reverse)
.reverse() // 10, 5, 1,0
归并方法 (reduce)
求数组值的和
.reduce((prev, cur) => prev + cur)从左往右加.reduceRight((prev, cur) => prev + cur)从右往左加
接收参数:
- 回调函数
- 归并初始值(可选)
增、删、改、截
pop() & push()
- 移除并返回末位元素:
.pop()
- 末位增加元素并返回新数组长度:
.push()
shift() & unshift()
- 移除并返回首位元素:
.shift()
- 首位增加元素并返回新数组长度:
.unshift()
slice()
不改变原数组,从原数组截取部分返回新数组
- 截取第 4 位起之后的元素:
slice(4)
- 截取第 4 位起至第 7 位前的元素:
slice(4, 7)
- 获取末位元素:
.slice(-1)
splice()
改变原数组,返回移除元素
- 从第一位起删除两个元素:
.splice(1, 2)
- 从第二位插入两个元素:
.splice(2, 0, "foo", "bar") // 第二个参数为 0,即移除元素个数为 0,返回空数组
- 替换第二位一个元素:
.splice(2, 1,"foo","bar")
填、判、位、选
填充方法 (fill & copyWithin)
fill()
- 用 5 填充整个数组:
.fill(5)
- 用 5 填充第三位之后的值:
.fill(5, 3)
- 用 5 填充第三位起,第七位前的值:
.fill(5, 3, 7)
- 用 5 填充倒数第四位起,末位前的值:
.fill(5, -4, -1)
copyWithin()
let arr = [0,1,2,3,4,5]
- 用第 3 位前的元素从第 3 位起填充数组
.copyWithin(3) // [0,1,2,0,1,2]
- 用第 3 位起的元素从第 0 位起填充数组
.copyWithin(0, 3) // [3,4,5,3,4,5]
- 用首位至第 3 位前的元素从第 4 位起填充数组
.copyWithin(4, 0, 3) // [0,1,2,3,0,1]
判断方法 (includes, some, every)
返回 true/ false
includes()
判断某元素是否 包含 在数组内(严格相等/全等比较)
some()
判断数组内的 某些 元素值是否满足特定条件
every()
判断数组内的 每一 元素值是否满足特定条件
查找元素位置 (indexOf, lastIndexOf, findIndex)
indexOf()
返回某元素在数组首先出现的位置,不存在返回 -1
lastIndexOf()
返回某元素在数组最后出现的位置,不存在返回 -1
findIndex()
返回符合给定条件元素首先出现的位置,不存在返回 -1
筛选查找元素 (filter, find)
find()
找出满足小于 0 的第一个元素,并返回该元素
find(el => el < 0)
filter()
筛选满足小于 0 的所有元素,并返回含这些元素的数组
filter(el => el < 0)
迭、转
循环迭代方法
.map().forEach()for (...of...)
数组或对象转字符串方法
.toString().valueOf().join(",").toLocaleString()