首页>>前端>>JavaScript->JavaScript 数组方法 slice() 的 5 个示例

JavaScript 数组方法 slice() 的 5 个示例

时间:2023-11-30 本站 点击:0

slice() 方法将数组部分的副本返回到新的数组对象中。这个对象是从 startend 选择的。需要注意的是,此方法不会修改原始数组。此外,如果向其中一个数组添加新元素,则另一个数组不会受到影响。

语法

slice() 方法的参数是数组的开始和结束索引。

start

start 是一个从 0 开始的索引,用于开始复制数组的一部分。如果未定义,start 的默认值为 0。如果 start 大于数组的索引范围, slice() 方法将返回一个空数组。

此外,start 还可以使用负索引。 slice(-1) 提取数组的最后一个元素。

end

end 参数是可选的。如果 slice() 函数中只有一个参数,那就是 start。如果省略, slice() 方法从数组的末尾开始提取。

如果end 大于数组的长度,slice() 一直提取到数组的末尾,只是在它被省略的情况下。

end 是提取此索引之前的元素,不包括索引 end 在内。因此,索引的最后一个元素不包含在数组的副本中。例如,slice(1,3) 提取是数组的第二个和第三个元素,即从数组的索引 1 开始,包含索引 1 的值到索引 3 之间的数组,但不包含索引为 3 的元素。

constarrNumbers=[1,3,5,6,7];console.log(arrNumbers.slice(0,3));//[1,3,5]

这意味着复制数组 arrNumbers 从索引 0 开始到索引 3 之间的元素,不包含索引为 3 的元素 。

1. 复制数组

第一个示例是 slice() 函数的基本功能,没有参数的数组复制原始数组。有时,可能想要更新数组中的某些元素。但是,可能需要保护原始数组中的元素,可以使用 slice() 创建原始数组的浅复制。

constarrNumbers=[1,2,3,4,5,6];constcopyNumbers=arrNumbers.slice();console.log(copyNumbers);//[1,2,3,4,5,6]copyNumbers[1]=0;console.log(copyNumbers);//[1,0,3,4,5,6]console.log(arrNumbers);//[1,2,3,4,5,6]

2. 从索引 n 开始的子数组

slice() 方法的第二个示例是复制从数组索引 n 开始的子数组。

constarrNumbers=[1,2,3,4,5,6];constcopyNumbers=arrNumbers.slice(2);console.log(copyNumbers);//[3,4,5,6]

也可以复制数组最后 n 位元素,就是使用 -n 作为参数,如下:

constarrNumbers=[1,2,3,4,5,6];constcopyNumbers=arrNumbers.slice(-2);console.log(copyNumbers);//[5,6]

3. 类数组对象转换为数组

可以使用 slice() 方法将看起来像数组的对象转换为数组。例如,如下代码片段:

functiontransformToArray(){returnArray.prototype.slice.call(arguments);}constnewArray=transformToArray("1","2","3","4");console.log(newArray);//['1','2','3','4']

以上代码片段可以用来定义可变参数的函数。

4. 将 NodeList 转换为数组

NodeList 对象是从文档中提取的节点集合,可以使用方法 querySelectorAll() 方法返回节点列表对象。例如,可以选择HTML文档中的所有<p>节点,可以使用 slice() 将选定的节点列表转换为数组。

constelemP=document.querySelectorAll("p");constelemNodes=Array.prototype.slice.call(elemP);console.log(elemNodes);

5. 替换字符串中的特定索引

可以使用 slice() 函数创建替换函数。

String.prototype.append=function(index,value){return`${this.slice(0,index)}${value}${this.slice(index)}`;};consttestString="新年";console.log(testString.append(2,"快乐"));//新年快乐

总结

学习 JavaScript 内置函数的使用方法和示例可以提高编码技能,扩展编码思维,增加更多解决问题的方法。slice() 是数组中非常有用的内置函数。


本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:/JavaScript/3947.html