js中slicesplice用法与区别

Posted 2020-09-23 pixelK

1.slice(start,end)（参数可选）

slice() 方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象。原始数组不会被修改。

var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘]

var b = a.slice(0, 1)

console.log(a); //[‘a‘, ‘b‘, ‘c‘, ‘d‘]

console.log(b); //[‘a‘]

不传参数，默认从0开始，可以复制数组：

var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘];var c = a.slice();//复制原数组(浅复制)。
console.log(a); //[‘a‘, ‘b‘, ‘c‘, ‘d‘];
console.log(c);//[‘a‘, ‘b‘, ‘c‘, ‘d‘];

参数可以是负数，begin为负数表示从原数组倒数第几位开始复制，如果不传end，复制到数组末尾。如果end大于数组长度，依然复制到数组结尾。

var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘];var d = a.slice(-2);
console.log(a); //[‘a‘, ‘b‘, ‘c‘, ‘d‘];
console.log(d); //[‘c‘, ‘d‘];

end为负数，表示在倒数第几位结束复制，不包括end。

var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘];
 var e = a.slice(1, -1);
 console.log(e); //[ ‘b‘, ‘c‘]

slice() 方法还可以将类数组转换成数组

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

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

或者

function list() {
  return [].slice.call(arguments) 

} 

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

2.splice(start, deleteCount, item1, item2, ...) 方法通过删除现有元素和/或添加新元素来更改一个数组的内容。而slice()不会修改原数组

start：（必选）

指定修改的开始位置（从0计数）。如果超出了数组的长度，则从数组末尾开始添加内容；如果是负值，则表示从数组倒数第几位（从1计数）。

deleteCount：（可选）

整数，表示要移除的数组元素的个数。如果 deleteCount 是 0，则不移除元素。这种情况下，至少应添加一个新元素。如果 deleteCount 大于start 之后的元素的总数，则从 start 后面的元素都将被删除（含第 start 位）。
如果deleteCount被省略，则其相当于(arr.length - start)。

item1, item2, ... （可选）要添加进数组的元素,从start 位置开始。如果不指定，则 splice() 将只删除数组元素。

var a = [‘a‘, ‘b‘, ‘c‘, ‘d‘]
var b = a.splice(0) //deleteCount被省略，相当于(a.length - start)。

console.log(a); //[];
console.log(b); //[‘a‘, ‘b‘, ‘c‘, ‘d‘];

var c = [‘a‘, ‘b‘, ‘c‘, ‘d‘];
var d = c.splice(-1,1);

console.log(c); //[‘a‘, ‘b‘, ‘c‘];
console.log(d); //[‘d‘];

  var e = [‘a‘, ‘b‘, ‘c‘, ‘d‘];

  var f = e.splice(1, 5);//deleteCount 大于start 之后的元素的总数

  console.log(e); //[‘a‘];

  console.log(f); //[‘b‘, ‘c‘, ‘d‘];

 

  var h = [‘a‘, ‘b‘, ‘c‘, ‘d‘]

  var l = h.splice(1, 2, ‘x‘)//‘x‘替换删除掉的字符

  console.log(h); //[‘a‘, ‘x‘, ‘d‘]

  console.log(l); //[‘b‘, ‘c‘]