JS中slice和splice的区别

slice()

1、String中

• 语法

      

  string.slice(start, end)

  抽取一个子字符串

• 描述

      

  slice()

  将返回一个含有字符串

  string

  的片段的字符串或返回它的一个子串。 但是该方法不修改

  string

• 参数

      

  start：

  要抽取的片段的起始下标。如果是负数，那么该参数声明了从字符串的尾部开始算起的位置。也就是说，-1指字符串中的最后一个字符，-2指倒数第二个字符，以此类推

      

  end：

  紧接着要抽取的片段的结尾的下标。如果没有指定这一参数，那么要抽取的子串包括start到原字符串结尾的字符串。如果该参数是负数，那么它声明了从字符串的尾部开始算起的位置

• 返回值

      一个新字符串，包括字符串

  string

  从

  start

  开始(包括

  start

  )到

  end

  为止(不包 括

  end

  )的所有字符

• Bug

      在

  JavaScript 3.0(InternetExplorer 4)

  中，参数

  start

  的值是不能是负数。负的

  start

  值指定的不是从字符串尾部开始算起的字符位置，而是指定第 个字符的位置

let str = 'abcdefg'

let newStr = str.slice(0, 4)    // newStr is 'abcd'; str is 'abcdefg'

let newStr = str.slice(2, 4)    // newStr is 'cd'; str is 'abcdefg'

let newStr = str.slice(4)      // newStr is 'efg'; str is 'abcdefg'

let newStr = str.slice(3, -1)   // newStr is 'def'; str is 'abcdefg'

let newStr = str.slice(3, -2)   // newStr is 'de'; str is 'abcdefg'

let newStr = str.slice(-3, -1)  // newStr is 'ef', IE 4 ———> newStr is 'abcdef'
           

2、Array中

• 语法

      

  array.slice(start, end)

  返回数组的一部分

• 描述

      

  slice()

  将返回数组的一部分，或者说是一个子数组。返回的数组包含从start 开始到end之间的所有元素，但是不包括end所指的元素。如果没有指定end，返回的数组包含从start开始到原数组结尾的所有元素

• 参数

      

  start：

  数组片段开始处的数组下标。如果是负数，它声明从数组尾部开始算起的位置。 也就是说，-1指最后一个元素，-2指倒数第二个元素，以此类推

      

  end：

  数组片段结束处的后一个元素的数组下标。如果没有指定这个参数 包含从

  start

  开始到数组结束的所有元素。如果这个参数是负数， 从数组尾部开始算起的元素

• 返回值

      一个新数组，包含从

  start

  到

  end

  (不包括该元素)指定的

  array

  元素

• Bug

      在

  Internet Explorer 4

  中，参数

  start

  不能为负数

let arr = [1, 2, 3, 4, 5]

let newArr = arr.slice(0, 3)    // newArr is [1, 2, 3]; arr is [1, 2, 3, 4, 5]

let newArr = arr.slice(3)      // newArr is [4, 5]; arr is [1, 2, 3, 4, 5]

let newArr = arr.slice(1, -1)   // newArr is [2, 3, 4]; arr is [1, 2, 3, 4, 5]

let newArr = arr.slice(-3, -2)  // newArr is [3]; arr is [1, 2, 3, 4, 5] , IE 4 ——> newArr is [1, 2, 3]
           

splice()

• 语法

      

  array.splice(start, deleteCount, value, ...)

  插入、删除或替换数组的元素

• 描述

      

  splice()

  将删除从

  start

  开始(包括

  start

  所指的元素在内)的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。位于插入或删除的元素之后的数组元素都会被移动，以保持它们与数组其他元素的连续性。

      注意：虽然

  spllce()

  方法与

  slice()

  方法名字相似，但作用不同，

  splice()

  会直接修改数组

• 参数

      

  start：

  开始插入和(或)删除的数组元素的下标

      

  deleteCount：

  从

  start

  开始，包括

  start

  所指的元素在内要删除的元素个数。这个参数是可选的，如果没有指定它，

  splice()

  将删除从

  start

  开始到原数组结尾的所有元素

      

  value, ...

  要插人数组的零个或多个值，从

  start

  所指的下标处开始插入

• 返回值

      如果从

  array

  中删除了元素，返回的是含有被删除的元素的数组。但是要注意，由于存在—个

  bug

  ，因此在

  JavaScriptl.2

  的

  Netscape

  实现中，返回的并不总是数组

• Bug

      

  splice()

  方法假定在各种情况下均返回一个包含已删除元素的数组。但是，在

  Netscape

  的

  JavaScript 1.2

  解释器中，如果删除的是单个元素，那么该方法返回的是元素，而不是包含那个元素的数组。如果没有删除任何元素，它不是返回一个空数组，而是什么都不返回。只要把语言版本明确地设置为

  1.2

  ，

  JavaScript

  的

  Netscape

  实现都有这种

  bug

  行为

let arr = [1, 2, 3, 4, 5, 6, 7, 8]

let newArr = arr.splice(4)        // newArr is [5, 6, 7, 8]; arr is [1, 2 ,3, 4]

let newArr = arr.splice(1, 2)      // newArr is [2, 3]; arr is [1, 4, 5, 6, 7, 8]

let newArr = arr.splice(1, 1) // 删除元素      
// Netscape/JavaScript 1.2 返回 2 ，应该 newArr is [2]; arr is [1, 3, 4, 5, 6, 7, 8]

let newArr = arr.splice(1, 0, 2, 3) // 插入元素  
// Netscape/JavaScript 1.2 newArr is undefined ，应该 newArr is []; arr is [1, 2, 3, 2, 3, 4, 5, 6, 7, 8]

let newArr = arr.splice(1, 5, 2, 3) // 删除并插入元素
// newArr is [2, 3, 4, 5, 6]; arr is [1, 2, 3, 7, 8]
           

slice和splice的区别

1. slice()

   方法会返回一个新的数组，不改变原数组；

   splice()

   方法返回包含已删除元素的数组，会改变原数组

2. slice(start, end)

   方法第一个参数表示截取的起始位置(包括

   start

   所指的元素在内)，第二个表示截取到的位置(不包括

   end

   该位置的元素)；

   splice(start, deleteCount)

   第一个参数也表示截取的起始位置，第二个参数表示要截取的元素个数