js随记3 -- slice，splite，splice的区分 contact：数组拍平

前言：看到了JavaScript高级程序设计的数组部分，系统接收了数组的方法，发现有一些东西可以拎出来总结总结。

slice方法：字符串，数组所有

使用方法几乎相同

• 作用：从字符串中提取子字符串
• 用法：接收一个/俩个参数（开始位置，结束位置）
• 结束位置不取
• 负值＝字符串长度+负值
• 结束位置小于开始位置，返回空字符串/数组

splite方法：字符串所有

• 作用：将字符串根据传入参数进行切割为数组
• 用法：接收一个/俩个参数（切割参数，数组大小）

   let str ＝ “a,b,c,c,y”  
   console.log(str.splite(","));//['a','b','c','c','y']

splice方法：数组所有

• 作用：对数组进行操作（删除，插入，替换）
• 用法：传入一个/俩个/三个/n个参数（删除/操作开始的位置，删除的个数（不删除操作为0），插入元素…（第三个以后的参数都是插入的元素））
  
• 会改变原值（仔细看看图片例子就知道了）
• 方法返回删除的数据

篇幅有点少，再加数组和字符串都有的方法：

contact()：字符串，数组所有

使用方法大体相同，数组多了个东西

• 作用: 拼接数组/字符串
• 用法：传入一个/多个参数，均为拼接的内容
• 不改变原值
• 打平数组参数行为:

1. 将连接参数中为数组的值进行拆分为一个个字符串，再逐一拼接到数组中，又叫数组拍平（这个名字比较可爱哈哈）；
2. contact方法是默认拍平的：

   let arr = [1,3,4];	
   let arr1 = arr.contact("33",["222","6666"]);
   console.log(arr1); // [1,3,4,"33","222","6666"];	
   

3. 不想被拍平？可以利用Symbol.isConcatSpreadable 符号：（给 要拼接的数组 / 参数加）

   let arr = [1,3,4];	
   
   //方法1：
   let arr1 = "33",["222","6666"];
   arr1[Symbol.isConcatSpreadable] = false;
   let arr2 = arr.contact(arr1);
   
   //方法2：
   arr1 = {
   	[Symbol.isConcatSpreadable]: false,
   	length: 2,
   	0: '33',
   	1: ["222","6666"]
   }
   
   
   console.log(arr1); // [1,3,4,["33",["222","6666"]]];	
   

5. 有其他的拍平需求？试试用用 flat(): 这个链接讲得挺好的

应用

1.splice

• 在vue-element-admin第三篇看到了一个运用！
  

• 浅分析一波：

1. 做的是一个拖拽排序列表数据控制的操作；
2. 首先，根据获得的元素的初始位置， 利用splice可以成功地在newList中剔除掉 操作对象 的数据 ， splice是可以修改本数据并返回删除的数据
3. 与此同时，返回了包含 删除的数据 的数组，所以要[0]，获得受拖拽的数据
4. 最后，根据获得的最后元素放置位置，利用splice把数据放上去
5. 学到了学到了！

后记：

• 打平数组参数还是第一次看到，看了之后发现以前也没想过这个东西，果然还是思维太固定了。
• 总觉得太多了，学了用的时候又没想起来。。研究大佬写的代码真的可以看到这些运用!
• 应该还有，干饭先！下次看到再搞！！！