您的位置:首页 > Web前端 > JavaScript

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

2017-01-11 15:32 507 查看
向一个数组中插入元素是平时很常见的一件事情。你可以使用push在数组尾部插入元素,可以用unshift在数组头部插入元素,也可以用splice在数组中间插入元素。

但是这些已知的方法,并不意味着没有更加高效的方法。让我们接着往下看……

向数组结尾添加元素

向数组结尾添加元素用push()很简单,但下面有一个更高效的方法

vararr=[1,2,3,4,5];
vararr2=[];

arr.push(6);
arr[arr.length]=6;
arr2=arr.concat([6]);


两种方法都是修改原始数组。不信?看看jsperf
手机上的效率

Android(v4.2.2)
arr.push(6);andarr[arr.length]=6;性能相同//3319694ops/sec
arr2=arr.concat([6]);比其他两个方法慢50.61%
ChromeMobile(v33.0.0)
arr[arr.length]=6;//6125975ops/sec
arr.push(6);慢66.74%
arr2=arr.concat([6]);慢87.63%
SafariMobile(v9)
arr[arr.length]=6;//7452898ops/sec
arr.push(6);慢40.19%
arr2=arr.concat([6]);慢49.78%

``


最快的为


1.arr[arr.length]=6;//平均5632856ops/sec
2.arr.push(6);//慢35.64%
3.arr2=arr.concat([6]);//慢62.67%
```



桌面上的效率

Chrome(v48.0.2564)
arr[arr.length]=6;//21602722ops/sec
arr.push(6);慢61.94%
arr2=arr.concat([6]);慢87.45%
Firefox(v44)
arr.push(6);//56032805ops/sec
arr[arr.length]=6;慢0.52%
arr2=arr.concat([6]);慢87.36%
IE(v11)
arr[arr.length]=6;//67197046ops/sec
arr.push(6);慢39.61%
arr2=arr.concat([6]);慢93.41%
Opera(v35.0.2066.68)
arr[arr.length]=6;//30775071ops/sec
arr.push(6);慢71.60%
arr2=arr.concat([6]);慢83.70%
Safari(v9.0.3)
arr.push(6);//42670978ops/sec
arr[arr.length]=6;慢0.80%
arr2=arr.concat([6]);慢76.07%
最快的为
1.arr[arr.length]=6;//平均42345449ops/sec
2.arr.push(6);//慢34.66%
3.arr2=arr.concat([6]);//慢85.79%


向数组的头部添加元素

现在我们试着

向数组的头部添加元素

vararr=[1,2,3,4,5];

arr.unshift(0);

[0].concat(arr);


这里有一些小区别,unshift操作的是原始数组,concat返回一个新数组,参考jsperf

手机上的效率:

Android(v4.2.2)
[0].concat(arr);//1808717ops/sec
arr.unshift(0);慢97.85%
ChromeMobile(v33.0.0)
[0].concat(arr);//1269498ops/sec
arr.unshift(0);慢99.86%
SafariMobile(v9)
arr.unshift(0);//3250184ops/sec
[0].concat(arr);慢33.67%
最快的为
1.[0].concat(arr);//平均4972622ops/sec
2.arr.unshift(0);//慢64.70%


桌面上的效率

Chrome(v48.0.2564)
[0].concat(arr);//2656685ops/sec
arr.unshift(0);慢96.77%
Firefox(v44)
[0].concat(arr);//8039759ops/sec
arr.unshift(0);慢99.72%
IE(v11)
[0].concat(arr);//3604226ops/sec
arr.unshift(0);慢98.31%
Opera(v35.0.2066.68)
[0].concat(arr);//4102128ops/sec
arr.unshift(0);慢97.44%
Safari(v9.0.3)
arr.unshift(0);//12356477ops/sec
[0].concat(arr);慢15.17%
最快的为
1.[0].concat(arr);//平均6032573ops/sec
2.arr.unshift(0);//慢78.65%


向数组中间添加元素

使用splice可以简单的向数组中间添加元素,这也是最高效的方法。

varitems=['one','two','three','four'];
items.splice(items.length/2,0,'hello');


我在许多浏览器和系统中进行了测试,结果都是相似的。希望这条小知识可以帮到你,也欢迎大家自行测试。


源:http://www.cnblogs.com/rubylouvre/p/5751564.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: