JS中splice、slice用法及区别

splice

向数组中添加或删除元素，然后返回含有被删除元素的数组
注意：这种方法会改变原始数组

语法
array.splice(index,howmany,item1,…,itemX)

参数
index：必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。
howmany：要删除的元素数量。如果设置为 0，则不会删除项目。
如果未设置此参数，则删除从 index 开始到原数组结尾的所有元素。
item1, …, itemX 可选。向数组添加的新元素。

返回值
如果从 array 中删除了元素，则返回的是含有被删除元素的数组

不传参数–原始数组不被修改–这样用没什么意义

  /**
   * 返回一个空数组，并未修改原始数组
   */
   let arr = [1, 3, 5, 7, 9];
   let newArr = arr.splice();
   console.log(arr); //[1, 3, 5, 7, 9]
   console.log(newArr); //[]

传入一个参数–原始数组被修改

  /**
   * 参数1：从哪个角标开始删除之后的所有元素，并返回包含删除元素的数组
   */
   let arr = [1, 3, 5, 7, 9];
   let newArr = arr.splice(2);
   console.log(arr); //[1, 3]
   console.log(newArr); //[5, 7, 9]

传入两个参数–原始数组被修改

  /**
   * 第二个参数传入0就是不删除元素
   * 参数1：从哪个角标开始删除元素
   * 参数2：删除几个元素（传0就是不删除元素）
   * 返回包含删除元素的数组
   */
   let arr = [1, 3, 5, 7, 9];
   let newArr = arr.splice(2, 0);
   console.log(arr); //[1, 3, 5, 7, 9]
   console.log(newArr); //[]

  /**
   * 第二个参数传2就是删除两个元素
   */
   let arr = [1, 3, 5, 7, 9];
   let newArr = arr.splice(2, 2);
   console.log(arr); //[1, 3, 9]
   console.log(newArr); //[5, 7]

只插入元素

/**
 * 只插入元素- 从角标2开始先删除0个元素，并从角标2开始向数组中添加新元素
 * 传入三个参数--原始数组被修改
 * 参数1：从哪个角标开始删除元素
 * 参数2：删除几个元素（传0就是不删除元素）
 * 参数3、4、.....：从参数1的角标开始向数组中添加新元素
 * 返回包含删除元素的数组
 */
 let arr = [1, 3, 5, 7, 9];
 let newArr = arr.splice(2, 0, 10, 20);
 console.log(arr); // [1, 3, 10, 20, 5, 7, 9]
 console.log(newArr); //[]

说明：代表插入元素，从角标2开始先删除0个元素，并用10,20替换那些被删除的元素，即从角标为2元素开始插入10,20两个元素

删除并插入元素

/**
 * 删除并插入元素
 * 传入三个参数--原始数组被修改
 * 参数1：从哪个角标开始删除元素
 * 参数2：删除几个元素（传0就是不删除元素）
 * 参数3、4、.....：从参数1的角标开始向数组中添加新元素
 * 返回包含删除元素的数组
 */
 let arr = [1, 3, 5, 7, 9];
 let newArr = arr.splice(1, 2, 10, 20, 30);
 console.log(arr); // [1, 10, 20, 30, 7，9]
 console.log(newArr); //[3, 5,]

slice

从原数组中返回选定元素的数组
注意：这种方法不会改变原始数组

语法
array.slice(start,end)

参数
start： 必需。整数，规定从何处开始选取，使用负数可从数组结尾处规定位置
end： 可选。规定从何处结束选取。如果未指定参数，则从start开始一直截取到数组结尾

返回值
返回一个新的数组，包含从start到end（不包含该元素）的array中的元素

  /**
   * 获取新数组，内容从arr的角标3开始一直到结尾的所有元素，
   */
  let arr = [1, 3, 5, 7, 9];
  let newArr = arr.slice(3);
  console.log(arr); // [1, 3, 5, 7, 9]
  console.log(newArr); //[7, 9]

  /**
   * 获取新数组，内容从arr的角标3开始角标4结束（不包含角标4元素）
   */
  let arr = [1, 3, 5, 7, 9];
  let newArr = arr.slice(3, 4);
  console.log(arr); // [1, 3, 5, 7, 9]
  console.log(newArr); //[7]

splice、slice区别

1：splice会修改原数组，slice不会
2：splice可以删除、修改、替换原数组，slice只能截取数组中的值并生成新数组
3：splice可传递多个参数，slice最多只能传递两个参数