常见的数组操作
push / pop / unshift / shift
1. push
例:var arr=[1,2,3,4];
var a=arr.push(9,8,7);
输出:console.log(a,arr);1,2,3,4,9,8,7;
push属性:可以将一个或者更多的参数添加在数组的尾部;返回添加后的数组的长度,原数组发生改变。
2. unshift
例:var arr=[1,2,3,4];
var a=arr.unshift(9,8,7);
输出:console.log(a,arr);9,8,7,1,2,3,4;
unshift属性:可以将一个或者更多的参数添加在数组的头部;返回添加后的数组的长度,原数组发生改变。
3. pop
例:var arr=[1,2,3,4];
var a=arr.pop();
输出:console.log(a,arr)4;1,2,3,
pop属性:从数组尾部删除一个元素,返回这个被删除的元素,原数组发生改变
4. shift
例:var arr=[1,2,3,4];
var a=arr.pop();
输出:console.log(a,arr)1; 2,3,4,
shift属性:从数组头部删除一个元素,返回这个被删除的元素,原数组发生改变。
slice && splice
1. slice用法:
- 如果不传参数,会返回原数组,如果一个参数,从该参数表示的索引开始截取,直至数组结束,返回这个截取数组,原数组不变
- 两个参数,从第一个参数对应的索引开始截取,到第二个参数对应的索引结束,但包括第二个参数对应的索引上值,原数组不改变 &最多接受两个参数
2.splice
- 没有参数,返回空数组,原数组不变
- 一个参数,从该参数表示的索引位开始截取,直至数组结束,返回截取的 数组,原数组改变
- 两个参数,第一个参数表示开始截取的索引位,第二个参数表示截取的长度,返回截取的 数组,原数组改变
- 三个或者更多参数,第三个及以后的参数表示要从截取位插入的值
reverse && sort
1.reverse
- reverse()属性不接受参数,数组顺序翻转。
2. sort
- 按顺序排列
Array.sort(function(a,b){
return a - b; //从小到大
return b-a; //从大到小
}
join&& concat
1.join
- 接受一个参数,将数组以参数拼接为字符串;
var arr = [1,2,3,4];
arr.join('-') //'1-2-3-4'
2. concat
- 接受一个或多个参数,将参数中的值放到操作的数组后边,返回拼接的数组,原数组不变。
- 如果参数是一个数组,则先把值提取出来再操作。
var arr = [1,2,3,4];
arr.concat([5,6,7])//[1,2,3,4,5,6,7]
ES5新增的数组方法
1. indexOf
- 接受一个参数,返回这个参数在数组里面的索引值,如果参数不在操作的数组中,则返回 -1.
var arr = [1,2,3,4];
arr.indexOf(1) // 0
arr.indexOf(5) // -1
2. forEach
- 遍历一个数组,没有返回值或返回值为
undefined
var arr = [1,2,3,4,5];
arr.forEach((item,index,arr)=>{
//item 为当前数组元素
// index 为当前索引
// arr 为数组名字
})
3. map
- 用来接收一个返回值。不改变原数组
var arr = [1,2,3,4,5,6];
arr.map(function(item,index,arr){
return item * 2
})
// [2,4,6,8,10,12]
4.filter
- 过滤出一些符合条件的元素,返回一个新数组。
arr.filter(item=>{
return item>2
})
5.some
- 返回一个布尔值,如果数组中有任意一个元素满足给定的条件,结果就为
true
6.every
- 返回一个布尔值,数组中所有的元素都满足给定的条件,结果就为
true
7.reduce
- 对数组中的所有元素调用指定的回调函数,该回调函数的返回值为累计结果。并且把返回值在下一次回调函数时作为参数提供
ES6新增的数组方法
1. Array.from
- 这个东西就是把一些集合,或者长的像数组的伪数组转换成真的数组,比如arguments,js选择器找到dom集合和对象模拟的数组
var obj = {
'0' : 1,
length : 1
}
Array.from(obj / arguments / 伪数组) //返回的是一个数组
[].slice.call(arguments, 0) //这种方式根from方法是一样的效果
//Array.from还有第二个参数,是一个回掉函数,功能类似map
Array.from( [1, 2, 3], item => item * 2 )
2. Array.of
- 把参数合并成一个数组返回,如果参数为空,则返回一个空数组
Array.of(1, 2, 3, 4)
3. copyWithin
- 接受三个参数,
- 参数一: 被替换的起始位置;
- 参数二: 选取替换值的起始位置;
- 参数三: 选取替换值得结束位置
let arr = [1, 'c', 'd', 'a', 'b']; //假如我想把a,b替换到1的位置
arr.copyWithin(0, 3, 5) // ["a", "b", "d", "a", "b"]
4. find / findIndex
- 返回数组中第一个符合条件的元素, findIndex返回索引
[1, 2, 3, 4, 5].find(function(item){
return item > 3
})
5. fill
- 替换
//功能一: 字面意思填满,实际功能就是把数组中的每一个元素替换成指定值
let arr = [1, 2, 3, 4]
arr.fill(5) //arr全变成了5
//功能二:指定范围替换,这功能似曾相识啊
arr.fill(6, 1, 3) //使用6 替换数组中 下表为1-3范围的值, 范围是下标>=1 && <3 的位置。
//猛的一看以为功能和splice一样呢,又去巩固了一下。splice是删除某一个元素,然后增加指定的个数,并且它第一个参数是下标起点,第二个参数是个数,而不是结束下标。
6.entries / keys / values
- 取值
let arr=['a', 'b', 'c']
for(let key of arr.keys()){} //取键
for(let value of arr.values()){} //取值;不能直接使用,有兼容性问题,甚至谷歌
for(let [key, value] of arr.entries()){} //都取
7.inludes
- 检测数组中是否包含一个值
var a = function(){}
[1, 2, 3, 4, a].includes(a) //true
[1, 2, 3, 4, NaN].includes(NaN) //true