JS截取数组操作简单示例

 更新时间:2023年08月29日 10:38:16   作者:zlting~  
这篇文章主要给大家介绍了关于JS截取数组操作的相关资料,对数组的操作相信大家都不陌生,文中通过代码示例介绍的非常详细,需要的朋友可以参考下

一、slice()

用法:array.slice([start], (end)), slice用于从指定值截取并返回新数组,但原数组结构不变

参数描述
start可选。规定从何处开始截取元素。slice(-2)代表倒数第二个元素到最后元素
end可选。规定从何处结束截取元素,不包含当前index,slice(-2,-1)指的是倒数第二个元素不包含最后一个元素

起始值可以为负数,-1为最后一个,end选填,但取不到end坐标的值,实际返回的数组长度等于end-start

二、splice()

用法:array.splice(index, howmany, item1,.....,itemX),可以删除数组中的项,也可以向数组中添加新的项

参数描述
index必需。规定从何处添加/删除元素。
howmany可选。规定应该删除多少元素。如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
itemX可选。要添加到数组的新元素

示例:

 如果从 array 中删除了元素,则返回的是被删除的元素的数组,并且改变了原数组。

var arr = ["苹果","西瓜","草莓"];
var delArr = arr.splice(1, 2); // 从index=1,开始删除2个元素;
console.log(arr); // ["苹果"];
console.log(delArr ); // ["西瓜","草莓"];
var arr = ["苹果","西瓜","草莓"];
arr.splice(1, 2, "荔枝", "龙眼"); // 从index=1处,开始删除2个元素,并插入[荔枝]和[龙眼];
console.log(arr); // ["苹果", "荔枝", "龙眼"];
var arr = ["苹果","西瓜","草莓"];
arr.splice(1, 0, "荔枝", "龙眼"); // 从index=1处,插入[荔枝]和[龙眼];
console.log(arr); // ["苹果", "荔枝", "龙眼","西瓜","草莓"];

附:提取数组中介于两个指定下标之间的字符

slice(start, end): 从下标为start的成员开始提取,直到下标为end的时候停止截取。第二个参数是可选的项,如果不填写第二个参数的话,就会一直截到数组的末尾。如果start和end参数一致的话就不执行截取操作,获取的是一个空数组
(PS:如果截取成员过多导致越界的话不会报错,会直接截取到最后一个元素,如果第一个参数比第二个参数大的话就不会截取数组,返回一个空数组)

let str = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h']
let a = str.slice(2, 5) // ['c', 'd', 'e', 'f']
let str = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h']
let b = str.slice(2) // ['c', 'd', 'e', 'f', 'g', 'h']
let str = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
let a = str.slice(2, 2) // []
let str = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'];
let a = str.slice(2, -2) // 参数为负数的时候会自动把 -2 转化为 str.length - 2

总结 

到此这篇关于JS截取数组操作的文章就介绍到这了,更多相关JS截取数组内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Javascript如何判断数据类型和数组类型

    Javascript如何判断数据类型和数组类型

    这篇文章主要介绍Javascript如何判断数据类型和数组类型,通俗易懂,需要的朋友可以参考下。
    2016-06-06
  • JS之小练习代码

    JS之小练习代码

    初学者不建议看,这些都是用类实现的代码,高手推荐学习
    2008-10-10
  • Javascript操作cookie的函数代码

    Javascript操作cookie的函数代码

    之前发布了javascript操作cookie一个大全里面有很多知识,大家可以在本站搜索,另外今天遇到js操作cookie又增加2款方法一个是简单版本、一个是封装版本,特意分享给大家
    2012-10-10
  • 基于JS+Canves实现点击按钮水波纹效果

    基于JS+Canves实现点击按钮水波纹效果

    本文给大家分享基于js和canves实现点击按钮水波纹效果,效果非常逼真,对此感兴趣的朋友一起看看吧
    2016-09-09
  • nestjs返回给前端数据格式的封装实现

    nestjs返回给前端数据格式的封装实现

    这篇文章主要介绍了nestjs返回给前端数据格式的封装实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-02-02
  • JS实现页面打印功能

    JS实现页面打印功能

    本文主要介绍了JS实现页面打印功能的方法,具有很好的参考价值。下面跟着小编一起来看下吧
    2017-03-03
  • IE 缓存策略的BUG的解决方法

    IE 缓存策略的BUG的解决方法

    IE 缓存策略的BUG的解决方法...
    2007-07-07
  • javascript实现查找数组中最大值方法汇总

    javascript实现查找数组中最大值方法汇总

    本文给大家汇总了一下使用javascript实现查找数组中最大最小值的一些方法,非常的简单实用,有需要的小伙伴可以来参考下。
    2016-02-02
  • JS常见问题整理(持续更新)

    JS常见问题整理(持续更新)

    JS常见问题在开发过程中会经常遇到过,本文整理了一些实际开发中存在的问题,晒出来与大家一起分享,感兴趣的朋友可以参考下,希望对大家有所帮助
    2013-08-08
  • JS随即打乱数组实现代码

    JS随即打乱数组实现代码

    使用javascript过程中,偶尔会用到数值,而且是打乱后的数值,本文将介绍一种高效打乱数组的方法,需要的朋友可以参考下
    2012-12-12

最新评论