js 中数组的 slice 和 splice 方法的区别

感觉每次对数组的方法 slice() 和 splice() 使用总是容易混淆,今天特意做个简洁、明了的记录,供大家参考。

slice() 方法和 splice() 方法都是 js 对数组操作的方法。都可以对数组进行某一部分的截取

1. slice(start,end) 方法

slice() , 返回一个新的数组,此方法可从已有的数组中返回选定的元素。

array.slice(start,end),
start:是必须的,规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。
end: 是可选的,规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素

  • 返回值为一个新的数组
  • 原始的数组不会发生改变

该方法的示例如下:

{
  let arr1 = ["a", "b", "c", "d","e"];
  let arr2 = arr1.slice(2)   
  //  从数组下标为2的开始选取,
  //  一直到数组结束的所有元素
  console.log(arr1); 
       // ["a", "b", "c", "d","e"]    原始数组不会改变
  console.log(arr2); 
       // ["c", "d","e"]
}
{
   let arr3 = ["a", "b", "c", "d","e"];
   let arr4 = arr3.slice(2,4)   
   //  从数组下标为2的开始选取,
   //  一直到数组下标为4的结束
   console.log(arr3); 
        // ["a", "b", "c", "d","e"]    原始数组不会改变
   console.log(arr4); 
        // ["c", "d"]
}

2. splice(start,end) 方法

splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。

array.splice(index,howmany,item1,.....,itemX),
index:是必须的,整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
howmany: 是必须的,要删除的项目数量。如果设置为 0,则不会删除项目。
item1, ..., itemX: 是可选的,向数组添加的新项目。

  • 返回值如果有的话,为包含被删除项目的新数组
  • 该方法会改变原始数组

该方法的示例如下:

{
   //删除数组中从第2个下标开始的到最后的所有元素
   let arr1 = ["a", "b", "c", "d","e"];
   let arr2 = arr1.splice(2);
   console.log(arr1); 
        // ["a", "b"]    原始数组被该改变
   console.log(arr2); 
        // ["c", "d", "e"]  
}
{
   //往新数组中添加一个元素"YY"
   let arr3 = ["a", "b", "c", "d","e"];
   let arr4 = arr3.splice(2,0,"YY")  
   //  从数组下标为2的开始,
   //  删除0个元素,
   //  然后用"YY"来替换被删除的0个元素, 
   console.log(arr3); 
        // ["a", "b", "YY","c", "d","e"]    原始数组被该改变
   console.log(arr4); 
        // []  
}
{
   // 将删除3个元素,
   // 并添加2个新元素 ("PP","WW") 来替代被删除的元素
   let arr5 = ["a", "b", "c", "d","e"];
   let arr6 = arr5.splice(1,3,"PP","WW")   
   //  从数组下标为1的开始,
   //  删除3个元素("b"、"c"、"d"),
   //  然后用("PP"、"WW")替换被删除掉的3个元素
   console.log(arr5); 
          // ["a", "PP", "WW","e"]   原始数组被改变
   console.log(arr6); 
          //  ["b", "c", "d"]
}
{
   //删除第2个元素以后的3个数组元素(包含第2个元素)
   let arr7 = ["a", "b", "c", "d","e"];
   let arr8 = arr7.splice(1,3); 
   //  从数组下标为1的开始,
   //  删除3个元素("b"、"c"、"d")
   console.log(arr7); 
          //  ["a", "e"]   原始数组被改变
   console.log(arr8); 
          //  ["b", "c", "d"]
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。