Question

我正在使用 Angular 应用程序，我在服务中有一个方法可以向 JSONplaceholder 发出 HTTP get 请求，响应是一个包含 100 个帖子的对象数组。我想知道如何只渲染这 100 个帖子中的 10 个，并且只能考虑创建一个辅助变量并执行以下操作：

  posts:any;
  
  modified:any[] = [];
  

  ngOnInit(): void {
    this.dataService.getPosts().subscribe( res =>
      {
        this.posts = res;
        for (let i = 0; i < this.posts.length; i++) {          
          i < 10 ? this.modified.push(this.posts[i]) : void(0);          
        }
      } 
    )
  }

这行得通，但我必须在我的模板中迭代 modified 变量，而且我很确定有更好的方法来改进它，使用更好的方法。这个小代码怎么能好一点？

谢谢

Answer 1

使用 array.slice - 该函数有两个参数，'start' 和 'end'。

'end' 表示您想要的最后一项之后的索引（它不包括 'end' 索引），并且是可选的。如果未提供 'end'，您将获得从 end 开始并继续到数组末尾的所有元素。

所以，就你而言，

modified = posts.slice(0, 10);

Answer 2

只是关于你可以做的 for 循环

for ( let i=0, len=this.posts.length; i<len; i++ ){
  // code
}

这样您将只运行 this.posts.length 一次（以防万一ths.posts 有大量数据）

Answer 3

要处理数组，您可以随时查看 JavaScript Array 文档：https://developer.mozilla.org/es/docs/Web/JavaScript/Reference/Global_Objects/Array

在这种情况下，您可以使用 slice 方法：

this.modified = res.slice(0,10);

如何针对这种情况优化这种传统的“for”循环？

3 个答案: