js 数组操作

数组操作是项目中处理返回数据中常用到的。

ES5中：

shift():删除第一项=>返回删除项

push():在最后面添加一项=>返回数组长度

splice(a,b):从a位置起，删除b项=>返回删除项

slice(a,b):从已有数组中截取(a,b)位置的元素=>返回截取项

join():将数组转成字符串,默认用','隔开=>返回字符串

pop():删除最后一项=>返回删除项

unshift():在最前面添加一项=>返回数组长度

concat():两个数组的拼接=>返回整个数组

扩展应用：

1.concat()用于数组的复制

正常情况下 如果令arr1=arr2

这样复制了底层数据结构的指针，修改arr1会直接导致arr2的变化

如果令arr1=arr2.concat() 则可以复制成功并且不影响原数组

var arr=[1,2,3];

var arr2=arr;
arr2[0]=2;
console.log(arr2);    //[2,2,3]
console.log(arr);    //[2,2,3]
 
var arr3=arr.concat();
arr3[0]=2;
console.log(arr3) ;   //[2,2,3]
console.log(arr) ;    //[1,2,3]

2.slice()用于将类数组转成数组

令arr=[].slice.call(arrLike)

function fn(){
return [].slice.call(arguments);
}

fn(1,2,3);   //[1,2,3]

 

ES6中：

1.静态方法

Array.from(arrlike,mapFn)：将类数组和可遍历的对象转成真正的数组

类数组：DOM操作返回的NodeList /arguments对象

可遍历的对象：string字符串/Map/Set

第一个参数必填，第二个参数是处理函数，可选，填了后会在生成的数组基础上再执行一次map方法后返回

Array.from('hello');   //['h','e','l','l','o']

let map=new Map();
map.set('a',11);
map.set(['b'],22);
Array.from(map)   //[['a',11],[['b'],22]]

let set=new Set([1,2]);
set.add(3);
Array.from(set)    //[1,2,3]

let arr=[1,2,3];
Array.from(arr,x=>x+x);   //[2,4,6]

Array.of()：将一组值转成数组

Array.of(1,2,3)      //[1,2,3]
Array.of([1,2,3])  //[[1,2,3]]
Array.of('str')       //['str']

 

2.实例方法：

copyWithin(target,start,end)：在数组内部将指定位置的成员复制到别的位置

target为必填项，表示从此位置开始替换数据

start为可选项，默认为0，表示从此位置开始读取数据（去替换）

end为可选项，默认为数组的长度，表示到该位置前停止读数据

var arr=[1,2,3,4,5,6]

arr.copyWithin(3);        //[1,2,3,1,2,3]
arr.copyWithin(2,3);      //[1,2,4,5,6,6]
arr.copyWithin(2,0,3);   //[1,2,1,2,3,6]

find(callbackFn(ele,index,arr), thisArg) ：返回数组中满足提供的测试函数的第一个元素的值

thisArg表示每次 callback 函数执行时的上下文对象，可选项

function callbackfn(ele){
    return ele>15;
}
var arr=[1,4,10,28,100];
arr.find(callbackfn);   //28

entries()/keys()/values()：用于遍历数组

均返回一个遍历器对象，需要用for...of遍历

分别是对键值对/键名/键值的遍历

let arr=['a','b','c'];
let entries=arr.entries();
let keys=arr.keys();
let values=arr.values();

for(let i of entries){console.log(i)};    //[0,'a'] [1,'b']  [2,'c']
for(let i of keys){console.log(i)};       // 0   1   2
for(let i of values){console.log(i)};    //a  b   c

includes(searchElement,fromIndex)：判断数组中是否包含一个指定的值=>返回true or false

formIndex：可选项，表示从此位置开始查找，默认为0,如果为负数，则从数组长度+fromIndex的位置开始查找

let arr=[1,2,3,4,5];
arr.includes(2);   //true
arr.includes(2,2);  ///false
arr.includes(2,-4); //true