JS如何在数组指定位置插入元素


Posted in Javascript onMarch 10, 2020

一、JavaScript splice() 方法

splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目。

方法实例

//在数组指定位置插入
var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.splice(2, 0, "Lemon", "Kiwi");
//输出结果
//Banana, Orange, Lemon, Kiwi, Apple, Mango
//在数组开头插入
var shuiguo = ["Banana", "Orange", "Apple", "Mango"];
shuiguo.splice(0, 0, "Lemon");
//输出结果
//Lemon, Banana, Orange, Apple, Mango
语法
array.splice(index,howmany,item1,.....,itemX)

参数 Values
参数 描述
index 必需。规定从何处添加/删除元素。
该参数是开始插入和(或)删除的数组元素的下标,必须是数字。
howmany 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。
如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。
item1, ..., itemX 可选。要添加到数组的新元素
返回值
Type 描述
Array 如果从 arrayObject 中删除了元素,则返回的是含有被删除的元素的数组。

二、JavaScript unshift() 方法

unshift 方法用于向数组的开头添加一个或多个元素,并返回新数组的长度。

语法
array_object.unshift( newelement1, newelement2, ... )
参数 Values
参数 说明
array_object 要操作的数组(对象)
newelement1, ... 至少一个。要添加到数组的元素序列,使用 , 分隔。

提示:unshift 方法将直接修改原数组,并将已经存在的元素顺次地移到较高的下标处,而不像其他很多方法一样得到一个原数组的副本。

方法实例

<script language="JavaScript">

var array_1 = new Array('a','b','c');
document.write( array_1.unshift(1,2) + '<br />' );
document.write( array_1 );

</script>

运行该例子,输出:

5
1,2,a,b,c

注意

在 IE 某些版本下,该方法返回的可能是 undefined 而不是新数组的长度。

三、JavaScript concat() 方法

定义和用法

concat() 方法用于连接两个或多个数组。

该方法不会改变现有的数组,而仅仅会返回被连接数组的一个副本。

语法
arrayObject.concat(arrayX,arrayX,......,arrayX)
参数 描述
arrayX 必需。该参数可以是具体的值,也可以是数组对象。可以是任意多个。
返回值
返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组,那么添加的是数组中的元素,而不是数组。

实例

例子 1

在本例中,我们将把 concat() 中的参数连接到数组 a 中:

<script type="text/javascript">
var a = [1,2,3];
document.write( a.concat(4,5) );
</script>

输出:

1,2,3,4,5

例子 2

在本例中,我们创建了两个数组,然后使用 concat() 把它们连接起来:

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

document.write(
arr.concat(arr2)
)

</script>

输出:

George,John,Thomas,James,Adrew,Martin

例子 3

在本例中,我们创建了三个数组,然后使用 concat() 把它们连接起来:

<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

var arr3 = new Array(2)
arr3[0] = "William"
arr3[1] = "Franklin"

document.write(
arr.concat(arr2,arr3)
)

</script>

输出:

George,John,Thomas,James,Adrew,Martin,William,Franklin

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery.Autocomplete实现自动完成功能(详解)
Jul 13 Javascript
js实现一个省市区三级联动选择框代码分享
Mar 06 Javascript
javascript模拟实现C# String.format函数功能代码
Nov 25 Javascript
js查找某元素中的所有图片地址的方法
Jan 16 Javascript
javascript实现下班倒计时效果的方法(可桌面通知)
Jul 10 Javascript
AngularJS基础 ng-keydown 指令简单示例
Aug 02 Javascript
基于JavaScript实现购物车功能
Feb 07 Javascript
Vue.js父与子组件之间传参示例
Feb 28 Javascript
解析Json字符串的三种方法日常常用
May 02 Javascript
详解使用angular框架离线你的应用(pwa指南)
Jan 31 Javascript
vue.js iview打包上线后字体图标不显示解决办法
Jan 20 Javascript
微信小程序动态添加和删除组件的现实
Feb 28 Javascript
vue实现简单瀑布流布局
May 28 #Javascript
JavaScript观察者模式原理与用法实例详解
Mar 10 #Javascript
微信小程序用canvas画图并分享
Mar 09 #Javascript
JavaScript实现简单贪吃蛇效果
Mar 09 #Javascript
原生js无缝轮播插件使用详解
Mar 09 #Javascript
微信小程序自定义弹出模态框禁止底部滚动功能
Mar 09 #Javascript
JavaScript享元模式原理与用法实例详解
Mar 09 #Javascript
You might like
扩展你的 PHP 之入门篇
2006/12/04 PHP
PHP写入WRITE编码为UTF8的文件的实现代码
2008/07/07 PHP
基于PHP读取TXT文件向数据库导入海量数据的方法
2013/04/23 PHP
CodeIgniter基本配置详细介绍
2013/11/12 PHP
php防止sql注入示例分析和几种常见攻击正则表达式
2014/01/12 PHP
php+jQuery+Ajax实现点赞效果的方法(附源码下载)
2020/07/21 PHP
JQuery的Validation插件中Remote验证的中文问题
2010/07/26 Javascript
可兼容IE的获取及设置cookie的jquery.cookie函数方法
2013/09/02 Javascript
javascript实现des解密加密全过程
2014/04/03 Javascript
js关于命名空间的函数实例
2015/02/05 Javascript
JS模拟按钮点击功能的方法
2015/12/22 Javascript
分享javascript实现的冒泡排序代码并优化
2016/06/05 Javascript
原生JavaScript制作计算器
2016/10/16 Javascript
JS实现间歇滚动的运动效果实例
2016/12/22 Javascript
angularjs实现table增加tr的方法
2018/02/27 Javascript
Vue.JS实现垂直方向展开、收缩不定高度模块的JS组件
2018/06/19 Javascript
浅谈webpack+react多页面开发终极架构
2018/11/11 Javascript
JS+CSS3实现的简易钟表效果示例
2019/04/13 Javascript
在react中使用vue的状态管理的方法示例
2020/05/02 Javascript
[04:48]DOTA2亚洲邀请赛林书豪为VGJ加油
2017/04/01 DOTA
python实现井字棋游戏
2020/03/30 Python
Python快速查找list中相同部分的方法
2018/06/27 Python
解决tensorflow测试模型时NotFoundError错误的问题
2018/07/26 Python
Python一行代码解决矩阵旋转的问题
2019/11/30 Python
Django模板标签中url使用详解(url跳转到指定页面)
2020/03/19 Python
Python3 中sorted() 函数的用法
2020/03/24 Python
Pandas中DataFrame基本函数整理(小结)
2020/07/20 Python
selenium学习教程之定位以及切换frame(iframe)
2021/01/04 Python
分享30个新鲜的CSS3打造的精美绚丽效果(附演示下载)
2012/12/28 HTML / CSS
党支部组织生活会整改方案
2014/09/30 职场文书
公司聚餐通知
2015/04/22 职场文书
检讨书怎么写
2015/05/07 职场文书
有关西游记的读书笔记
2015/06/25 职场文书
教师节主题班会教案
2015/08/17 职场文书
Python 中的 copy()和deepcopy()
2021/11/07 Python
Java实现HTML转为Word的示例代码
2022/06/28 Java/Android