join
join():用指定的分隔符将数组每一项拼接为字符串
const a = [1,2,3,4,5]
a.join('-') // 1-2-3-4-5 返回新生成的字符串,不改变原数组
push
push():向数组的末尾添加新元素
const a = [1,2,3,4,5]
a.push(1) // [ 1, 2, 3, 4, 5, 1 ]
const b = [7,8,9,10]
a.push(...b) // [1, 2, 3, 4, 5, 7, 8, 9, 10] 可以用扩展运算符进行数组的拼接
pop
pop():删除数组的最后一项,把[数组长度]减 1,并且返回它删除的元素的值。如果数组已经为空,则 pop() 不改变数组,并返回 undefined 值。
const a = [1,2,3,4,5,6]
a.pop() // [1,2,3,4,5]
shift
shift():删除数组的第一项,数组为空时返回空数组
const a = [1,2,3,4,5,6]
a.shift() // [ 2, 3, 4, 5, 6 ]
unshift
unshift():向数组首位添加新元素
const a = [1,2,3,4]
a.unshift(8) // [ 8, 1, 2, 3, 4 ]
slice
slice():按照条件查找出其中的部分元素,不改变原数组
const a = [1,2,3,4,5,6]
a.slice(1) // [ 2, 3, 4, 5, 6 ]
a.slice(-3) // [ 4, 5, 6 ]
a.slice(1,3) // [ 2, 3 ]
const b = {
length:2,
0:'name',
1:'sex'
} // 类数组
const arguments = Array.prototype.slice.call(b) // [ 'name', 'sex' ]
splice
splice():对数组进行增删改
const a = [1,2,3,4,5,6]
a.splice(1,2) //[ 2, 3 ] 返回删除的内容
a.slice(1,1,8)// [ 2 ] 返回被替换的值,原数组发生改变 [ 1, 8, 3, 4, 5, 6 ]
a.splice(1,0,'in') // 返回空数组,原数组发生改变 [1, 'in', 2, 3,4, 5, 6]
fill
fill(): 方法能使用特定值填充数组中的一个或多个元素
const a = new Array(5)
a.fill(1) // 原数组改变 [ 1, 1, 1, 1, 1 ]
const b = [1,2,3,4,5,6]
b.fill(2,3) // 原数组改变 [ 1, 2, 3, 2, 2, 2 ] 2为填充的元素,3位填充元素的在数组中的起始位置
filter
filter():“过滤”功能 filter() 不会对空数组进行检测;filter() 不会改变原始数组
const a = [1,2,3,4,5,6]
a.filter(num => {
return num === 1
}) // 返回一个符合过滤条件的数组
concat
concat():用于连接两个或多个数组,对象也是可以进行连接的
const a = [1,2,3,4,5,6]
const b = [7,8,9]
a.concat(b) // 返回新的数组[1, 2, 3, 4, 5, 6, 7, 8, 9]
const c = {
1:1,
2:2
}
a.concat(c) //返回新的数组 [ 1, 2, 3, 4, 5, 6, { '1': 1, '2': 2 } ]
indexOf
indexOf():检测当前值在数组中第一次出现的位置索引
const a = [1,2,3,4,5,6,7,8,1]
const index = a.indexOf(1) // 0
lastIndexOf
lastIndexOf():检测当前值在数组中最后一次出现的位置索引
const a = [1,2,3,4,5,6,7,8,1]
const index = a.lastIndexOf(1) // 8
every
every():判断数组中每一项都是否满足条件
const a = [1,2,3,4,5,6,7,-1]
const checked = a.every(num=>{
return num > 0
}) // false
some
- some():判断数组中是否存在满足条件的项
const a = [1,2,3,4,5,6,7]
a.some(num=>{
return num >6
}) // true
includes
- includes():判断一个数组是否包含一个指定的值
const a = [1,2,3,4,5,6,7,8]
const checked = a.includes(1) // true
sort
- sort():对数组的元素进行排序
const a = [1,2,3,4,5]
a.sort((a,b)=>{
return b-a
}) // 按照从大到小排序 [ 5, 4, 3, 2, 1 ]
a.sort((a,b)=>{
return a-b
}) // 按照从小到大排序 [ 1, 2, 3, 4, 5 ]
reverse
reverse():返回值为Array类型,返回元素顺序被反转后的数组对象
const a = [1,2,3,4]
a.reverse() // [ 4, 3, 2, 1 ]
forEach
forEach():循环遍历数组每一项,且是同步执行,JavaScript 中的 forEach不支持 promise 感知,也支持 async 和await,所以不能在 forEach 使用 await 。,forEach不支持break,return在forEach循环体中是无效的,不要在循环体中删除原数组,forEach的index是隐性自增的
const a = [1,2,3,4]
a.forEach(item => {
})
map
map():循环遍历数组每一项
const a = [1,2,3,4,5]
const b = a.map(item=>{
return 1
}) // [ 1, 1, 1, 1, 1 ] 返回一个新数组并不会改变原数组
const a = [1, 2, 3, 4, 5];
async function mapHttp() {
const test = a.map( async (item) => {
return { key: await http() };
}); // 只会返回promise数组
console.log(await Promise.all(test)); // [ { key: 1 }, { key: 1 }, { key: 1 }, { key: 1 }, { key: 1 } ]
}
function http() { // 模拟异步请求
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(1);
});
});
}
copyWithin
copyWithin():用于从数组的指定位置拷贝元素到数组的另一个指定位置中
const arr = [1,2,3,4,5,7]
arr.copyWithin(0,3,4) // [ 4, 2, 3, 4, 5, 7 ] 0为被覆盖的开始位置,3为要复制的起始位置,4为被复制的结束位置
find
find():返回匹配的值
const a = [1,2,3,4,5,6,7,8]
const b = a.find(num=>{
return num ===1
}) // 1 返回第一个符合条件条件的元素
findIndex
findIndex():返回匹配位置的索引
const a = [1,2,3,4,5,6,7,8]
const index = a.find(num=>{
return num ===1
}) // 0 返回第一个符合条件的索引位置
toLocaleString
toLocaleString():将数组转换为字符串
const num = 121212121
num.toLocaleString(); // 121,212,121
toString
toString():将数组转换为字符串'
const num = 121212121
num.toLocaleString(); // 121212121
flat(ES6)
flat():扁平化数组
const a = [1,2,3,5,6,['a','b','c',[1,2,3]]]
const b = a.flat() // [ 1, 2, 3, 5, 6, 'a', 'b', 'c', [ 1, 2, 3 ] ]
const b = a.flat(Infinity) // [1, 2, 3, 5, 6,'a', 'b', 'c', 1, 2, 3]
// 那么如何我们去实现与flat相同功能的数组拉平方法呢
// 方法一
const text = a.toString().split(",") // 会将类型都转换为String
// 方法二
function _flat(arr, limit = 1) {
let result = [];
for (let i = 0; i < arr.length; i++) {
if (Array.isArray(arr[i]) && limit > 0) {
result = result.concat(_flat(arr[i], limit - 1));
} else {
result.push(arr[i]);
}
}
return result;
} // 可以传limit 控制解析多少层,且数据的类型不会发生变化
flatMap
flatMap():扁平化数组
entries
entries():遍历数组
keys
keys():遍历数组
values
values():遍历数组