Poszukuję alternatywnych sposobów na utworzenie tablicy JavaScript zawierającej od 1 do N, gdzie N jest znane tylko w czasie wykonywania.

var foo = [];

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

Dla mnie wydaje się, że powinien istnieć sposób na zrobienie tego bez pętli.

Jeśli dostanę to, czego szukasz, potrzebujesz tablicy liczb 1..n, którą możesz później zapętlić.

Jeśli to wszystko, czego potrzebujesz, możesz to zrobić zamiast tego?

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

wtedy, gdy chcesz go użyć ... (niezoptymalizowany, na przykład)

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

np. jeśli nie musisz przechowywać niczego w tablicy, potrzebujesz tylko pojemnika o odpowiedniej długości, nad którym możesz iterować ... to może być łatwiejsze.

Zobacz to w akcji tutaj: http://jsfiddle.net/3kcvm/

W ES6 przy użyciu metod Array from () i keys () .

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

Krótsza wersja z operatorem rozkładania .

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

Możesz to zrobić:

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

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

lub z losowymi wartościami:

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

wynik: [0,7082694901619107, 0,9572225909214467, 0,8586748542729765, 0,8653848143294454, 0,008339877473190427, 0,9911756622605026, 0,8133423360995948, 0,8377588465809822, 0,557758303636454, 0,0753 930 955 364, 0,0753 930 955 0,475

Wyjaśnienie

Po pierwsze, zwróć uwagę na Number.call(undefined, N)to Number(N), co po prostu zwraca N. Wykorzystamy ten fakt później.

Array.apply(null, [undefined, undefined, undefined])jest równoważne z Array(undefined, undefined, undefined), który tworzy tablicę trzyelementową i przypisuje undefineddo każdego elementu.

Jak możesz to uogólnić na N elementów? Zastanów się, jak to Array()działa, co wygląda mniej więcej tak:

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;
}

Od ECMAScript 5 , Function.prototype.apply(thisArg, argsArray)przyjmuje również kaczki wpisany tablicowej obiekt jako drugi parametr. Jeśli wywołamy Array.apply(null, { length: N }), to się uruchomi

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

Teraz mamy tablicę N- element, z każdym elementem ustawionym na undefined. Kiedy .map(callback, thisArg)go wywołamy, każdy element zostanie ustawiony na wynik callback.call(thisArg, element, index, array). Dlatego [undefined, undefined, …, undefined].map(Number.call, Number)odwzorowałby każdy element na (Number.call).call(Number, undefined, index, array), który jest taki sam, jak Number.call(undefined, index, array), jak zaobserwowaliśmy wcześniej, ocenia index. To uzupełnia tablicę, której elementy są takie same jak ich indeks.

Po co męczyć się Array.apply(null, {length: N})zamiast po prostu Array(N)? Po tym wszystkim, oba wyrażenia spowoduje AN N -elementowe tablicę niezdefiniowanych elementów. Różnica polega na tym, że w pierwszym wyrażeniu każdy element jest jawnie ustawiony na niezdefiniowany, podczas gdy w drugim wyrażeniu każdy element nigdy nie był ustawiony. Zgodnie z dokumentacją .map():

callbackjest wywoływany tylko dla indeksów tablicy, którym przypisano wartości; nie jest wywoływany dla indeksów, które zostały usunięte lub którym nigdy nie przypisano wartości.

Dlatego Array(N)jest niewystarczający; Array(N).map(Number.call, Number)spowodowałoby niezainicjowanego matrycy o długości N .

Zgodność

Ponieważ ta technika opiera się na zachowaniu Function.prototype.apply()określonym w ECMAScript 5, nie będzie działać w przeglądarkach starszych niż ECMAScript 5, takich jak Chrome 14 i Internet Explorer 9.

Wiele sposobów korzystania z ES6

Korzystanie z ...metody spread operator ( ) i keys

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

Wypełnij / mapę

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

Array.from

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

Array. From and { length: N }hack

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

Uwaga na temat formy uogólnionej

Wszystkie powyższe formy tablic może produkować zerowana do prawie każdej żądanej wartości poprzez zmianę i+1ekspresji wymagane (np i*2, -i, 1+i*2, i%2i etc). Jeśli wyrażenie może być wyrażone przez jakąś funkcję, fwówczas pierwsza forma staje się po prostu

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

Przykłady:

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

Ponieważ tablica jest inicjowana undefineddla każdej pozycji, wartością v będzieundefined

Przykład przedstawiający wszystkie formularze

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)

Bardziej ogólny przykład z niestandardową funkcją inicjalizacji, ftj

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

lub nawet prościej

[ ...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)

Tablice z natury zarządzają swoimi długościami. Podczas ich przechodzenia ich indeksy mogą być przechowywane w pamięci i przywoływane w tym punkcie. Jeśli trzeba znać indeks losowy, indexOfmożna zastosować tę metodę.

To powiedziawszy, dla twoich potrzeb możesz po prostu zadeklarować tablicę o określonym rozmiarze:

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

Rozpowszechnianie się

Korzystanie z operatora spread ( ...) i keysmetody umożliwia utworzenie tymczasowej tablicy o rozmiarze N w celu wygenerowania indeksów, a następnie nowej tablicy, którą można przypisać do zmiennej:

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

Wypełnij / mapę

Możesz najpierw utworzyć rozmiar potrzebnej tablicy, wypełnić ją niezdefiniowaną, a następnie utworzyć nową tablicę za pomocą map, która ustawia każdy element na indeks.

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

Array.from

Powinno to być inicjowanie do długości rozmiaru N i zapełnianie tablicy w jednym przebiegu.

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

Zamiast komentarzy i zamieszania, jeśli naprawdę chcesz uchwycić wartości z 1..N w powyższych przykładach, istnieje kilka opcji:

1. jeśli indeks jest dostępny, możesz po prostu zwiększyć go o jeden (np ++i.).

2. w przypadkach, gdy indeks nie jest używany - i być może bardziej wydajnym sposobem - jest utworzenie tablicy, ale ustawienie N oznacza N + 1, a następnie przesunięcie z przodu.

   Więc jeśli chcesz 100 liczb:

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

W ES6 możesz wykonać:

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

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

Edycja: Zmieniono Array(45)na Array(N)od czasu zaktualizowania pytania.

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

Użyj bardzo popularnej metody podkreślenia _.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;
}

Następnie zadzwonił

var foo = range(1, 5);

Nie ma wbudowanego sposobu, aby to zrobić w JavaScript, ale jest to całkowicie poprawna funkcja narzędzia, którą można utworzyć, jeśli musisz to zrobić więcej niż raz.

Edycja: Moim zdaniem, lepsza funkcja zakresu jest następująca. Może po prostu dlatego, że jestem stronniczy przez LINQ, ale myślę, że jest to bardziej przydatne w większej liczbie przypadków. Twój przebieg może się różnić.

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;
}

najszybszym sposobem na wypełnienie Arrayv8 jest:

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

wynikiem będzie: [0, 1, 2, 3, 4]

To pytanie ma wiele skomplikowanych odpowiedzi, ale prosty jednoliniowy:

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

Ponadto, chociaż powyższe jest krótkie (i schludne) do napisania, myślę, że następujące jest nieco szybsze (dla maksymalnej długości:

127, Int8,

255, Uint8,

32 767, Int16,

65 535, Uint16,

2 147 483 647, Int32,

4 294 967 295, Uint32.

(w oparciu o maksymalne wartości całkowite ), oto także więcej o tablicach typowanych ):

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

Chociaż to rozwiązanie również nie jest takie idealne, ponieważ tworzy dwie tablice i używa dodatkowej zmiennej deklaracji „$” (nie jestem pewien, jak to obejść za pomocą tej metody). Myślę, że następujące rozwiązanie jest absolutnie najszybszym możliwym sposobem na to:

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

W dowolnym momencie po wykonaniu tej instrukcji można po prostu użyć zmiennej „arr” w bieżącym zakresie;

Jeśli chcesz zrobić z niego prostą funkcję (z pewną podstawową weryfikacją):

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

dzięki powyższej funkcji powyższy superpowolny „prosty jeden linijka” staje się superszybki, a nawet krótszy:

range(1,14000);

Możesz użyć tego:

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

na przykład

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

utworzy następującą tablicę:

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

ES6 to załatwi sprawę:

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

sprawdź wynik:

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

Jeśli akurat używasz d3.js w swojej aplikacji, tak jak ja, D3 zapewnia funkcję pomocniczą, która robi to za Ciebie.

Aby uzyskać tablicę od 0 do 4, jest to tak proste jak:

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

i uzyskać tablicę od 1 do 5, tak jak prosiłeś:

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

Sprawdź ten samouczek, aby uzyskać więcej informacji.

Za pomocą operatora rozprzestrzeniania ES2015 / ES6

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

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

Jest to prawdopodobnie najszybszy sposób na wygenerowanie tablicy liczb

Najkrótszy

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

Inline

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

Jeśli chcesz zacząć od 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]

Chcesz funkcję?

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]

DLACZEGO?

1. while jest najszybszą pętlą

2. Ustawienie bezpośrednie jest szybsze niż push

3. [] jest szybszy niż new Array(10)

4. jest krótki ... spójrz na pierwszy kod. następnie spójrz na wszystkie inne funkcje tutaj.

Jeśli podoba Ci nie może żyć bez za

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

lub

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

nowy sposób napełniania Arrayto:

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

wynikiem będzie: [0, 1, 2, 3, 4]

Jeśli używasz lodash, możesz użyć _.range :

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

Tworzy tablicę liczb (dodatnich i / lub ujemnych), które zaczynają się od początku do końca, ale nie obejmują. Krok -1 jest używany, jeśli określono ujemny początek bez końca lub kroku. Jeśli nie określono końca, ustawi się na początek, a następnie na 0.

Przykłady:

_.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);
// ➜ []

z ES6 możesz wykonać:

// `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)

Końcowy raport podsumowujący. Drrruummm Rolll -

Jest to najkrótszy kod do wygenerowania tablicy o rozmiarze N (tutaj 10) bez użycia ES6 . Powyższa wersja Cocco jest bliska, ale nie najkrótsza.

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

Ale niekwestionowanym zwycięzcą tego golfa Code (rywalizacja o rozwiązanie konkretnego problemu w najmniejszej liczbie bajtów kodu źródłowego) jest Niko Ruotsalainen . Korzystanie z Array Constructor i operatora rozprzestrzeniania ES6 . (Większość składni ES6 jest poprawnym typem skryptu, ale nie jest to zgodne z poniższym. Więc bądź rozsądny podczas korzystania z niego)

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

Jest jeszcze inny sposób w ES6, używając Array.from, który pobiera 2 argumenty, pierwszy to tablicaLike (w tym przypadku obiekt z lengthwłaściwością), a druga to funkcja mapowania (w tym przypadku mapujemy element na jego indeks)

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

jest to krótsze i może być wykorzystane do innych sekwencji, takich jak generowanie liczb parzystych

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

Ma to również lepszą wydajność niż większość innych sposobów, ponieważ zapętla się tylko raz przez tablicę. Sprawdź snippit dla niektórych porównań

// 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")

Używanie nowych metod Array i =>składni funkcji ze standardu ES6 (tylko Firefox w momencie pisania).

Wypełniając otwory undefined:

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

Array.fromzwojów „dziury” w undefinedtak Array.mapdziała zgodnie z oczekiwaniami:

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]

W ES6:

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

ES5:

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

Po prostu kolejna wersja ES6 .

Korzystając z Array.fromdrugiego opcjonalnego argumentu:

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

Możemy zbudować tablicę numeryczną z pustych Array(10)pozycji:

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

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

Wydaje się, że jedynym smakiem, którego obecnie nie ma na tej dość kompletnej liście odpowiedzi, jest generator z generatorem; aby temu zaradzić:

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

które można wykorzystać w ten sposób:

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

Zaletą tego jest to, że nie musisz tylko zwiększać ... Aby czerpać inspirację z odpowiedzi udzielonej przez @ igor-shubin, możesz bardzo łatwo stworzyć szereg losowości:

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

I zamiast czegoś długiego kosztowo operacyjnego, takiego jak:

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

zamiast tego możesz:

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

Możesz użyć wypełnienia macierzy i mapy z Es6; tak jak kilka osób sugerowało w odpowiedziach na to pytanie. Poniżej kilka przykładów:

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]

Wolę to, ponieważ uważam to za proste i łatwiejsze.

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

Źródło: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/from

Korzystanie z ES6

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

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

Powraca [0, 1, 2]. Bardzo podobny do doskonałej odpowiedzi Igora Shubina , ale z nieco mniej sztuczką (i jedną postacią dłuższą).

Wyjaśnienie:

• Array(3) // [undefined × 3]Wygeneruj tablicę o długości n = 3. Niestety ta tablica jest dla nas prawie bezużyteczna, dlatego musimy…
• Array.apply(0,Array(3)) // [undefined, undefined, undefined]uczyń tablicę iterowalną. Uwaga: null jest bardziej powszechny jako pierwszy argument Apply, ale 0 jest krótszy.
• Object.keys(Array.apply(0,Array(3))) // ['0', '1', '2'] następnie zdobądź klucze tablicy (działa, ponieważ tablice są typem tablica to obiekt z indeksami dla kluczy.
• Object.keys(Array.apply(0,Array(3))).map(Number) // [0, 1, 2] i mapuj klawisze, konwertując ciągi na liczby.