JavaScript Array methods performance compare

JavaScript Array methods performance compare

JavaScript数组方法的性能对比

env

$ node -v
# v12.18.0

push vs unshift

"use strict";/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-20
* @modified
*
* @description push-vs-unshift
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
*/const log = console.log;function test (arr = [], type = `push`) {
const begin = new Date().getTime();
log(`begin`, begin);
if(type === `push`) {
// 在数组后面插入元素
arr.push(arr.length + 1)
} else {
// 在数组前面插入元素
arr.unshift(arr.length + 1)
}
const end = new Date().getTime();
log(`end`, end);
log(`\n${type}, end - begin`, end - begin);
}function multiTest (arr = [], num = 1, type = `push`) {
const begin = new Date().getTime();
log(`begin`, begin);
if(type === `push`) {
// 在数组后面插入元素
for (let i = 0; i < num; i++) {
arr.push(arr.length + 1 + i)
}
} else {
// 在数组前面插入元素
for (let i = 0; i < num; i++) {
arr.unshift(arr.length + 1 + i)
}
}
const end = new Date().getTime();
log(`end`, end);
log(`\n${type}, end - begin`, end - begin);
}const noForArrayAutoGenerator = (len = 100) => {
// return [...``.padStart(len, ` `)].map((item, i) => i + 1).map((item, i) => i % 2 === 0 ? item : item + ``);
return [...``.padStart(len, ` `)].map((item, i) => i % 2 === 0 ? i + 1 : i + 1 + ``);
}// const arr = noForArrayAutoGenerator(10000 * 10);
const arr = noForArrayAutoGenerator(10000 * 1000);const arr1 = [...arr];
const arr2 = [...arr];// test(arr1, `push`);
// test(arr2, `unshift`);const nums = 100;
multiTest(arr1, nums, `push`);
multiTest(arr2, nums, `unshift`);

one item, test result

multi items, test result

GC & stack overflow bug


// const arr = noForArrayAutoGenerator(10000 * 10000);
// FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory/*<--- Last few GCs --->
nce start of marking 998 ms) (average mu = 0.409, current mu = 0.065) allocation[9479:0x102d59000] 15026 ms: Mark-sweep 2062.8 (2065.0) -> 2062.8 (2065.0) MB, 768.1 / 0.0 ms (+ 0.0 ms in 0 steps since start of marking, biggest step 0.0 ms, walltime since start of marking 834 ms) (average mu = 0.287, current mu = 0.079) last resor[9479:0x102d59000] 16001 ms: Mark-sweep 2062.8 (2065.0) -> 2062.8 (2065.0) MB, 974.9 / 0.0 ms (average mu = 0.155, current mu = 0.000) last resort GC in old space requested<--- JS stacktrace --->==== JS stack trace ========================================= 0: ExitFrame [pc: 0x1009d6059]
1: StubFrame [pc: 0x100a17a54]
Security context: 0x2480d7d808d1 <JSObject>
2: anonymous (aka anonymous) [0x2480d5c82c81] [/Users/xgqfrms-mbp/Documents/GitHub/AFES/js-basic/array/push-vs-unshift.js:~40] [pc=0x320f7c803a7b](this=0x24805b8004b1 <undefined>,46758526,46758525)
3: map [0x2480d7d95609](this=0x2480d5c82c61 <JSArray[100000000]>,0x2480d5c82c81 <JSFunction (sfi = 0x24804...*/

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/unshift

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/push

pop vs shift

"use strict";/**
*
* @author xgqfrms
* @license MIT
* @copyright xgqfrms
* @created 2020-07-20
* @modified
*
* @description pop-vs-shift
* @difficulty Easy Medium Hard
* @complexity O(n)
* @augments
* @example
* @link
* @solutions
*
*/const log = console.log;function test (arr = [], type = `pop`) {
const begin = new Date().getTime();
log(`begin`, begin);
if(type === `pop`) {
// 在数组后面删除元素
arr.pop();
} else {
// 在数组前面删除元素
arr.shift()
}
const end = new Date().getTime();
log(`end`, end);
log(`\n${type}, end - begin`, end - begin);
}function multiTest (arr = [], num = 1, type = `pop`) {
const begin = new Date().getTime();
log(`begin`, begin);
if(type === `pop`) {
// 在数组后面删除元素
for (let i = 0; i < num; i++) {
arr.pop();
}
} else {
// 在数组前面删除元素
for (let i = 0; i < num; i++) {
arr.shift()
}
}
const end = new Date().getTime();
log(`end`, end);
log(`\n${type}, end - begin`, end - begin);
}const noForArrayAutoGenerator = (len = 100) => {
// return [...``.padStart(len, ` `)].map((item, i) => i + 1).map((item, i) => i % 2 === 0 ? item : item + ``);
return [...``.padStart(len, ` `)].map((item, i) => i % 2 === 0 ? i + 1 : i + 1 + ``);
}// const arr = noForArrayAutoGenerator(10000 * 10);
const arr = noForArrayAutoGenerator(10000 * 1000);// const arr = noForArrayAutoGenerator(10000 * 10000);
// FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memoryconst arr1 = [...arr];
const arr2 = [...arr];// test(arr1, `pop`);
// test(arr2, `shift`);const nums = 100;
multiTest(arr1, nums, `pop`);
multiTest(arr2, nums, `shift`);

single item, test result

multi items, test result

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/shift

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/pop

refs

https://javascript.info/array#performance

---

---

xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---