Most efficient way to create a zero filled JavaScr

Question

What is the most efficient way to create an arbitrary length zero filled array in JavaScript?

Answer 1

By default Uint8Array, Uint16Array and Uint32Array classes keep zeros as its values, so you don't need any complex filling techniques, just do:

var ary = new Uint8Array(10);

all elements of array ary will be zeros by default.

Answer 2

SHORTEST

Array(n).fill(0)

(16 char), where n is size of array

---

2018.10.28 i made performance comparison of 15 propositions from other answers. Tests was done on Mac OS X 10.13.6 High Sierra, on three browsers: Chrome 69.0.3497, Safari 12.0 (13606.2.11) and Firefox 63.0 (64 bit).

Result for n=100000

Below i show results for fastest browser (safari):

For all browsers the fastest solution was M - however it is not "typical array" (but very fast) - Safari 33.8k operations/second, Chrome 5.2k, FF 3.5k,

Fastest solutions for typical arrays:

• A and B (was similar) for Safari 5.5k and Chrome 1.1k (on Firefox A 0.1k, B 0.06k)
• F for Firefox 0.6k (on Safari 3.1k, Chrome 1.1k)
• for Chrome and Safari A,B,F results was close

The slowest solution:

• G for Safari 0.02k and Firefox 0.04k (on Chrome 0.1k)
• D for Chrome 0.04k (on Safari 0.33k, on Firefox 0.15k)

Solution N works only on Firefox and Chrome.

Result for n=10

Fastest:

• M was fastest on Chrome 17.3M and Safari 13.3M (Firefox 4.7M)
• A,B was similar and fastest on Firefox 16.9M (Chrome 15.6M, Safari 3.5M)

Slowest:

• O for Safari 0.35M
• K for Chrome 0.35M
• N for Firefox 0.31M

CONCLUSION

• the fastest solution on all browsers (except small n on Firefox) was M let a = new Float32Array(n) (however is not typical array) - for it the fastest browser was Safari (for large n >6x faster than Chrome, >9x faster than firefox)
• for typical arrays preferred solution is A let a = Array(n).fill(0) (fast and short code)

You can perform test on your machine here.

Answer 3

There's always the phpjs solution, which you can find here:

http://phpjs.org/functions/array_fill/

I can't speak for the project (creating a library of javascript functions that mirrors the greater functionality of php) as a whole, but the few functions that I've personally pulled from there have worked like a champ.

Answer 4

My fastest function would be:

function newFilledArray(len, val) {
    var a = [];
    while(len--){
        a.push(val);
    }
    return a;
}

var st = (new Date()).getTime();
newFilledArray(1000000, 0)
console.log((new Date()).getTime() - st); // returned 63, 65, 62 milliseconds

Using the native push and shift to add items to the array is much faster (about 10 times) than declaring the array scope and referencing each item to set it's value.

fyi: I consistently get faster times with the first loop, which is counting down, when running this in firebug (firefox extension).

var a = [];
var len = 1000000;
var st = (new Date()).getTime();
while(len){
    a.push(0);
    len -= 1;
}
console.log((new Date()).getTime() - st); // returned 863, 894, 875 milliseconds
st = (new Date()).getTime();
len = 1000000;
a = [];
for(var i = 0; i < len; i++){
    a.push(0);
}
console.log((new Date()).getTime() - st); // returned 1155, 1179, 1163 milliseconds

I'm interested to know what T.J. Crowder makes of that ? :-)

Answer 5

Shortest for loop code

a=i=[];for(;i<100;)a[i++]=0;

edit:
for(a=i=[];i<100;)a[i++]=0;
or
for(a=[],i=100;i--;)a[i]=0;

Safe var version

var a=[],i=0;for(;i<100;)a[i++]=0;

edit:
for(var i=100,a=[];i--;)a[i]=0;

Answer 6

Didn't see this method in answers, so here it is:

"0".repeat( 200 ).split("").map( parseFloat )

In result you will get zero-valued array of length 200:

[ 0, 0, 0, 0, ... 0 ]

I'm not sure about the performance of this code, but it shouldn't be an issue if you use it for relatively small arrays.