如何从数组中获取前 N 个元素

How to get first N number of elements from an array

提问人:user1526912 提问时间:1/20/2016 最后编辑:halferuser1526912 更新时间:7/20/2023 访问量:1209668

问:

我正在使用 Javascript(ES6) /FaceBook react 并尝试获取大小不同的数组的前 3 个元素。我想做 Linq take(n) 的等效操作。

在我的 Jsx 文件中,我有以下内容:

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

然后得到我尝试的前 3 个项目

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

这不起作用,因为地图没有设置功能。接下来我可以尝试什么?

JavaScript 数组过滤 切片 提取

评论


答:

1671赞 Oriol 1/20/2016 #1

要获取数组的第一个元素,请使用n

const slicedArray = array.slice(0, n);

评论

195赞 Danny Harding 7/13/2018
请注意,数组上的函数返回数组的浅拷贝,并且不会修改原始数组。developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/......slice
48赞 Rishabh876 9/28/2020
如果 n 大于 size,这会引发任何错误吗?
59赞 Morgoth 10/21/2020
@Rishabh876 不,它没有。因为它返回 .array.slice(0, n);[0, min(n, array.length))
2赞 ashleedawg 9/20/2021
@Morgoth - 我在这里感到困惑 - 你是说这是不正确的,因为在数组少于 3 个元素的情况下,此方法不会返回 3 个元素?
5赞 Morgoth 9/20/2021
@ashleedawg 取决于你对正确的定义。如果少于 3 个元素,而您将其切成 3 个,则它将返回数组中的所有元素(即少于 3 个)。这是一个非常明智的行为,但如果这对您的应用程序没有意义,您可能需要先检查数组的长度。array
19赞 sandeep 1/20/2016 #2

不要尝试使用地图函数执行此操作。映射函数应该用于将值从一个事物映射到另一个事物。当输入和输出的数量匹配时。

在这种情况下,请使用数组上也可用的过滤函数。当您想要有选择地获取某些条件的值时,使用过滤函数。然后你可以像这样编写代码

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

评论

1赞 Chris 4/11/2017
你总体上是正确的,但从语义上讲,你应该使用过滤器首先过滤掉元素集,然后,如果你采用这种方法,则映射过滤下来的集合。
11赞 elQueFaltaba 6/13/2017
filter 函数会遍历数组中的所有元素,而 slice 不会,所以在性能方面使用 slice 会更好,对吧?
859赞 Patrick Shaughnessy 1/20/2016 #3

我相信你要找的是:

// ...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>   
)
87赞 Pawel 2/7/2018 #4
arr.length = n

这可能会令人惊讶,但数组的属性不仅用于获取数组元素的数量,而且还具有可写性,可用于设置数组的长度 MDN 链接。这将使数组发生突变。length

如果您不关心不变性或不想分配内存,即为游戏分配内存,这将是最快的方法。

清空数组

arr.length = 0

评论

21赞 Oldrich Svec 12/2/2019
如果数组小于 N,这也将扩展数组
1赞 Manuel de la Iglesia Campos 7/29/2021
Pawel 的答案似乎是资源关键型环境中的最佳选择,并且当剩余的元素可以丢弃时。考虑到数组已经变小的情况,这是一个小小的改进:if (arr.length > n) arr.length = n
10赞 FlyingSnowGhost 1/5/2019 #5

以下内容对我有用。

array.slice( where_to_start_deleting, array.length )

下面是一个示例

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

评论

4赞 Veslav 4/12/2019
在第一个示例中,您使用 ,但在第二个示例中,您使用 .slicesplice
10赞 Redmega 10/3/2019
这也是错误的。你会从中得到的。切片的第一部分不是“从哪里开始删除”,而是从哪里开始切片。它不会修改原始数组,也不会删除任何内容。["Apple", "Mango"]
2赞 denski 10/15/2020
这是不正确的。Slice 返回切片项的新数组。应该是 ,其中是起始索引,是要取的数字。developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/......fruits.slice(0,2)02
43赞 Freddy 1/15/2019 #6

您可以使用数组进行过滤。index

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

评论

16赞 MikeBeaton 9/18/2019
.filter它本身不是一个好的选择,至少在输入数组可能很长的情况下不是。 遍历数组的每个元素,检查其状况。 不会这样做,而只是提取前 n 个元素,然后停止处理 - 这绝对是你想要的长列表。(正如@elQueFaltaba在对另一个答案的评论中所说的那样。.filter.slice
0赞 Siderite Zackwehdex 1/7/2020 #7

使用 LInQer,您可以执行以下操作:

Enumerable.from(list).take(3).toArray();
6赞 faruk13 10/24/2020 #8

举个简单的例子:

var letters = ["a", "b", "c", "d"];
var letters_02 = letters.slice(0, 2);
console.log(letters_02)

输出: [“a”, “b”]

var letters_12 = letters.slice(1, 2);
console.log(letters_12)

输出:[“b”]

注意:仅提供拷贝,修改原始数组。slice

7赞 nurgasemetey 1/14/2021 #9

使用 lodash, function,您可以通过以下方式实现这一点:take

_.take([1, 2, 3]);
// => [1]
 
_.take([1, 2, 3], 2);
// => [1, 2]
 
_.take([1, 2, 3], 5);
// => [1, 2, 3]
 
_.take([1, 2, 3], 0);
// => []
15赞 Anurag 6/19/2021 #10

只需尝试以下操作即可从列表中获取第一个元素:n

const slicedList = list.slice(0, n);

例:

const list = [1,2,3,4,5]
console.log(list.slice(0, 3)) // Should return [1,2,3] 
console.log(list.slice(0, 10)) // Returns [1,2,3,4,5] since this is all we have in 1st 10 elements

3赞 MD SHAYON 8/31/2021 #11

slice() 方法将数组的一部分的浅拷贝返回到从头到尾(不包括结束)选择的新数组对象中,其中 start 和 end 表示该数组中项的索引。不会修改原始数组。

const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];

console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]

console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]

console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]

console.log(animals.slice(-2));
// expected output: Array ["duck", "elephant"]

console.log(animals.slice(2, -1));
// expected output: Array ["camel", "duck"]

了解更多

50赞 Rahul singh 9/14/2021 #12

使用 Slice 方法

javascript 方法将数组的一部分返回到从头到尾选择的新数组对象中,其中 start 和 end 表示该数组中项的索引。不会修改原始数组。slice()

语法:slice(start, end)

假设我们有一个包含 7 个项目的数组,并且我们想要该数组中的前 5 个元素:[5,10,15,20,25,30,35]

let array = [5,10,15,20,25,30,35]
let newArray = array.slice(0,5)

console.log(newArray)

评论

0赞 alex 6/20/2022
请注意,您将收到数组中的值,从索引开始的值开始,直到索引结束的值 - 1。这有利于允许循环。
13赞 Frank HN 11/8/2022 #13

[1,2,3,4,5,6,7,8,8].slice(0, 3) = While 返回前 3 个元素。

答案:[1,2,3]

工作原理

slice() 方法将数组的一部分的浅拷贝返回到从头到尾(不包括结束)选择的新数组对象中,其中 start 和 end 表示该数组中项的索引。不会修改原始数组。