1.数组填充 fill()
语法:array.fill(value, start, end)
value | 必填:填充的值 |
---|---|
start | 选填:开始的位置 |
end | 选填:结束位置 |
arr = [1,2,3,4,5];
arr.fill(0);
//[0, 0, 0, 0, 0]
arr.fill(1,1);
//(5) [0, 1, 1, 1, 1]
arr.fill(2,2,3);
//[0, 1, 2, 1, 1]
arr = new Array(5).fill(0);
//[0, 0, 0, 0, 0]
2.数组合并 concat()
语法:array.concat(arr1,arr2,…)
参数选填,不填参数则进行数组复制操作 |
---|
arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = arr1.concat(arr2);//[1, 2, 3, 3, 4, 6]
arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = [];
arr3 = arr3.concat(arr1, arr2);//[1, 2, 3, 3, 4, 6]
在es6中,还可以使用拓展运算符进行数组合并
arr1 = [1,2,3]
arr2 = [3,4,6]
arr3 = [...arr1, ...arr2]//[1, 2, 3, 3, 4, 6]
3.from()
Array.from可以将两类对象转为真正的数组:拥有 length 属性的对象或可迭代的对象
语法:Array.from(object, mapFunction, thisValue)
object | 必需,要转换为数组的对象。 |
---|---|
mapFunction | 对每个元素的操作 |
thisValue | 可选,映射函数(mapFunction)中的 this 对象。 |
temp = {
'0': 1,
'1': 2,
'2': 3,
length: 3,
}
arr = Array.from(temp);//[1, 2, 3]
arr = Array.from(temp, item=>item*10);//[10, 20, 30]
arr = Array.from('hello');//["h", "e", "l", "l", "o"]
如果参数是一个数组,那么Array.from会返回一个一模一样的新数组。
arr = Array.from([1,2,3]);//[1, 2, 3]
4.entries(),keys(),values()
entries() 方法返回一个数组的迭代对象,该对象包含数组的键值对 (key/value)。可用于for of操作。
entries()是对键值对的遍历、keys()是对键名的遍历、values()是对键值的遍历。
arr = [1,2,3]
for(let key of arr.keys()){
console.log(key)// 0 1 2
}
for(let value of arr.values()){
console.log(key)// 1 2 3
}
for(let (key,value) of arr.entries()){
console.log(key, value)// [0,1] [1,2] [2,3]
}
还可以用手动调用next()的方式实现遍历
arr = [1,2,3]
a = arr.entries();
a.next().value;// [0, 1]
a.next().value;// [1, 2]
a.next().value;// [2, 3]
5.join()
将数组元素转换为一个字符串
语法:array.join(separator)
指定要使用的分隔符。默认使用逗号作为分隔符。 |
---|
arr = [1,2,3]
arr.join()//"1,2,3"
arr.join('')//"123"
6.数组的添加删除
- pop() 删除最后一个元素,影响原数组
arr = [1,2,3]
arr.pop()//返回删除的值,3
arr//[1,2]
- push() 在最后添加一个或者多个元素,影响原数组
arr = [1,2,3]
arr.push(4)//返回新的长度,4
arr//[1,2,3,4]
arr.push(5,6)
arr//[1,2,3,4,5,6]
arr.push([7])
arr//[1,2,3,4,5,6,[7]]
- shift() 删除第一个元素,影响原数组
arr = [1,2,3]
arr.shift()//返回删除的值,1
arr//[2,3]
- unshift() 在最前添加一个或者多个元素,影响原数组
arr = [2,3]
arr.unshift(1,2)//返回新的长度,4
arr//[1,2,2,3]
- slice(start, end) 截取数组的一部分,不影响原数组
start | 截取开始的位置,包括 ,为负数时 -1对应最后一个元素 |
---|---|
end | 截取结束的位置,不包括,默认到数组结束 |
arr = [1,2,3,4,5]
arr.slice(1,3)//[2,3]
arr//[1,2,3,4,5]
arr.slice(-2)//[4,5]
arr//[1,2,3,4,5]
- splice(start, num, item1,item2,…) 删除或者替换区域内元素,影响原数组
start | 开始的位置 |
---|---|
num | 删除的个数,默认到数组结束 |
item | 新增的元素 |
arr = [1,2,3,4,5]
arr.splice(1,2)//[2,3]
arr//[1,4,5]
arr = [1,2,3,4,5]
arr.splice(1,2,'item1', 'item2', 'item3')//[2,3]
arr//[1, "item1", "item2", "item3", 4, 5]
7.map()
对数组中每个元素进行处理,然后返回一个新的数组,不影响原数组。
需要注意的是,map不会对空数组进行检测
语法:array.map(function(currentValue,index,arr), thisValue)
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3]
arr.map(item=>item*10)//[10, 20, 30]
//上面的写法等价于
arr.map(function(item){
return item*10
})//[10, 20, 30]
arr//[1,2,3]
8.reduce(),reduceRight()
从数组开始操作到数组结束。返回一个值,不影响原数组
语法:array.reduce(function(total,currentValue,index,arr), initialValue)
total | 初始值或计算之后返回的值 |
---|---|
currentValue | 当前值 |
index | 当前索引 |
arr | 原数组 |
initialValue | 传递给函数初始值的值 |
reduce()是从左往右计算,reduceRight()是从右往左计算。
arr = [1,2,3]
arr.reduce((x,y)=>x+y)//6
reduce()会把结果继续和下一个元素做累积计算。上一次运算的x+y会放在x中进行下一次运算,直至结束。
reduce()不会对空数组进行操作
arr = []
a = arr.reduce((x,y)=>x+y)//error: Reduce of empty array with no initial value
9.filter()
对内容进行过滤。不影响原数组
语法:array.filter(function(currentValue,index,arr), thisValue)
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4,5];
//获取所有奇数,关于逻辑与或的知识请自行百度
arr.filter(item=>item&1)//[1,3,5]
arr = ['hello','world','good','nice','csdn'];
arr.filter(item=>item.length>4)//["hello", "world"]
10.every()
所有元素为真则为真。不影响原数组
语法:array.every(function(currentValue,index,arr), thisValue)
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4,5];
arr.every(item=>item>1)//false
arr.every(item=>item<6)//true
11.some()
有一个元素为真则为真,所有为假则为假。不影响原数组
语法:array.some(function(currentValue,index,arr), thisValue)
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4,5];
arr.some(item=>item>4)//true
arr.some(item=>item<1)//false
12.sort()
对数组进行排序处理。默认根据ASCII码进行排序。如果带参数,参数必须为函数。影响原数组
arr = [10, 1, 20, 2];
arr.sort();//[1, 10, 2, 20]
//sort()方法默认把所有元素先转换为String再排序,
//因为字符'1'比字符'2'的ASCII码小,所以'10'排在了'2'的前面
arr.sort((x, y )=>{return x>y?1:-1});//[1, 2, 10, 20]
arr = ['array','Array', 'sort', 'Sort'];
arr.sort()//["Array", "Sort", "array", "sort"]
//大写的英文字符的ASCLL码小于小写的英文字符的ASCLL码
arr.sort((x, y )=>{
x = x.toUpperCase();
y = y.toUpperCase();
return x>y?1:-1
});
//["Array", "array", "Sort", "sort"]
13.find(), findIndex(), indexOf(), lastIndexOf()
- find(function(currentValue, index, arr),thisValue)
返回查询的第一个元素(之后的元素将不会再调用函数)、不会对空数组进行操作、如果没有符合条件的返回undefined、不影响原数组
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4]
arr.find(item=>item===2)//2
arr.find(item=>item===5)//undefined
- findIndex(function(currentValue, index, arr),thisValue)
返回查询的第一个元素的索引(之后的元素将不会再调用函数)、不会对空数组进行操作、如果没有符合条件的返回-1、不影响原数组
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4]
arr.findIndex(item=>item===2)//1
arr.findIndex(item=>item===5)//-1
- indexOf(item, start)
返回 item 的第一次出现的位置,没有则返回-1。
item | 查找的元素 |
---|---|
start | 开始检索的位置,有效值0至length-1,默认从开始到结束 |
arr = [1,2,2,3,4]
arr.indexOf(2)//1,只返回第一次出现的下标
arr.indexOf(2, 3)//-1,从3下标开始检索,没有元素2,所以返回-1
- lastIndexOf(item, start)
返回 item 的最后一次出现的位置(即从后往前的第一个),没有则返回-1。与indexOf()的区别仅仅在于方向不同。
item | 查找的元素 |
---|---|
start | 开始检索的位置,有效值0至length-1,默认从最后一个元素开始 |
arr = [1,2,2,3,4]
arr.lastIndexOf(2)//2 ,只返回第一次出现的下标(从后往前的第一个)
arr.lastIndexOf(2, 1)//1,从1下标开始向前检索
arr.lastIndexOf(2, 0)//-1,从0下标开始向前检索
14.forEach()
语法:forEach(function(currentValue, index, arr),thisValue)
遍历数组、不会对空数组进行操作.
currentValue | 当前值 |
---|---|
index | 当前索引 |
arr | 原数组 |
thisValue | this的指向,默认为全局对象 |
arr = [1,2,3,4]
sum = 0
arr.forEach(item=>sum+=item)
sum//10