Usage Array.push method

256 views Asked by At

Tell me please, what is the faster way to push a value into array?

I have written a simple test to compare push and a[a.length]= methods:

push.js:

self.onmessage = function (event) {
  var n = Number(event.data),
      i,
      pushAr = [],
      pushStart,
      pushDuration,
      ar = [],
      start,
      duration,
      message;

  // Push
  pushStart = new Date();
  for (i = 0; i < n; i += 1) {
    pushAr.push(i);
  }
  pushDuration = new Date() - pushStart;

  // explicit
  start = new Date();
  for (i = 0; i < n; i += 1) {
    ar[ar.length] = i;
  }
  duration = new Date() - start;

  message = "N = " + n;
  message += "\nPush duration: " + pushDuration + "; ";
  message += "Length duration: " + duration;

  self.postMessage(message);
};

main.js:

var worker = new Worker("push.js"),
    i;

worker.onmessage = function (event) {
  console.log(event.data);
};

for (i = 4; i < 8; i += 1) {
  worker.postMessage(Math.pow(10, i));
}

And I got following results:

Chrome:

N = 10000
Push duration: 0; Length duration: 0
N = 100000
Push duration: 3; Length duration: 5
N = 1000000
Push duration: 56; Length duration: 90
N = 10000000
Push duration: 807; Length duration: 948

Safari:

N = 10000
Push duration: 1; Length duration: 4
N = 100000
Push duration: 2; Length duration: 2
N = 1000000
Push duration: 27; Length duration: 41
N = 10000000
Push duration: 283; Length duration: 461

FireFox:

N = 10000
Push duration: 1; Length duration: 0
N = 100000
Push duration: 2; Length duration: 2
N = 1000000
Push duration: 11; Length duration: 20
N = 10000000
Push duration: 279; Length duration: 412

Seems like Array.push is faster, but why some libs use array length instead? And what bonuses of such method? Why Chrome is so slow? Maybe some faster methods exist?

2

There are 2 answers

2
panda-34 On BEST ANSWER

Both methods are exactly the same, push is faster because the same algorithm (getting array length) works inside the script engine and not in the script. ar[ar.length] may be used if you need the result of that expression to be the new value, like in chained assigment somevar = ar[ar.length] = "some new value"

I found some other possible use - compatibility with older versions of javascript engine. In Microsoft documentation for JScript version 5.0 there's no mention of push method in Array object. And I actually found my own code from back then (around 2000) that actually uses images[images.length] = s code. So, maybe arrays didn't always have the push method.

P.S. Yes, MSDN cocumentation for push method says version 5.5 is required and that wasn't even in windows 2000.

2
Willem Mulder On

Some libraries (e.g. jQuery) use ar[ar.length] because they don't use real arrays, but ArrayObjects, which don't have the .push method because they are Objects and not Arrays. Another trick that is used to solve that problem and that you might encounter often, is

Array.prototype.push.call(arrObj,'newValue');

The other reason for using ar[ar.length] is mentioned by Panda-34: chained assignments..!