js 数组的常用属性与方法
https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array
属性
length 长度
js
[1, 2, 3].length // 3
方法
at() 访问元素
js
let arr = ['python', 'abc', 'xyz']
arr.at(0) // 'python'
arr.at(-1) // 'xyz'
arr.at(3) // undefined
arr.at(-4) // undefined
- 与
[]
几乎一致 at
支持负数下标,而[]
不支持- 负数下标从 -1 开始
- 下标超出范围会返回
undefined
concat() 合并多个数组
js
let arr1 = ['a', 'b', 'c']
let arr2 = ['x', 'y', 'z']
let arr3 = ['1', '2', '3']
arr1.concat(arr2) // ['a', 'b', 'c', 'x', 'y', 'z']
arr1.concat(arr2, arr3) // ['a', 'b', 'c', 'x', 'y', 'z', '1', '2', '3']
arr1.concat() // ['a', 'b', 'c']
- 返回新数组,原数组不变
- 省略参数时,返回原数组的浅拷贝
every() 所有元素为真则真
js
let arr = ['python', 'abc', 'xyz']
// 判断所有元素长度是否大于等于 3;下述返回 true
arr.every(function(element, index, array) {
return element.length >= 3
})
- 返回值为布尔值(
true
/false
) - 每个元素均调用一次测试函数,测试函数返回
true
或false
- 只要有一个元素返回
false
则立即停止遍历,同时every()
方法立即返回false
- 所有元素测试返回
true
,every()
方法才会返回true
- 对于空数组,它只返回
true
some() 有一个元素为真则真
js
let arr = ['python', 'abc', 'xyz']
// 判断是否有元素长度大于等于 5;下述返回 true
arr.every(function(element, index, array) {
return element.length >= 5
})
- 与
every()
方法类似,不同点:- 只要有一个返回
true
则立即停止遍历,同时方法立即返回true
- 所有元素测试返回
false
时,方法才返回false
- 对于空数组,它只返回
false
- 只要有一个返回
forEach() 遍历并执行函数
js
let arr = ['python', 'abc', 'xyz']
// 打印所有元素的长度,输出 6 3 3
arr.forEach((element) => console.log(element.length))
// 在循环体内使用 this
array.forEach(function countEntry(entry) {
this.sum += entry;
++this.count;
}, this);
- 除非抛出异常,否则没有办法停止或中断
forEach()
循环 - 所以不要在
forEach()
中使用break
,return
等循环控制语句 - 使用
this
时,不能使用箭头函数表达式
includes() 判断是否包含
js
let arr = ['python', 'abc', 'xyz']
arr.includes('abc') // true
arr.includes('abcd') // false
arr.includes('abc', 3) // false
- 与字符串的
includes()
方法一样
indexOf() 查找元素
js
let arr = ['python', 'abc', 'xyz']
arr.indexOf('abc') // 1
arr.indexOf('abcd') // -1
arr.indexOf('abc', 3) // -1
- 与字符串的
indexOf()
方法一样 - 未找到返回 -1;找到返回索引下标
join() 拼接成字符串
js
let arr = ['python', 'abc', 'xyz']
arr.join('.') // 'python.abc.xyz'
arr.join('00') // 'python00abc00xyz'
- 默认以英文逗号拼接
filter() 过滤元素
js
let arr = ['python', 'abc', 'xyz']
arr.filter((item) => item.length >= 6) // ['python']
map() 为每个元素执行相同的函数调用,返回新数组
js
let arr = [1, 2, 3]
arr.map((x) => x * 2) // [2, 4, 6]
reduce() 为每个元素执行相同的函数调用,返回合并值
js
let arr = [1, 2, 3]
arr.reduce((a, b) => a + b) // 6
- 回调函数的返回值会作为下一次此函数的第一个参数
- 最后一次调用时,回调函数的返回值就是
reduce()
的返回值
pop() 弹出最后一个元素
js
let arr = ['python', 'abc', 'xyz']
arr.pop() // 'xyz'
arr.pop() // 'abc'
arr // ['python']
- 会修改原数组,删除并返回数组最后一个元素
- 如果数组为空,则返回
undefined
shift() 删除第一个元素
js
let arr = ['python', 'abc', 'xyz']
arr.shift() // 'python'
arr.shift() // 'abc'
arr // ['xyz']
- 会修改原数组,删除并返回数组第一个元素
- 如果数组为空,则返回
undefined
push() 追加元素
js
let arr = ['python', 'abc', 'xyz']
arr.push('123') // 4
arr // ['python', 'abc', 'xyz', '123']
arr.push('aoe', 'iuv') // 6
arr // ['python', 'abc', 'xyz', '123', 'aoe', 'iuv']
- 直接改变原数组,新元素会加到原数组末尾
- 返回值为数组的新的长度
unshift() 在开头添加元素
js
let arr = ['python', 'abc', 'xyz']
arr.unshift('123') // 4
arr // ['123', 'python', 'abc', 'xyz']
arr.unshift('aoe', 'iuv') // 6
arr // ['aoe', 'iuv', '123', 'python', 'abc', 'xyz']
- 直接改变原数组,新元素会加到原数组开头
- 返回值为数组的新的长度
slice() 切片
js
let arr = ['python', 'abc', 'xyz']
arr.slice(0, 2) // ['python', 'abc']
arr.slice(-1) // ['xyz']
- 与字符串的
slice()
方法几乎一样 - 左闭右开区间
- 索引下标可以是负数,从 -1 开始
sort() 就地排序
js
let arr = ['python', 'abc', 'xyz']
arr.sort() // ['abc', 'python', 'xyz']
// 要比较数字而非字符串,比较函数可以简单的用 a 减 b
function compareNumbers(a, b) {
return a - b;
}
- 就地排序,直接改变原数组
- 如果不想改变原数组,可以使用
toSorted()
方法,其用法与sort()
一致;只是返回新数组 - 默认是所有元素会转为字符串进行比较排序
- 可选参数:比较函数
compareFn(a, b)
,此函数应返回-1
/0
/1
reverse() 就地反转、逆序
js
let arr = ['python', 'abc', 'xyz']
arr.reverse() // ['xyz', 'abc', 'python']
- 就地反转,直接改变原数组
- 无参数
- 对应的复制版本:
toReversed()
方法,用法一致,但返回新数组,原数组不变
splice() 指定位置添加或删除元素
js
let arr = ['a', 'b', 'c', 'd', 'e', 'f']
// 删除下标 4 以及之后的所有元素
arr.splice(4) // ['e', 'f']
arr // ['a', 'b', 'c', 'd']
// 删除下标 2 的元素
arr.splice(2, 1) // ['c']
arr // ['a', 'b', 'd']
// 在下标 1 处插入 1,2,3 三个元素
arr.splice(1, 0, 1, 2, 3) // []
arr // ['a', 1, 2, 3, 'b', 'd']
// 在下标 0 处删除两个元素,然后接着插入 x,y 两个元素
arr.splice(0, 2, 'x', 'y') // ['a', 1]
arr // ['x', 'y', 2, 3, 'b', 'd']
- 返回值为删除的元素组成的数组,未删除则为空数组
- 会直接改变原数组
- 也有对应不改变原数组的方法:
toSpliced()
toString() 转为字符串
js
let arr = ['python', 'abc', 'xyz']
arr.toString() // 'python,abc,xyz'
- 内部是调用了
join()
方法,使用英文逗号分隔 - 如果
join()
方法不可用或者不是函数,则会使用Object.prototype.toString
来代替,并返回[object Array]
Array.isArray() 判断是否是数组
js
Array.isArray([1, 2, 3]) // true
Array.isArray('abc') // false
遍历
forEach 方法
js
let arr = ['a', 'b', 'c']
arr.forEach(function (item) {
console.log(item) // a b c
})
for 语句
js
let arr = ['a', 'b', 'c']
for (let i=0; i<arr.length; i++) {
console.log(i, arr[i]) // 0 a 1 b 2 c
}
for...of 语句
推荐
js
let arr = ['a', 'b', 'c']
for (let v of arr) {
console.log(v) // a b c
}