在JS数组特定索引处指定位置插入元素的技巧


Posted in Javascript onAugust 24, 2014

如何在JS数组特定索引处指定位置插入元素?

需求: 将一个元素插入到现有数组的特定索引处。听起来很容易和常见,但需要一点时间来研究它。

// 原来的数组
var array = ["one", "two", "four"];
// splice(position, numberOfItemsToRemove, item)
// 拼接函数(索引位置, 要删除元素的数量, 元素)
array.splice(2, 0, "three"); // 
array; // 现在数组是这个样子 ["one", "two", "three", "four"]

如果对扩展原生 JavaScript 不反感,那么可以将这个方法添加到数组原型(Array prototype)中:

Array.prototype.insert = function (index, item) {
this.splice(index, 0, item);
};

此时,可以这样调用:

var nums = ["one", "two", "four"];
nums.insert(2, 'three'); // 注意数组索引, [0,1,2..]
array // ["one", "two", "three", "four"]
Javascript 相关文章推荐
JavaScript接口实现代码 (Interfaces In JavaScript)
Jun 11 Javascript
ExtJs GridPanel简单的增删改实现代码
Aug 26 Javascript
jQuery如何防止这种冒泡事件发生
Feb 27 Javascript
浅谈javascript的分号的使用
May 12 Javascript
基于Jquery实现表单验证
Jul 20 Javascript
vue组件watch属性实例讲解
Nov 07 Javascript
浅谈vuepress 踩坑记
Apr 18 Javascript
vue中的watch监听数据变化及watch中各属性的详解
Sep 11 Javascript
vue elementui form表单验证的实现
Nov 11 Javascript
Vuex 使用 v-model 配合 state的方法
Nov 13 Javascript
Vue中图片Src使用变量的方法
Oct 30 Javascript
Vue中多元素过渡特效的解决方案
Feb 05 Javascript
js获取checkbox复选框选中的选项实例
Aug 24 #Javascript
jQuery异步加载数据并添加事件示例
Aug 24 #Javascript
Jquery通过JSON字符串创建JSON对象
Aug 24 #Javascript
Jquery中扩展方法extend使用技巧
Aug 24 #Javascript
jquery使用$(element).is()来判断获取的tagName
Aug 24 #Javascript
jQuery响应鼠标事件并隐藏与显示input默认值
Aug 24 #Javascript
js delete 用法(删除对象属性及变量)
Aug 24 #Javascript
You might like
PHP 强制性文件下载功能的函数代码(任意文件格式)
2010/05/26 PHP
PHP代码优化的53个细节
2014/03/03 PHP
php实现信用卡校验位算法THE LUHN MOD-10示例
2014/05/07 PHP
thinkphp autoload 命名空间自定义 namespace
2015/07/17 PHP
php ci 获取表单中多个同名input元素值的代码
2016/03/25 PHP
如何使用PHP给图片加水印
2016/10/12 PHP
Thinkphp5框架中引入Markdown编辑器操作示例
2020/06/03 PHP
In Javascript Class, how to call the prototype method.(three method)
2007/01/09 Javascript
jQuery中after的两种用法实例
2013/07/03 Javascript
jquery鼠标放上去显示悬浮层即弹出定位的div层
2014/04/25 Javascript
jQuery结合CSS制作漂亮的select下拉菜单
2015/05/03 Javascript
浅谈Javascript数组的使用
2015/07/29 Javascript
JS基于FileSystemObject创建一个指定路径的TXT文本文件
2015/08/05 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
2016/08/29 Javascript
js实现模糊匹配功能
2017/02/15 Javascript
jQuery实现链接的title快速出现的方法
2017/02/20 Javascript
easy ui datagrid 从编辑框中获取值的方法
2017/02/22 Javascript
vue下history模式刷新后404错误解决方法
2018/08/18 Javascript
微信小程序如何获取群聊的openGid以及名称详解
2019/07/17 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
JavaScript如何操作css
2020/10/24 Javascript
React实现todolist功能
2020/12/28 Javascript
python中的内置函数getattr()介绍及示例
2014/07/20 Python
利用Python2下载单张图片与爬取网页图片实例代码
2017/12/25 Python
Pandas 同元素多列去重的实例
2018/07/03 Python
详解如何从TensorFlow的mnist数据集导出手写体数字图片
2019/08/05 Python
Python猜数字算法题详解
2020/03/01 Python
Django REST Swagger实现指定api参数
2020/07/07 Python
应届生人事助理求职信
2013/11/09 职场文书
材料物理专业个人求职信
2013/12/15 职场文书
五年级科学教学反思
2014/02/05 职场文书
会计演讲稿范文
2014/05/23 职场文书
大型公益活动策划方案
2014/08/20 职场文书
Vue实现tab导航栏并支持左右滑动功能
2021/06/28 Vue.js
MySQL池化框架学习接池自定义
2022/07/23 MySQL
win11自动弹出虚拟键盘怎么关闭? Win11关闭虚拟键盘的技巧
2023/01/09 数码科技