slice|splice|split

229 阅读5分钟

Array.prototype.slice()

slice() 原始数组不会被改变。

这一对象是一个由 begin 和 end 决定的原数组的浅拷贝(包括 begin,不包括end)。

返回值

返回一个新的数组对象

语法

arr.slice([begin[, end]])
  • begin 可选

    • 如果省略,则 slice 从索引 0 开始。

    • 提取起始处的索引(从 0 开始),从该索引开始提取原数组元素。

    • 如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2) 表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。

    • 如果 begin 超出原数组的索引范围,则会返回空数组。

  • end 可选

    • 如果 end 被省略,则 slice 会一直提取到原数组末尾。

    • 提取终止处的索引(从 0 开始),在该索引处结束提取原数组元素。slice 会提取原数组中索引从 begin 到 end 的所有元素(包含 begin,但不包含 end)。

    • slice(1,4) 会提取原数组中从第二个元素开始一直到第四个元素的所有元素 (索引为 1, 2, 3的元素)。

    • 如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1) 表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。

    • 如果 end 大于数组的长度,slice 也会一直提取到原数组末尾。

示例

var fruits = ['Banana', 'Orange', 'Lemon', 'Apple', 'Mango'];

var citrus = fruits.slice();// 浅拷贝整个数组

var citrus = fruits.slice(0);// 浅拷贝整个数组

var citrus = fruits.slice(1, 3);// ['Orange','Lemon']

应用:类数组(Array-like)对象

slice 方法可以用来将一个类数组(Array-like)对象/集合转换成一个新数组。

function list() {
  return Array.prototype.slice.call(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

除了使用 Array.prototype.slice.call(``arguments``),你也可以简单的使用 [].slice.call(arguments) 来代替。另外,也可以使用 bind 来简化该过程。

var unboundSlice = Array.prototype.slice;
var slice = Function.prototype.call.bind(unboundSlice);

function list() {
  return slice(arguments);
}

var list1 = list(1, 2, 3); // [1, 2, 3]

Array.prototype.splice()

splice() 会改变原数组。  

通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容

返回值

由被删除的元素组成的一个数组。

  • 如果只删除了一个元素,则返回只包含一个元素的数组。

  • 如果没有删除元素,则返回空数组。

语法

array.splice(start[, deleteCount[, item1[, item2[, ...]]]] )
  • start

    • 指定修改的开始位置(从0计数)。

    • 如果超出了数组的长度,则从数组末尾开始添加内容;

    • 如果是负值,则表示从数组末位开始的第几位(从-1计数,这意味着-n是倒数第n个元素并且等价于array.length-n);

    • 如果负数的绝对值大于数组的长度,则表示开始位置为第0位。

  • deleteCount 可选

    • 整数,表示要移除的数组元素的个数。

    • 如果被省略了,或者它的值大于等于array.length - start(也就是说,如果它大于或者等于start之后的所有元素的数量),那么start之后数组的所有元素都会被删除(含第 start 位)。

    • 如果 deleteCount 是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。

  • item1, item2, ...  可选

    • 要添加进数组的元素,从start 位置开始。如果不指定,则 splice() 将只删除数组元素。

示例

1. 从索引 2 的位置开始删除所有元素
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var removed = myFish.splice(2);

// 运算后的 myFish: ["angel", "clown"]
// 被删除的元素: ["mandarin", "sturgeon"]

2. 从索引 2 的位置开始删除 2 个元素
var removed = myFish.splice(2,2);
// 运算后的 myFish: ["angel", "clown"]

3. 从索引 0 的位置开始删除 1 个元素, 插入1个元素 'trumpet'
var removed = myFish.splice(0,1,'trumpet');
// 运算后的 myFish: ['trumpet', 'clown', 'mandarin', 'sturgeon']

4. 从索引 2 的位置开始删除 0 个元素, 插入1个元素 'trumpet'
var removed = myFish.splice(2,0,'trumpet');
// 运算后的 myFish: ['angel', 'clown', 'trumpet', 'mandarin', 'sturgeon']

String.prototype.split()

split() 方法使用指定的分隔符字符串将一个String对象分割成子字符串数组,以一个指定的分割字串来决定每个拆分的位置。

返回值

返回源字符串以分隔符出现位置分隔而成的一个 Array

语法

str.split([separator[, limit]]) 
  • separator

    • 指定表示每个拆分应发生的点的字符串。

    • separator 可以是一个字符串或正则表达式。

    • 如果纯文本分隔符包含多个字符,则必须找到整个字符串来表示分割点。

    • 如果在str中省略或不出现分隔符,则返回的数组包含一个由整个字符串组成的元素。

    • 如果分隔符为空字符串,则将str原字符串中每个字符的数组形式返回。

  • limit

    • 一个整数,限定返回的分割片段数量。

    • 当提供此参数时,split 方法会在指定分隔符的每次出现时分割该字符串,但在限制条目已放入数组时停止。

    • 如果在达到指定限制之前达到字符串的末尾,它可能仍然包含少于限制的条目。新数组中不返回剩下的文本。

示例

      var tempestString = 'my new world'
      //   1. 分隔符----空字符串
      console.log(tempestString.split('')) // ["m", "y", " ", "n", "e", "w", " ", "w", "o", "r", "l", "d"]

      //   2. 分隔符----空格字符串
      console.log(tempestString.split(' ')) // ["my", "new", "world"]

      //   3. 限制返回值中分割元素数量
      //   返回找到的前 2 个分割元素(splits)
      console.log(tempestString.split(' ', 2)) // ["my", "new"]

参考文章