Most efficient way to create a zero filled JavaScr

2018-12-31 12:31发布

问题:

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

回答1:

ES6 introduces Array.prototype.fill. It can be used like this:

new Array(len).fill(0);

Not sure if it\'s fast, but I like it because it\'s short and self-describing.

It\'s still not in IE (check compatibility), but there\'s a polyfill available.



回答2:

Although this is an old thread, I wanted to add my 2 cents to it. Not sure how slow/fast this is, but it\'s a quick one liner. Here is what I do:

If I want to pre-fill with a number:

Array.apply(null, Array(5)).map(Number.prototype.valueOf,0);
// [0, 0, 0, 0, 0]

If I want to pre-fill with a string:

Array.apply(null, Array(3)).map(String.prototype.valueOf,\"hi\")
// [\"hi\", \"hi\", \"hi\"]

Other answers have suggested:

new Array(5+1).join(\'0\').split(\'\')
// [\"0\", \"0\", \"0\", \"0\", \"0\"]

but if you want 0 (the number) and not \"0\" (zero inside a string), you can do:

new Array(5+1).join(\'0\').split(\'\').map(parseFloat)
// [0, 0, 0, 0, 0]


回答3:

Elegant way to fill an array with precomputed values

Here is another way to do it using ES6 that nobody has mentioned so far:

> Array.from(Array(3), () => 0)
< [0, 0, 0]

It works by passing a map function as the second parameter of Array.from.

In the example above, the first parameter allocates an array of 3 positions filled with the value undefined and then the lambda function maps each one of them to the value 0.

Although Array(len).fill(0) is shorter, it doesn\'t work if you need to fill the array by doing some computation first (I know the question didn\'t ask for it, but a lot of people end up here looking for this).

For instance, if you need an array with 10 random numbers:

> Array.from(Array(10), () => Math.floor(10 * Math.random()))
< [3, 6, 8, 1, 9, 3, 0, 6, 7, 1]

It\'s more concise (and elegant) than the equivalent:

const numbers = Array(10);
for (let i = 0; i < numbers.length; i++) {
    numbers[i] = Math.round(10 * Math.random());
}

This method can also be used to generate sequences of numbers by taking advantage of the index parameter provided in the callback:

> Array.from(Array(10), (d, i) => i)
< [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

Bonus answer: fill an array using String repeat()

Since this answer is getting a good deal of attention, I also wanted to show this cool trick. Although not as useful as my main answer, will introduce the still not very known, but very useful String repeat() method. Here\'s the trick:

> \"?\".repeat(10).split(\"\").map(() => Math.floor(10 * Math.random()))
< [5, 6, 3, 5, 0, 8, 2, 7, 4, 1]

Cool, huh? repeat() is a very useful method to create a string that is the repetition of the original string a certain number of times. After that, split() creates an array for us, which is then map()ped to the values we want. Breaking it down in steps:

> \"?\".repeat(10)
< \"??????????\"

> \"?\".repeat(10).split(\"\")
< [\"?\", \"?\", \"?\", \"?\", \"?\", \"?\", \"?\", \"?\", \"?\", \"?\"]

> \"?\".repeat(10).split(\"\").map(() => Math.floor(10 * Math.random()))
< [5, 6, 3, 5, 0, 8, 2, 7, 4, 1]


回答4:

The already mentioned ES 6 fill method takes care of this nicely. Most modern desktop browsers already support the required Array prototype methods as of today (Chromium, FF, Edge and Safari) [1]. You can look up details on MDN. A simple usage example is

a = new Array(10).fill(0);

Given the current browser support you should be cautious to use this unless you are sure your audience uses modern Desktop browsers.



回答5:

Note added August 2013, updated February 2015: The answer below from 2009 relates to JavaScript\'s generic Array type. It doesn\'t relate to the newer typed arrays defined in ES2015 [and available now in many browsers], like Int32Array and such. Also note that ES2015 adds a fill method to both Arrays and typed arrays, which is likely to be the most efficient way to fill them...

Also, it can make a big difference to some implementations how you create the array. Chrome\'s V8 engine, in particular, tries to use a highly-efficient, contiguous-memory array if it thinks it can, shifting to the object-based array only when necessary.


With most languages, it would be pre-allocate, then zero-fill, like this:

function newFilledArray(len, val) {
    var rv = new Array(len);
    while (--len >= 0) {
        rv[len] = val;
    }
    return rv;
}

But, JavaScript arrays aren\'t really arrays, they\'re key/value maps just like all other JavaScript objects, so there\'s no \"pre-allocate\" to do (setting the length doesn\'t allocate that many slots to fill), nor is there any reason to believe that the benefit of counting down to zero (which is just to make the comparison in the loop fast) isn\'t outweighed by adding the keys in reverse order when the implementation may well have optimized their handling of the keys related to arrays on the theory you\'ll generally do them in order.

In fact, Matthew Crumley pointed out that counting down is markedly slower on Firefox than counting up, a result I can confirm — it\'s the array part of it (looping down to zero is still faster than looping up to a limit in a var). Apparently adding the elements to the array in reverse order is a slow op on Firefox. In fact, the results vary quite a bit by JavaScript implementation (which isn\'t all that surprising). Here\'s a quick and dirty test page (below) for browser implementations (very dirty, doesn\'t yield during tests, so provides minimal feedback and will run afoul of script time limits). I recommend refreshing between tests; FF (at least) slows down on repeated tests if you don\'t.

The fairly complicated version that uses Array#concat is faster than a straight init on FF as of somewhere between 1,000 and 2,000 element arrays. On Chrome\'s V8 engine, though, straight init wins out every time...

Here\'s the test page (live copy):

<!DOCTYPE html>
<html>
<head>
<meta charset=\"UTF-8\">
<title>Zero Init Test Page</title>
<style type=\'text/css\'>
body {
    font-family:    sans-serif;
}
#log p {
    margin:     0;
    padding:    0;
}
.error {
    color:      red;
}
.winner {
    color:      green;
    font-weight:    bold;
}
</style>
<script type=\'text/javascript\' src=\'prototype-1.6.0.3.js\'></script>
<script type=\'text/javascript\'>
var testdefs = {
    \'downpre\':  {
        total:  0,
        desc:   \"Count down, pre-decrement\",
        func:   makeWithCountDownPre
    },
    \'downpost\': {
        total:  0,
        desc:   \"Count down, post-decrement\",
        func:   makeWithCountDownPost
    },
    \'up\':       {
        total:  0,
        desc:   \"Count up (normal)\",
        func:   makeWithCountUp
    },
    \'downandup\':  {
        total:  0,
        desc:   \"Count down (for loop) and up (for filling)\",
        func:   makeWithCountDownArrayUp
    },
    \'concat\':   {
        total:  0,
        desc:   \"Concat\",
        func:   makeWithConcat
    }
};

document.observe(\'dom:loaded\', function() {
    var markup, defname;

    markup = \"\";
    for (defname in testdefs) {
        markup +=
            \"<div><input type=\'checkbox\' id=\'chk_\" + defname + \"\' checked>\" +
            \"<label for=\'chk_\" + defname + \"\'>\" + testdefs[defname].desc + \"</label></div>\";
    }
    $(\'checkboxes\').update(markup);
    $(\'btnTest\').observe(\'click\', btnTestClick);
});

function epoch() {
    return (new Date()).getTime();
}

function btnTestClick() {

    // Clear log
    $(\'log\').update(\'Testing...\');

    // Show running
    $(\'btnTest\').disabled = true;

    // Run after a pause while the browser updates display
    btnTestClickPart2.defer();
}
function btnTestClickPart2() {

    try {
        runTests();
    }
    catch (e) {
        log(\"Exception: \" + e);
    }

    // Re-enable the button; we don\'t yheidl
    $(\'btnTest\').disabled = false;
}

function runTests() {
    var start, time, counter, length, defname, def, results, a, invalid, lowest, s;

    // Get loops and length
    s = $F(\'txtLoops\');
    runcount = parseInt(s);
    if (isNaN(runcount) || runcount <= 0) {
        log(\"Invalid loops value \'\" + s + \"\'\");
        return;
    }
    s = $F(\'txtLength\');
    length = parseInt(s);
    if (isNaN(length) || length <= 0) {
        log(\"Invalid length value \'\" + s + \"\'\");
        return;
    }

    // Clear log
    $(\'log\').update(\'\');

    // Do it
    for (counter = 0; counter <= runcount; ++counter) {

        for (defname in testdefs) {
            def = testdefs[defname];
            if ($(\'chk_\' + defname).checked) {
                start = epoch();
                a = def.func(length);
                time = epoch() - start;
                if (counter == 0) {
                    // Don\'t count (warm up), but do check the algorithm works
                    invalid = validateResult(a, length);
                    if (invalid) {
                        log(\"<span class=\'error\'>FAILURE</span> with def \" + defname + \": \" + invalid);
                        return;
                    }
                }
                else {
                    // Count this one
                    log(\"#\" + counter + \": \" + def.desc + \": \" + time + \"ms\");
                    def.total += time;
                }
            }
        }
    }

    for (defname in testdefs) {
        def = testdefs[defname];
        if ($(\'chk_\' + defname).checked) {
            def.avg = def.total / runcount;
            if (typeof lowest != \'number\' || lowest > def.avg) {
                lowest = def.avg;
            }
        }
    }

    results =
        \"<p>Results:\" +
        \"<br>Length: \" + length +
        \"<br>Loops: \" + runcount +
        \"</p>\";
    for (defname in testdefs) {
        def = testdefs[defname];
        if ($(\'chk_\' + defname).checked) {
            results += \"<p\" + (lowest == def.avg ? \" class=\'winner\'\" : \"\") + \">\" + def.desc + \", average time: \" + def.avg + \"ms</p>\";
        }
    }
    results += \"<hr>\";
    $(\'log\').insert({top: results});
}

function validateResult(a, length) {
    var n;

    if (a.length != length) {
        return \"Length is wrong\";
    }
    for (n = length - 1; n >= 0; --n) {
        if (a[n] != 0) {
            return \"Index \" + n + \" is not zero\";
        }
    }
    return undefined;
}

function makeWithCountDownPre(len) {
    var a;

    a = new Array(len);
    while (--len >= 0) {
        a[len] = 0;
    }
    return a;
}

function makeWithCountDownPost(len) {
    var a;

    a = new Array(len);
    while (len-- > 0) {
        a[len] = 0;
    }
    return a;
}

function makeWithCountUp(len) {
    var a, i;

    a = new Array(len);
    for (i = 0; i < len; ++i) {
        a[i] = 0;
    }
    return a;
}

function makeWithCountDownArrayUp(len) {
    var a, i;

    a = new Array(len);
    i = 0;
    while (--len >= 0) {
        a[i++] = 0;
    }
    return a;
}

function makeWithConcat(len) {
    var a, rem, currlen;

    if (len == 0) {
        return [];
    }
    a = [0];
    currlen = 1;
    while (currlen < len) {
        rem = len - currlen;
        if (rem < currlen) {
            a = a.concat(a.slice(0, rem));
        }
        else {
            a = a.concat(a);
        }
        currlen = a.length;
    }
    return a;
}

function log(msg) {
    $(\'log\').appendChild(new Element(\'p\').update(msg));
}
</script>
</head>
<body><div>
<label for=\'txtLength\'>Length:</label><input type=\'text\' id=\'txtLength\' value=\'10000\'>
<br><label for=\'txtLoops\'>Loops:</label><input type=\'text\' id=\'txtLoops\' value=\'10\'>
<div id=\'checkboxes\'></div>
<br><input type=\'button\' id=\'btnTest\' value=\'Test\'>
<hr>
<div id=\'log\'></div>
</div></body>
</html>


回答6:

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.



回答7:

function makeArrayOf(value, length) {
  var arr = [], i = length;
  while (i--) {
    arr[i] = value;
  }
  return arr;
}

makeArrayOf(0, 5); // [0, 0, 0, 0, 0]

makeArrayOf(\'x\', 3); // [\'x\', \'x\', \'x\']

Note that while is usually more efficient than for-in, forEach, etc.



回答8:

If you use ES6, you can use Array.from() like this:

Array.from({ length: 3 }, () => 0);
//[0, 0, 0]

Has the same result as

Array.from({ length: 3 }).map(() => 0)
//[0, 0, 0]

Because

Array.from({ length: 3 })
//[undefined, undefined, undefined]


回答9:

I\'ve tested all combinations of pre-allocating/not pre-allocating, counting up/down, and for/while loops in IE 6/7/8, Firefox 3.5, Chrome, and Opera.

The functions below was consistently the fastest or extremely close in Firefox, Chrome, and IE8, and not much slower than the fastest in Opera and IE 6. It\'s also the simplest and clearest in my opinion. I\'ve found several browsers where the while loop version is slightly faster, so I\'m including it too for reference.

function newFilledArray(length, val) {
    var array = [];
    for (var i = 0; i < length; i++) {
        array[i] = val;
    }
    return array;
}

or

function newFilledArray(length, val) {
    var array = [];
    var i = 0;
    while (i < length) {
        array[i++] = val;
    }
    return array;
}


回答10:

using object notation

var x = [];

zero filled? like...

var x = [0,0,0,0,0,0];

filled with \'undefined\'...

var x = new Array(7);

obj notation with zeros

var x = [];
for (var i = 0; i < 10; i++) x[i] = 0;

As a side note, if you modify Array\'s prototype, both

var x = new Array();

and

var y = [];

will have those prototype modifications

At any rate, I wouldn\'t be overly concerned with the efficiency or speed of this operation, there are plenty of other things that you will likely be doing that are far more wasteful and expensive than instanciating an array of arbitrary length containing zeros.



回答11:

function zeroFilledArray(size) {
    return new Array(size + 1).join(\'0\').split(\'\');
}


回答12:

If you need to create many zero filled arrays of different lengths during the execution of your code, the fastest way I\'ve found to achieve this is to create a zero array once, using one of the methods mentioned on this topic, of a length which you know will never be exceeded, and then slice that array as necessary.

For example (using the function from the chosen answer above to initialize the array), create a zero filled array of length maxLength, as a variable visible to the code that needs zero arrays:

var zero = newFilledArray(maxLength, 0);

Now slice this array everytime you need a zero filled array of length requiredLength < maxLength:

zero.slice(0, requiredLength);

I was creating zero filled arrays thousands of times during execution of my code, this speeded up the process tremendously.



回答13:

The way I usually do it (and is amazing fast) is using Uint8Array. For example, creating a zero filled vector of 1M elements:

  var zeroFilled = [].slice.apply(new Uint8Array(1000000))

I\'m a Linux user and always have worked for me, but once a friend using a Mac had some non-zero elements. I thought his machine was malfunctioning, but still here\'s the safest way we found to fix it:

  var zeroFilled = [].slice.apply(new Uint8Array(new Array(1000000)) 

Edited

Chrome 25.0.1364.160

  1. Frederik Gottlieb - 6.43
  2. Sam Barnum - 4.83
  3. Eli - 3.68
  4. Joshua 2.91
  5. Mathew Crumley - 2.67
  6. bduran - 2.55
  7. Allen Rice - 2.11
  8. kangax - 0.68
  9. Tj. Crowder - 0.67
  10. zertosh - ERROR

Firefox 20.0

  1. Allen Rice - 1.85
  2. Joshua - 1.82
  3. Mathew Crumley - 1.79
  4. bduran - 1.37
  5. Frederik Gottlieb - 0.67
  6. Sam Barnum - 0.63
  7. Eli - 0.59
  8. kagax - 0.13
  9. Tj. Crowder - 0.13
  10. zertosh - ERROR

Missing the most important test (at least for me): the Node.js one. I suspect it close to Chrome benchmark.



回答14:

I have nothing against:

Array.apply(null, Array(5)).map(Number.prototype.valueOf,0);
new Array(5+1).join(\'0\').split(\'\').map(parseFloat);

suggested by Zertosh, but in a new ES6 array extensions allow you to do this natively with fill method. Now IE edge, Chrome and FF supports it, but check the compatibility table

new Array(3).fill(0) will give you [0, 0, 0]. You can fill the array with any value like new Array(5).fill(\'abc\') (even objects and other arrays).

On top of that you can modify previous arrays with fill:

arr = [1, 2, 3, 4, 5, 6]
arr.fill(9, 3, 5)  # what to fill, start, end

which gives you: [1, 2, 3, 9, 9, 6]



回答15:

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):

\"enter \"enter

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.



回答16:

Using lodash or underscore

_.range(0, length - 1, 0);

Or if you have an array existing and you want an array of the same length

array.map(_.constant(0));


回答17:

As of ECMAScript2016, there is one clear choice for large arrays.

Since this answer still shows up near the top on google searches, here\'s an answer for 2017.

Here\'s a current jsbench with a few dozen popular methods, including many proposed up to now on this question. If you find a better method please add, fork and share.

I want to note that there is no true most efficient way to create an arbitrary length zero filled array. You can optimize for speed, or for clarity and maintainability - either can be considered the more efficient choice depending on the needs of the project.

When optimizing for speed, you want to: create the array using literal syntax; set the length, initialize iterating variable, and iterate through the array using a while loop. Here\'s an example.

const arr = [];
arr.length = 120000;
let i = 0;
while (i < 120000) {
  arr[i] = 0;
  i++;
}

Another possible implementation would be:

(arr = []).length = n;
let i = 0;
while (i < n) {
    arr[i] = 0;
    i++;
}

But I strongly discourage using this second implantation in practice as it\'s less clear and doesn\'t allow you to maintain block scoping on your array variable.

These are significantly faster than filling with a for loop, and about 90% faster than the standard method of

const arr = Array(n).fill(0);

But this fill method is still the most efficient choice for smaller arrays due to it\'s clarity, conciseness and maintainability. The performance difference likely won\'t kill you unless you\'re making a lot of arrays with lengths on the order of thousands or more.

A few other important notes. Most style guides recommend you no longer use varwithout a very special reason when using ES6 or later. Use const for variables that won\'t be redefined and let for variables that will. The MDN and Airbnb\'s Style Guide are great places to go for more information on best practices. The questions wasn\'t about syntax, but it\'s important that people new to JS know about these new standards when searching through these reams of old and new answers.



回答18:

ES6 solution:

[...new Array(5)].map(x => 0); // [0, 0, 0, 0, 0]


回答19:

What about new Array(51).join(\'0\').split(\'\')?



回答20:

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 ? :-)



回答21:

I was testing out the great answer by T.J. Crowder, and came up with a recursive merge based on the concat solution that outperforms any in his tests in Chrome (i didn\'t test other browsers).

function makeRec(len, acc) {
    if (acc == null) acc = [];
    if (len <= 1) return acc;
    var b = makeRec(len >> 1, [0]);
    b = b.concat(b);
    if (len & 1) b = b.concat([0]);
    return b;
},

call the method with makeRec(29).



回答22:

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.



回答23:

This concat version is much faster in my tests on Chrome (2013-03-21). About 200ms for 10,000,000 elements vs 675 for straight init.

function filledArray(len, value) {
    if (len <= 0) return [];
    var result = [value];
    while (result.length < len/2) {
        result = result.concat(result);
    }
    return result.concat(result.slice(0, len-result.length));
}

Bonus: if you want to fill your array with Strings, this is a concise way to do it (not quite as fast as concat though):

function filledArrayString(len, value) {
    return new Array(len+1).join(value).split(\'\');
}


回答24:

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;


回答25:

I knew I had this proto\'d somewhere :)

Array.prototype.init = function(x,n)
{
    if(typeof(n)==\'undefined\') { n = this.length; }
    while (n--) { this[n] = x; }
    return this;
}

var a = (new Array(5)).init(0);

var b = [].init(0,4);

Edit: tests

In response to Joshua and others methods I ran my own benchmarking, and I\'m seeing completely different results to those reported.

Here\'s what I tested:

//my original method
Array.prototype.init = function(x,n)
{
    if(typeof(n)==\'undefined\') { n = this.length; }
    while (n--) { this[n] = x; }
    return this;
}

//now using push which I had previously thought to be slower than direct assignment
Array.prototype.init2 = function(x,n)
{
    if(typeof(n)==\'undefined\') { n = this.length; }
    while (n--) { this.push(x); }
    return this;
}

//joshua\'s method
function newFilledArray(len, val) {
    var a = [];
    while(len--){
        a.push(val);
    }
    return a;
}

//test m1 and m2 with short arrays many times 10K * 10

var a = new Date();
for(var i=0; i<10000; i++)
{
    var t1 = [].init(0,10);
}
var A = new Date();

var b = new Date();
for(var i=0; i<10000; i++)
{
    var t2 = [].init2(0,10);
}
var B = new Date();

//test m1 and m2 with long array created once 100K

var c = new Date();
var t3 = [].init(0,100000);
var C = new Date();

var d = new Date();
var t4 = [].init2(0,100000);
var D = new Date();

//test m3 with short array many times 10K * 10

var e = new Date();
for(var i=0; i<10000; i++)
{
    var t5 = newFilledArray(10,0);
}
var E = new Date();

//test m3 with long array created once 100K

var f = new Date();
var t6 = newFilledArray(100000, 0)
var F = new Date();

Results:

IE7 deltas:
dA=156
dB=359
dC=125
dD=375
dE=468
dF=412

FF3.5 deltas:
dA=6
dB=13
dC=63
dD=8
dE=12
dF=8

So by my reckoning push is indeed slower generally but performs better with longer arrays in FF but worse in IE which just sucks in general (quel surprise).



回答26:

It might be worth pointing out, that Array.prototype.fill had been added as part of the ECMAScript 6 (Harmony) proposal. I would rather go with the polyfill written below, before considering other options mentioned on the thread.

if (!Array.prototype.fill) {
  Array.prototype.fill = function(value) {

    // Steps 1-2.
    if (this == null) {
      throw new TypeError(\'this is null or not defined\');
    }

    var O = Object(this);

    // Steps 3-5.
    var len = O.length >>> 0;

    // Steps 6-7.
    var start = arguments[1];
    var relativeStart = start >> 0;

    // Step 8.
    var k = relativeStart < 0 ?
      Math.max(len + relativeStart, 0) :
      Math.min(relativeStart, len);

    // Steps 9-10.
    var end = arguments[2];
    var relativeEnd = end === undefined ?
      len : end >> 0;

    // Step 11.
    var final = relativeEnd < 0 ?
      Math.max(len + relativeEnd, 0) :
      Math.min(relativeEnd, len);

    // Step 12.
    while (k < final) {
      O[k] = value;
      k++;
    }

    // Step 13.
    return O;
  };
}


回答27:

var str = \"0000000...0000\";
var arr = str.split(\"\");

usage in expressions: arr[i]*1;

EDIT: if arr supposed to be used in integer expressions, then please don\'t mind the char value of \'0\'. You just use it as follows: a = a * arr[i] (assuming a has integer value).



回答28:

The fastest way to do that is with forEach =)

(we keep backward compatibility for IE < 9)

var fillArray = Array.prototype.forEach
    ? function(arr, n) {
         arr.forEach(function(_, index) { arr[index] = n; });
         return arr;
      }
    : function(arr, n) {
         var len = arr.length;
         arr.length = 0;
         while(len--) arr.push(n);
         return arr;
      };

// test
fillArray([1,2,3], \'X\'); // => [\'X\', \'X\', \'X\']


回答29:

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.



回答30:

I just use :

var arr = [10];
for (var i=0; i<=arr.length;arr[i] = i, i++);