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截取数组内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • JS轮播图中缓动函数的封装

    JS轮播图中缓动函数的封装

    这篇文章主要为大家详细介绍了JS轮播图中缓动函数的封装,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • JS实现表单中checkbox对勾选中增加边框显示效果

    JS实现表单中checkbox对勾选中增加边框显示效果

    这篇文章主要介绍了JS实现表单中checkbox对勾选中增加边框显示效果,可实现点击后图片增加边框及勾选的功能,非常简洁实用,需要的朋友可以参考下
    2015-08-08
  • JavaScript闭包相关知识解析

    JavaScript闭包相关知识解析

    这篇文章主要介绍了JavaScript闭包相关知识解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
    2019-10-10
  • JavaScript中诡异的delete操作符

    JavaScript中诡异的delete操作符

    这篇文章主要介绍了JavaScript中诡异的delete操作符,本文讲解了删除对象的属性、对数组的操作、对于变量的操作等内容,需要的朋友可以参考下
    2015-03-03
  • 微信小程序后端实现授权登录

    微信小程序后端实现授权登录

    这篇文章主要介绍了微信小程序后端实现授权登录,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-02-02
  • uniapp项目实践封装通用请求上传以及下载方法总结

    uniapp项目实践封装通用请求上传以及下载方法总结

    在日常开发过程中,前端经常要和后端进行接口联调,获取并且渲染数据到页面中,接下来就总结一下 uniapp 中获取请求、文件下载和上传的一些方法
    2023-09-09
  • JavaScript使用shift方法移除素组第一个元素实例分析

    JavaScript使用shift方法移除素组第一个元素实例分析

    这篇文章主要介绍了JavaScript使用shift方法移除素组第一个元素的用法,实例分析了javascript中shift方法的使用技巧,需要的朋友可以参考下
    2015-04-04
  • javascript中全局对象的parseInt()方法使用介绍

    javascript中全局对象的parseInt()方法使用介绍

    全局对象的parseInt()方法该如何使用,下面为大家详细介绍下,感兴趣的朋友不要错过
    2013-12-12
  • JavaScript中检测数据类型的四种方法

    JavaScript中检测数据类型的四种方法

    这篇文章主要给大家分享的是JavaScript中检测数据类型的四种方法,有 typeof、instanceof、constructor、Object.prototype.toString.call(),下面文章详细介绍内容,需要的小伙伴可以参考一下
    2022-01-01
  • Bootstrap如何激活导航状态

    Bootstrap如何激活导航状态

    这篇文章主要为大家详细介绍了Bootstrap如何激活导航状态,包括胶囊式导航中的激活状态和列表导航中的激活状态,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-03-03

最新评论