Sto cercando delle alternative a quelle seguenti per creare un array JavaScript contenente da 1 a N dove N è noto solo in fase di esecuzione.

var foo = [];

for (var i = 1; i <= N; i++) {
   foo.push(i);
}

Per me sembra che ci dovrebbe essere un modo per farlo senza il ciclo.

Se ottengo ciò che cerchi, vuoi una serie di numeri 1..nche puoi successivamente ripetere.

Se è tutto ciò di cui hai bisogno, puoi farlo?

var foo = new Array(45); // create an empty array with length 45

poi quando vuoi usarlo ... (non ottimizzato, solo per esempio)

for(var i = 0; i < foo.length; i++){
  document.write('Item: ' + (i + 1) + ' of ' + foo.length + '<br/>'); 
}

ad esempio, se non è necessario archiviare nulla nell'array, è sufficiente un contenitore della lunghezza corretta su cui è possibile scorrere ... questo potrebbe essere più semplice.

Guardalo in azione qui: http://jsfiddle.net/3kcvm/

In ES6 si usano i metodi Array from () e keys () .

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

Versione più breve utilizzando l' operatore spread .

[...Array(10).keys()]
//=> [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

Puoi farlo:

var N = 10; 
Array.apply(null, {length: N}).map(Number.call, Number)

risultato: [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]

o con valori casuali:

Array.apply(null, {length: N}).map(Function.call, Math.random)

risultato: [0.7082694901619107, 0.9572225909214467, 0.8586748542729765, 0.8653848143294454, 0.008339877473190427, 0.9911756622605026, 0.8133423360995948, 0.8377588465809822, 0.557757591535363245 0.117

Spiegazione

Innanzitutto, nota che Number.call(undefined, N)equivale a Number(N), che ritorna N. Lo useremo più tardi.

Array.apply(null, [undefined, undefined, undefined])è equivalente a Array(undefined, undefined, undefined), che produce un array di tre elementi e assegna undefineda ciascun elemento.

Come puoi generalizzare questo a N elementi? Considera come Array()funziona, che funziona in questo modo:

function Array() {
    if ( arguments.length == 1 &&
         'number' === typeof arguments[0] &&
         arguments[0] >= 0 && arguments &&
         arguments[0] < 1 << 32 ) {
        return [ … ];  // array of length arguments[0], generated by native code
    }
    var a = [];
    for (var i = 0; i < arguments.length; i++) {
        a.push(arguments[i]);
    }
    return a;
}

Dal momento che ECMAScript 5 , Function.prototype.apply(thisArg, argsArray)accetta anche un oggetto simile a una matrice tipo duck come secondo parametro. Se invochiamo Array.apply(null, { length: N }), verrà eseguito

function Array() {
    var a = [];
    for (var i = 0; i < /* arguments.length = */ N; i++) {
        a.push(/* arguments[i] = */ undefined);
    }
    return a;
}

Ora abbiamo un array N -element, con ogni elemento impostato su undefined. Quando lo chiamiamo .map(callback, thisArg), ogni elemento verrà impostato sul risultato di callback.call(thisArg, element, index, array). Pertanto, [undefined, undefined, …, undefined].map(Number.call, Number)mapperebbe ogni elemento a (Number.call).call(Number, undefined, index, array), che è lo stesso di Number.call(undefined, index, array), che, come abbiamo osservato in precedenza, valuta index. Ciò completa l'array i cui elementi sono uguali al loro indice.

Perché affrontare il problema Array.apply(null, {length: N})invece che solo Array(N)? Dopotutto, entrambe le espressioni risulterebbero in una matrice N- elemento di elementi indefiniti. La differenza è che nella prima espressione ogni elemento è esplicitamente impostato su indefinito, mentre nella seconda ogni elemento non è mai stato impostato. Secondo la documentazione di .map():

callbackviene invocato solo per gli indici dell'array a cui sono stati assegnati valori; non viene invocato per gli indici che sono stati eliminati o ai quali non sono mai stati assegnati valori.

Pertanto, Array(N)è insufficiente; Array(N).map(Number.call, Number)comporterebbe un array inizializzato di lunghezza N .

Compatibilità

Poiché questa tecnica si basa sul comportamento Function.prototype.apply()specificato in ECMAScript 5, non funzionerà nei browser pre-ECMAScript 5 come Chrome 14 e Internet Explorer 9.

Diversi modi con ES6

Utilizzo dell'operatore spread ( ...) e del metodo keys

[ ...Array(N).keys() ].map( i => i+1);

Fill / Mappa

Array(N).fill().map((_, i) => i+1);

Array.from

Array.from(Array(N), (_, i) => i+1)

Array.from e { length: N }hack

Array.from({ length: N }, (_, i) => i+1)

Nota sulla forma generalizzata

Tutte le suddette forme matrici può produrre inizializzate a valori praticamente qualsiasi desiderato modificando i+1l'espressione desiderata (ad esempio i*2, -i, 1+i*2, i%2ed ecc). Se l'espressione può essere espressa da una funzione, fla prima forma diventa semplicemente

[ ...Array(N).keys() ].map(f)

Esempi:

Array.from({length: 5}, (v, k) => k+1); 
// [1,2,3,4,5]

Poiché l'array è inizializzato con undefinedsu ciascuna posizione, il valore di v saràundefined

Esempio che mostra tutti i moduli

let demo= (N) => {
  console.log(
    [ ...Array(N).keys() ].map(( i) => i+1),
    Array(N).fill().map((_, i) => i+1) ,
    Array.from(Array(N), (_, i) => i+1),
    Array.from({ length: N }, (_, i) => i+1)
  )
}

demo(5)

Esempio più generico con la funzione di inizializzatore personalizzato, ad fes

[ ...Array(N).keys() ].map((i) => f(i))

o anche più semplice

[ ...Array(N).keys() ].map(f)

let demo= (N,f) => {
  console.log(
    [ ...Array(N).keys() ].map(f),
    Array(N).fill().map((_, i) => f(i)) ,
    Array.from(Array(N), (_, i) => f(i)),
    Array.from({ length: N }, (_, i) => f(i))
  )
}

demo(5, i=>2*i+1)

Le matrici gestiscono in modo innato le loro lunghezze. Mentre vengono attraversati, i loro indici possono essere conservati in memoria e referenziati a quel punto. Se è necessario conoscere un indice casuale, indexOfè possibile utilizzare il metodo.

Detto questo, per le tue esigenze potresti voler semplicemente dichiarare un array di una certa dimensione:

var foo = new Array(N);   // where N is a positive integer

/* this will create an array of size, N, primarily for memory allocation, 
   but does not create any defined values

   foo.length                                // size of Array
   foo[ Math.floor(foo.length/2) ] = 'value' // places value in the middle of the array
*/

ES6

Diffusione

Facendo uso dell'operatore spread ( ...) e del keysmetodo, consente di creare un array temporaneo di dimensioni N per produrre gli indici, quindi un nuovo array che può essere assegnato alla variabile:

var foo = [ ...Array(N).keys() ];

Fill / Mappa

Puoi prima creare la dimensione dell'array di cui hai bisogno, riempirlo con undefined e quindi creare un nuovo array usando map, che imposta ciascun elemento sull'indice.

var foo = Array(N).fill().map((v,i)=>i);

Array.from

Questo dovrebbe essere inizializzato alla lunghezza della dimensione N e popolare l'array in un passaggio.

Array.from({ length: N }, (v, i) => i)

Al posto dei commenti e della confusione, se si voleva davvero catturare i valori da 1..N negli esempi precedenti, ci sono un paio di opzioni:

1. se l'indice è disponibile, puoi semplicemente incrementarlo di uno (ad es ++i.).

2. nei casi in cui l'indice non viene utilizzato - e forse un modo più efficiente - è creare l'array ma fare in modo che N rappresenti N + 1, quindi spostarsi dalla parte anteriore.

   Quindi se desideri 100 numeri:

   let arr; (arr=[ ...Array(101).keys() ]).shift()

In ES6 puoi fare:

Array(N).fill().map((e,i)=>i+1);

http://jsbin.com/molabiluwa/edit?js,console

Modifica: modificato Array(45)da Array(N)quando hai aggiornato la domanda.

console.log(
  Array(45).fill(0).map((e,i)=>i+1)
);

Utilizzare il metodo molto popolare Underscore _.range

// _.range([start], stop, [step])

_.range(10); // => [0, 1, 2, 3, 4, 5, 6, 7, 8, 9]
_.range(1, 11); // => [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
_.range(0, 30, 5); // => [0, 5, 10, 15, 20, 25]
_.range(0, -10, -1); //  => [0, -1, -2, -3, -4, -5, -6, -7, -8, -9]
_.range(0); // => []

function range(start, end) {
    var foo = [];
    for (var i = start; i <= end; i++) {
        foo.push(i);
    }
    return foo;
}

Quindi chiamato da

var foo = range(1, 5);

Non esiste un modo integrato per farlo in Javascript, ma è una funzione di utilità perfettamente valida da creare se è necessario farlo più di una volta.

Modifica: a mio avviso, la seguente è una funzione di intervallo migliore. Forse solo perché sono influenzato da LINQ, ma penso che sia più utile in più casi. Il tuo chilometraggio può variare.

function range(start, count) {
    if(arguments.length == 1) {
        count = start;
        start = 0;
    }

    var foo = [];
    for (var i = 0; i < count; i++) {
        foo.push(start + i);
    }
    return foo;
}

il modo più veloce per riempire un Arrayin v8 è:

[...Array(5)].map((_,i) => i);

il risultato sarà: [0, 1, 2, 3, 4]

Questa domanda ha molte risposte complicate, ma una semplice riga:

[...Array(255).keys()].map(x => x + 1)

Inoltre, sebbene quanto sopra sia breve (e pulito) da scrivere, penso che quanto segue sia un po 'più veloce (per una lunghezza massima di:

127, Int8,

255, Uint8,

32.767, Int16,

65.535, Uint16,

2.147.483.647, Int32,

4.294.967.295, Uint32.

(basato sui valori interi massimi ), eccone di più su Array tipizzati ):

(new Uint8Array(255)).map(($,i) => i + 1);

Anche se questa soluzione non è altrettanto ideale, perché crea due array e utilizza la dichiarazione di variabile aggiuntiva "$" (non sono sicuro di come aggirare questo metodo con questo metodo). Penso che la seguente soluzione sia il modo più veloce possibile per farlo:

for(var i = 0, arr = new Uint8Array(255); i < arr.length; i++) arr[i] = i + 1;

Ogni volta che viene fatta questa affermazione, puoi semplicemente usare la variabile "arr" nell'ambito attuale;

Se vuoi farne una semplice funzione (con qualche verifica di base):

function range(min, max) {
    min = min && min.constructor == Number ? min : 0;
    !(max && max.constructor == Number && max > min) && // boolean statements can also be used with void return types, like a one-line if statement.
        ((max = min) & (min = 0));  //if there is a "max" argument specified, then first check if its a number and if its graeter than min: if so, stay the same; if not, then consider it as if there is no "max" in the first place, and "max" becomes "min" (and min becomes 0 by default)

    for(var i = 0, arr = new (
        max < 128 ? Int8Array : 
        max < 256 ? Uint8Array :
        max < 32768 ? Int16Array : 
        max < 65536 ? Uint16Array :
        max < 2147483648 ? Int32Array :
        max < 4294967296 ? Uint32Array : 
        Array
    )(max - min); i < arr.length; i++) arr[i] = i + min;
    return arr;
}



//and you can loop through it easily using array methods if you want
range(1,11).forEach(x => console.log(x));

//or if you're used to pythons `for...in` you can do a similar thing with `for...of` if you want the individual values:
for(i of range(2020,2025)) console.log(i);

//or if you really want to use `for..in`, you can, but then you will only be accessing the keys:

for(k in range(25,30)) console.log(k);

console.log(
    range(1,128).constructor.name,
    range(200).constructor.name,
    range(400,900).constructor.name,
    range(33333).constructor.name,
    range(823, 100000).constructor.name,
    range(10,4) // when the "min" argument is greater than the "max", then it just considers it as if there is no "max", and the new max becomes "min", and "min" becomes 0, as if "max" was never even written
);

così, con la funzione sopra, il "one-liner" super-lento sopra diventa il super-veloce, anche più corto:

range(1,14000);

Puoi usare questo:

new Array(/*any number which you want*/)
    .join().split(',')
    .map(function(item, index){ return ++index;})

per esempio

new Array(10)
    .join().split(',')
    .map(function(item, index){ return ++index;})

creerà il seguente array:

[1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

ES6 questo farà il trucco:

[...Array(12).keys()]

controlla il risultato:

[...Array(12).keys()].map(number => console.log(number))

Se ti capita di usare d3.js nella tua app come sono, D3 offre una funzione di supporto che lo fa per te.

Quindi, per ottenere un array da 0 a 4, è facile come:

d3.range(5)
[0, 1, 2, 3, 4]

e per ottenere un array da 1 a 5, come stavi richiedendo:

d3.range(1, 5+1)
[1, 2, 3, 4, 5]

Dai un'occhiata a questo tutorial per maggiori informazioni.

Utilizzo dell'operatore di diffusione ES2015 / ES6

[...Array(10)].map((_, i) => i + 1)

console.log([...Array(10)].map((_, i) => i + 1))

Questo è probabilmente il modo più veloce per generare una matrice di numeri

Più breve

var a=[],b=N;while(b--)a[b]=b+1;

In linea

var arr=(function(a,b){while(a--)b[a]=a;return b})(10,[]);
//arr=[0,1,2,3,4,5,6,7,8,9]

Se vuoi iniziare da 1

var arr=(function(a,b){while(a--)b[a]=a+1;return b})(10,[]);
//arr=[1,2,3,4,5,6,7,8,9,10]

Vuoi una funzione?

function range(a,b,c){c=[];while(a--)c[a]=a+b;return c}; //length,start,placeholder
var arr=range(10,5);
//arr=[5,6,7,8,9,10,11,12,13,14]

PERCHÉ?

1. while è il ciclo più veloce

2. L'impostazione diretta è più veloce di push

3. [] è più veloce di new Array(10)

4. è breve ... guarda il primo codice. quindi guarda tutte le altre funzioni qui.

Se ti piace non puoi vivere senza per

for(var a=[],b=7;b>0;a[--b]=b+1); //a=[1,2,3,4,5,6,7]

o

for(var a=[],b=7;b--;a[b]=b+1); //a=[1,2,3,4,5,6,7]

Se stai usando lodash, puoi usare _.range :

_.range([start=0], end, [step=1])

Crea una serie di numeri (positivi e / o negativi) che avanzano dall'inizio fino alla fine, ma non compresa. Viene utilizzato un passaggio -1 se viene specificato un inizio negativo senza fine o passaggio. Se end non è specificato, è impostato per iniziare con start quindi impostato su 0.

Esempi:

_.range(4);
// ➜ [0, 1, 2, 3]

_.range(-4);
// ➜ [0, -1, -2, -3]

_.range(1, 5);
// ➜ [1, 2, 3, 4]

_.range(0, 20, 5);
// ➜ [0, 5, 10, 15]

_.range(0, -4, -1);
// ➜ [0, -1, -2, -3]

_.range(1, 4, 0);
// ➜ [1, 1, 1]

_.range(0);
// ➜ []

il nuovo modo di riempire Arrayè:

const array = [...Array(5).keys()]
console.log(array)

il risultato sarà: [0, 1, 2, 3, 4]

con ES6 puoi fare:

// `n` is the size you want to initialize your array
// `null` is what the array will be filled with (can be any other value)
Array(n).fill(null)

Rapporto di sintesi finale. Drrruummm Rolll -

Questo è il codice più breve per generare un array di dimensioni N (qui 10) senza usare ES6 . La versione di Cocco sopra è vicina ma non la più breve.

(function(n){for(a=[];n--;a[n]=n+1);return a})(10)

Ma il vincitore indiscusso di questo codice golf (competizione per risolvere un problema particolare con il minor numero di byte di codice sorgente) è Niko Ruotsalainen . Utilizzo di Array Constructor e ES6 spread operator . (La maggior parte della sintassi ES6 è un tipo di codice valido, ma non lo è il seguente. Quindi sii prudente mentre lo usi)

[...Array(10).keys()]

Esiste un altro modo in ES6, usando Array.from che accetta 2 argomenti, il primo è un arrayLike (in questo caso un oggetto con lengthproprietà), e il secondo è una funzione di mappatura (in questo caso mappiamo l'elemento sul suo indice)

Array.from({length:10}, (v,i) => i)

questo è più breve e può essere utilizzato per altre sequenze come la generazione di numeri pari

Array.from({length:10}, (v,i) => i*2)

Inoltre, questo ha prestazioni migliori rispetto alla maggior parte degli altri modi perché si sposta in loop una sola volta attraverso l'array. Controlla lo snippit per alcuni confronti

// open the dev console to see results

count = 100000

console.time("from object")
for (let i = 0; i<count; i++) {
  range = Array.from({length:10}, (v,i) => i )
}
console.timeEnd("from object")

console.time("from keys")
for (let i =0; i<count; i++) {
  range = Array.from(Array(10).keys())
}
console.timeEnd("from keys")

console.time("apply")
for (let i = 0; i<count; i++) {
  range = Array.apply(null, { length: 10 }).map(function(element, index) { return index; })
}
console.timeEnd("apply")

Utilizzo di nuovi metodi di array e =>sintassi delle funzioni dallo standard ES6 (solo Firefox al momento della scrittura).

Riempiendo i fori con undefined:

Array(N).fill().map((_, i) => i + 1);

Array.fromtrasforma i "buchi" in undefinedmodo che Array.mapfunzioni come previsto:

Array.from(Array(5)).map((_, i) => i + 1)

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

a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

In ES6:

Array.from({length: 1000}, (_, i) => i);

ES5:

Array.apply(0, {length: 1000}).map(function(x,i){return i});

Solo un'altra versione ES6 .

Utilizzando il Array.fromsecondo argomento facoltativo:

Array.from (arrayLike [, mapFn [, thisArg]])

Possiamo costruire l'array numerato dalle Array(10)posizioni vuote :

Array.from(Array(10), (_, i) => i)

var arr = Array.from(Array(10), (_, i) => i);
document.write(arr);

Sembra che l'unico sapore attualmente non in questo elenco piuttosto completo di risposte sia quello con un generatore; quindi per porre rimedio a quanto segue:

const gen = N => [...(function*(){let i=0;while(i<N)yield i++})()]

che può essere utilizzato così:

gen(4) // [0,1,2,3]

La cosa bella di questo è che non devi solo incrementare ... Per trarre ispirazione dalla risposta data da @ igor-shubin, potresti creare una serie di random molto facilmente:

const gen = N => [...(function*(){let i=0;
  while(i++<N) yield Math.random()
})()]

E piuttosto che qualcosa di lungo operativamente costoso come:

const slow = N => new Array(N).join().split(',').map((e,i)=>i*5)
// [0,5,10,15,...]

potresti invece fare:

const fast = N => [...(function*(){let i=0;while(i++<N)yield i*5})()]

È possibile utilizzare il riempimento dell'array e la mappa da Es6; proprio come alcune persone hanno suggerito nelle risposte che hanno dato a questa domanda. Di seguito alcuni esempi:

Example-One: Array(10).fill(0).map((e,i)=>i+1)

Result-One: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]

Example-Two: Array(100/10).fill(0).map((e,i)=>(i*10)+10)

Result-Two:[10, 20, 30, 40, 50, 60, 70, 80, 90, 100]

Preferisco questo perché lo trovo semplice e facile.

Array.from({ length: (stop - start) / step + 1}, (_, i) => start + (i * step));

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

Usando ES6

const generateArray = n => [...Array(n)].map((_, index) => index + 1);

Object.keys(Array.apply(0, Array(3))).map(Number)

Ritorni [0, 1, 2]. Molto simile alla risposta eccellente di Igor Shubin , ma con un po 'meno inganno (e un personaggio in più).

Spiegazione:

• Array(3) // [undefined × 3]Genera una matrice di lunghezza n = 3. Purtroppo questo array è quasi inutile per noi, quindi dobbiamo ...
• Array.apply(0,Array(3)) // [undefined, undefined, undefined]rendere l'array iterabile. Nota: null è più comune come primo arg di apply ma 0 è più breve.
• Object.keys(Array.apply(0,Array(3))) // ['0', '1', '2'] quindi ottenere le chiavi dell'array (funziona perché le matrici sono l'array typeof è un oggetto con indici per le chiavi.
• Object.keys(Array.apply(0,Array(3))).map(Number) // [0, 1, 2] e mappare sui tasti, convertendo le stringhe in numeri.