Como obter o primeiro número N de elementos de uma matriz

384

Estou trabalhando com o Javascript (ES6) / FaceBook reagindo e tentando obter os 3 primeiros elementos de uma matriz que varia em tamanho. Eu gostaria de fazer o equivalente ao Linq take (n).

No meu arquivo Jsx, tenho o seguinte:

var items = list.map(i => {
  return (
    <myview item={i} key={i.id} />
  );
});

Então, para obter os 3 primeiros itens que tentei

  var map = new Map(list);
    map.size = 3;
    var items = map(i => {
      return (<SpotlightLandingGlobalInboxItem item={i} key={i.id} />);
    });

Isso não funcionou, pois o mapa não possui uma função definida.

Você pode por favor ajudar?

javascript reactjs

— user1526912
fonte

4

Talvez eu esteja entendendo mal o problema, mas por que não usar algo assim list.slice(0, 3);e depois repetir isso?

— precisa saber é o seguinte

Por que você quer usar o mapa? Se eu entendi corretamente sua exigência, você pode usar a fatia para obter os primeiros n elementos.

— Abhishek Jain

Se o professor disse para usar o mapa? :) Sinto muito se esta é uma pergunta legítima, mas parecia uma lição de casa.

— precisa saber é

Por favor, considere mudar a resposta aceita para o que provou mais útil para o público

— Brian Webster

401

Acredito que você está procurando:

// ...inside the render() function

var size = 3;
var items = list.slice(0, size).map(i => {
    return <myview item={i} key={i.id} />
}

return (
  <div>
    {items}
  </div>   
)

— Patrick Shaughnessy
fonte

621

Para obter os primeiros nelementos de uma matriz, use

array.slice(0, n);

— Oriol
fonte

58

Observe que a slicefunção nas matrizes retorna uma cópia superficial da matriz e não modifica a matriz original. developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/...

— Danny Harding

30

Isso pode ser surpreendente, mas a lengthpropriedade de uma matriz não é usada apenas para obter o número de elementos da matriz, mas também é gravável e pode ser usada para definir o link MDN de comprimento da matriz . Isso mudará a matriz.

Se o array atual não é mais necessário e você não se importa com imutabilidade ou não deseja alocar memória, ou seja, para um jogo, a maneira mais rápida é

arr.length = n

esvaziar uma matriz

arr.length = 0

— Pawel
fonte

você tem certeza de que isso é mais rápido que arr = []?

— GrayedFox

3

O benefício aqui é evitar a alocação de memória. A inicialização de novos objetos em tempo de execução, ie..e para jogos, está causando o coletor de lixo e o jank.

— Pawel

Vale ressaltar que isso mudará a matriz, onde a fatia retornará uma cópia superficial. Isso se torna uma grande diferença se você precisar usar os itens que você acabou de truncar permanentemente.

— Ynot

11

@Ynot ok, eu vou fazer isso um pouco mais óbvia

— Pawel

4

Isso também expandirá a matriz se for menor que N

— Oldrich Svec 02/12/19

13

Não tente fazer isso usando uma função de mapa. A função de mapa deve ser usada para mapear valores de uma coisa para outra. Quando o número de entrada e saída coincide.

Nesse caso, use a função de filtro, que também está disponível na matriz. A função de filtro é usada quando você deseja selecionar seletivamente valores que atendem a determinados critérios. Então você pode escrever seu código como

var items = list
             .filter((i, index) => (index < 3))
             .map((i, index) => {
                   return (
                     <myview item={i} key={i.id} />
                   );
              });

— sandeep
fonte

11

Você está correto no geral, mas semanticamente você deve usar o filtro para filtrar primeiro o conjunto de elementos e, em seguida, mapeie o conjunto filtrado se estiver adotando essa abordagem.

— Chris

8

A função de filtro passaria por todos os elementos da matriz, enquanto a fatia não, por isso é melhor usar o fatia, certo?

— ElQueFaltaba 13/06

11

Você pode filtrar usando a indexmatriz.

var months = ['Jan', 'March', 'April', 'June'];
months = months.filter((month,idx) => idx < 2)
console.log(months);

Expandir snippet

— Freddy
fonte

2

.filterpor si só não é uma ótima opção, pelo menos não se a matriz de entrada puder ser longa. .filterpercorre todos os elementos da matriz, verificando sua condição. .slicenão faria isso, mas apenas extrairia os primeiros n elementos e depois pararia o processamento - o que definitivamente seria o que você deseja para uma longa lista. (Como @elQueFaltaba já disse em comentários à outra resposta.)

— MikeBeaton

9

O seguinte funcionou para mim.

array.slice( where_to_start_deleting, array.length )

Aqui está um exemplo

var fruits = ["Banana", "Orange", "Apple", "Mango"];
fruits.slice(2, fruits.length);
//Banana,Orange  ->These first two we get as resultant

— FlyingSnowGhost
fonte

4

No primeiro exemplo você usa, slicemas no segundo você usa splice.

— Veslav

3

Isso também está errado. Você obterá ["Apple", "Mango"]disso. A primeira parte da fatia não é "por onde começar a excluir"; é por onde começar a fatia. Não modifica a matriz original e não exclui nada.

— Angel Joseph Piscola

1

Com https://github.com/Siderite/LInQer, você pode acessar Enumerable.from (list) .take (3) .toArray ();

— Siderite Zackwehdex
fonte

0

Usar filtro

Não é a melhor prática, mas outra maneira

const cutArrByN = arr.filter((item, idx) => idx < n);

— Omer
fonte