数组的操作 - 掘金

数组，就是一个容器，存放我们的数据。

1. length属性

获取数组的长度，可以用于数组for循环遍历。

   let arr = [1,2,3,4,5];
   for(let i = 0; i<arr.length;i++){
       console.log(arr[i]);
   }

也可以用于获取数组的部分内容。
slice()方法，中文是：切片的意思，顾名思义，用来切取数组的部分数组内容，但是不改变原数组。从开始位置，到结尾位置，从0开始计数，不包含尾部，所以简称:顾头不顾尾。

   let arr = [1,2,3,4,5];
   //获取索引位置 2到5 也就是 [2,5)这个区间内的数据
   let newArr = arr.slice(2,arr.length);
   console.log(newArr);
   //验证一下是否不改变原数组
   console.log(arr);

2.数组操纵

2.1 forEach遍历

它接收一个函数，这个函数有3个参数， item当前元素 key当前索引 array当前数组 ps:参数名可以自定义。既然是一个函数，那么我们也可以使用箭头函数的形式。
①匿名函数

   let arr = [1,2,3,4,5];
   arr.forEach(function(item,key,array){
       console.log("当前元素:"+item,"当前索引值:"+key,"当前数组"+array);
   })

②箭头函数

   let arr = [1,2,3,4,5];
   arr.forEach((item,key,array)=>{
       console.log("当前元素:"+item,"当前索引值:"+key,"当前数组"+array);
   })

这里有一个细节：对于当前数组的打印，打印出来是一个字符串 1,2,3,4,5 这是为什么？？？
由于前面带有字符串"当前数组" 这里涉及到 +运算符
由于 +运算符，会把array的内容转成字符串，那么等价于 array.toString() 然后进行字符串的拼接操作

2.2 filter过滤

它接收一个函数，这个函数有3个参数，也是item key array。返回一个新数组。
虽然它用于过滤，但是也可以用于数组的遍历。不过一般用于数组的过滤操作
它这个 return 是返回一个boolean值

   let arr = [1,2,3,4,5];
   let newArr = arr.filter((item,key,array)=>{
       //true代表要，过滤出索引>-1的元素
       return key>-1;
   })
   console.log(newArr);

去重操作

indexOf(item,index) 方法先要知道，它是从 index索引位置开始，找元素item，找到了返回它的位置。
那么结合下面例子return这里，array数组就是arr数组，找item，也就是每次arr的数组内容。
大致流程：
①item=1,key=0,array=[1,2,3,4,5,2,1,3]，然后array.indexOf(1,0)从索引0的位置开始找内容1，找到了返回它的位置0，0===0为true，过滤出这个item元素1
②item=2,key=1,array=[1,2,3,4,5,2,1,3]，然后array.indexOf(2,0)从索引0的位置开始找内容2，找到了返回它的位置1，1===1为true，过滤出这个item元素2
...
⑥item=2,key=5,array=[1,2,3,4,5,2,1,3]，然后array.indexOf(2,0)从索引0的位置开始找内容2，找到了返回它的位置1，1===5为false，不要这个位置上的元素
...

   let arr = [1,2,3,4,5,2,1,3];
   let newArr = arr.filter((item,key,array)=>{
       return array.indexOf(item,0)===key;
   })
   console.log(newArr);

2.3 map遍历

它接收一个函数，这个函数有3个参数，也是item key array。返回一个新数组。
它这里的return 是返回一个逻辑操作，比如 item*2 每个数据扩大两倍

   let arr = [1,2,3,4,5]; 
   let newArr = arr.map((item,key,array)=>{ 
        //什么都不操作，直接返回
        return item;
   }) 
   console.log(newArr);

比如：字符串数组转成数字数组

   let arr = ['1','2','3','4','5']; 
   let newArr = arr.map((item,key,array)=>{ 
        return Number(item);
   }) 
   console.log(newArr);

可以简写:

   let arr = ['1','2','3','4','5']; 
   let newArr = arr.map(Number); 
   console.log(newArr);

注意点：虽然我们可以简写，但是得注意，实际上三个参数item,key,array依旧是传给了Number()方法的，只是它只有了一个参数，也就是item参数换个parseInt()方法来简写

   let arr = ['1','2','3','4','5']; 
   let newArr = arr.map(parseInt); 
   console.log(newArr);

为什么结果是这样？？？实际它就是返回了 parseInt('1',0) parseInt('2',1) ... 这个涉及parseInt()方法，以及进制转换问题!

3.常用方法

3.1 push & pop

从 尾部追加/删除 元素

   let arr = [1,2,3,4,5];
   arr.push(9);
   console.log(arr);
   arr.pop();
   console.log(arr);

3.2 unshit & shit

从 头部追加/删除 元素

   let arr = [1,2,3,4,5];
   arr.unshit(9);
   console.log(arr);
   arr.shit();
   console.log(arr);

3.3 splice(index,count,【item1,...】)

这个方法具有 添加/修改/删除 的功能。从 index索引位置开始，删除count个元素，(可以)追加内容item1,...代表不定参数

   let arr = [1,2,3,4,5];
   //从索引5位置开始，不删除元素，添加数字6
   arr.splice(5,0,6);
   console.log(arr);
   //从索引5位置开始，删除1个元素，添加数字9
   arr.splice(5,1,9);
   console.log(arr);
   //从索引5位置开始，删除1个元素
   arr.splice(5,1);
   console.log(arr);

3.4 join()

将数组转成字符串，传入一个字符串做分隔符

   let arr = [1,2,3,4,5];
   let str = arr.join("&");
   console.log(str);