向现有数组中插入一个元素是经常会见到的一个需求。你可以:

使用push将元素插入到数组的尾部;

使用unshift将元素插入到数组的头部;

使用splice将元素插入到数组的中间;

上面那些方法都是常见的方法,但并不意味着没有性能更好的方法,比如:

使用push很容易就能将元素插入到数组尾部,但是还有一个更快performant的方法:

var arr = [1, 2, 3, 4, 5];

arr.push(6);
arr[arr.length] = 6; // 43% faster in Chrome 47.0.2526.106 on Mac OS X 10.11.1

两个方法都修改了原有的数组,不相信的话,可以去jsperf测试一下。

现在我们尝试将元素添加到数组的头部

var arr = [1, 2, 3, 4, 5];

arr.unshift(0);
[0].contact(arr); //98% faster in Chrome 47.0.2526.106 on Mac OS X 10.11.1

这里需要注意的是,unshift修改了原有数组,但是contact是返回一个新的数组,测试在这jsperf

将元素插入到数组中间使用splice,同时这是最快的方法了

var items = ['one', 'two', 'three', 'four'];

items.splice(items.length / 2, 0, 'hello');

splice会修改原有的数组

splice的参数说明:

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

arrayObject.splice(index,howmany,item1,.....,itemX)
  • index 必需。整数,规定添加/删除项目的位置,使用负数可从数组结尾处规定位置。
  • howmany 必需。要删除的项目数量。如果设置为 0,则不会删除项目。
  • item1, ..., itemX 可选。向数组添加的新项目。

本文是js tips系列,翻译自 https://github.com/loverajoel/jstips

[jstips]向数组中插入一个元素的更多相关文章

  1. js有序数组中插入一个元素,并有序的输出

    题目:比较传入函数的参数,将参数组成数组,从小到大排序,返回新的数组. 如: insert();console.log(arr); //[] insert(-1,-2); console.log(ar ...

  2. C#如何删除数组中的一个元素

    C#如何删除数组中的一个元素,剩余的元素组成新数组,数组名不变double[] arr = new double[n];需要删除的是第m+1个数据arr[m]求新数组arr.(新数组arr包含n-1个 ...

  3. Java 向数组中添加一个元素

    方法 一般数组是不能添加元素的,因为他们在初始化时就已定好长度了,不能改变长度. 向数组中添加元素思路: 第一步:把 数组 转化为 集合 list = Arrays.asList(array); 第二 ...

  4. 为什么改了JS数组中的一个元素的值,其他数组元素值都跟着变了

    原因: 数组是引用类型,数组变量存储在栈,元素数据存储在堆中,将数组赋值不同的对象,所以的赋值对象都指向堆同一个数据,所以改变其中一个数组中的元素,别的数组元素也会改变. 解决方案: 原理就是先把数组 ...

  5. 剑指offer-特定二维数组中查找一个元素是否存在-二分搜索-二维数组

    int [][] array ={ {1,2,8,9}, {2,4,9,12}, {4,7,10,13}, {6,8,11,19} }; 在一个二维数组中,每一行都按照从左到右递增的顺序排序,每一列都 ...

  6. search a 2D matrix(在二维数组中搜索一个元素)

    Write an efficient algorithm that searches for a value in an m x n matrix. This matrix has the follo ...

  7. javascript从数组中删除一个元素

    Array.prototype.remove = function(val) { var index = this.indexOf(val); if (index > -1) { this.sp ...

  8. js向一个数组中插入元素的几个方法-性能比较

    向一个数组中插入元素是平时很常见的一件事情.你可以使用push在数组尾部插入元素,可以用unshift在数组头部插入元素,也可以用splice在数组中间插入元素. 但是这些已知的方法,并不意味着没有更 ...

  9. 【跟着子迟品 underscore】如何优雅地写一个『在数组中寻找指定元素』的方法

    Why underscore (觉得这部分眼熟的可以直接跳到下一段了...) 最近开始看 underscore.js 源码,并将 underscore.js 源码解读 放在了我的 2016 计划中. ...

随机推荐

  1. Android设备连接Unity Profiler性能分析器

    Unity提供两种方式让Developer的Android设备连接Profiler进行性能分析: 1.通过wifi,Android设备和计算机处于同一个Wlan中. 2.通过USB ADB 普通情况我 ...

  2. PHP 12 :字符串的操作

    原文:PHP 12 :字符串的操作 本章介绍字符串的操作.之所以要把字符串单独拿出来讲,是因为字符串在每种语言里都是非常重要的.并且也是大家关心的.我们从以下几个方面介绍字符串: 字符串的表现形式. ...

  3. 使用jQuery热门功能实现

    非常多站点上都有返回顶部的效果,本文阐述怎样使用jquery实现返回顶部button. 首先须要在顶部加入例如以下html元素: <p id="back-to-top"> ...

  4. IE6/7中li浮动外边距无法撑开ul的解决方法

    昨天群里有人提出了这样的问题: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 < ...

  5. jsp解决kindeditor在线编辑器struts图片上传问题

    1.下载 官网下载ckeditor,解压后去掉不需要的部分,仅需保留plugin,lang,theme文件夹,这三个文件夹中用不到的东西可以删除, 比如lang文件下存放所有语言文件js,仅仅 保留e ...

  6. AngularJS Change Path Without Reloading

    To change path URL with AngularJS, $location.path() is passed the new URL as a parameter, and the pa ...

  7. 在GridView的中有一个DropDownList,并且DropDownList有回传事件

    在GridView的中有一个DropDownList,并且DropDownList有回传事件 最近做一个项目,需要在GridView中的ItemTemplate中添加一个DropDownList,并且 ...

  8. 引用动态链接库Dll文件 引用失败 未能添加对HD.dll的引用。请确保此文件可访问并且是一个有效的程序集或COM组件

    出现这个问题,是由于使用了非.NET 的动态链接库,需要注册 方法如下: 1.在搜索程序和文件中使用 regsvr32 "D:\Projects\8.01.01.03-重庆大足\lib\Va ...

  9. Java泛型学习笔记--Java泛型和C#泛型比较学习(一)

    总结Java的泛型前,先简单的介绍下C#的泛型,通过对比,比较学习Java泛型的目的和设计意图.C#泛型是C#语言2.0和通用语言运行时(CLR)同时支持的一个特性(这一点是导致C#泛型和Java泛型 ...

  10. 设计模式20---设计模式之备忘录模式(Memento)(行为型)

    1.讲解备忘录模式 备忘录模式(Memento Pattern)又叫做快照模式(Snapshot Pattern)或Token模式,是GoF的23种设计模式之一,属于行为模式. 1.1定义 在不破坏封 ...