如何删除空数组并优化我的 POST 请求？答案

【问题标题】：How can I remove empty arrays and optimize my POST request?如何删除空数组并优化我的 POST 请求？
【发布时间】：2021-08-24 07:20:20
【问题描述】：

我有一个 Angular 的 POST 请求，但它不能正常工作，我不明白问题是什么，你能提出解决方案吗？

我第一次添加元素时，它只是添加了一个空数组。

第二次，添加我之前点击的第一个元素等等，有时候空数组还是可以随机跳过的

代码如下：

组件：


filmFiltered:Film[] = [];

selectFilm(data){
  this.filmFiltered = data;
  console.log(data);
}

likeFilm(){
  this.http.likeFilm(this.filmFiltered).subscribe(data=>{
    console.log(data);
  })
}

服务：

likeFilm(film){
        return this.http.post('http://localhost:3000/favouriteFilm', film)
    }

json:

{
  "favouriteFilm": [
     [],
    {
      "name": "Film 1",
      "id": 26899533
    },
    {
      "name": "Film2",
      "id": 204457
    },
    [],
    {
      "name": "Film3",
      "id": 128616
    },
    {
      "name": "Film4",
      "id": 173084
    },
    [],
    {
      "name": "Film5",
      "id": 128373
    }
  ]
}

【问题讨论】：

你的 JSON 结构有点不对劲。您有一个由对象 ({ }) 和其他空数组 ([ ]) 组成的数组。您可能希望从 JSON 中删除后者。此外，您可能希望在选择电影时使用array.push()。就目前而言，您正在为每个项目重新分配整个数组。

标签： json angular typescript web backend

【解决方案1】：

您可以运行标准循环并删除空数组；

for(var i = 0; i < favouriteFilm.length; i++){
    if(favouriteFilm[i] === []) favouriteFilm.splice(i, 1);
}

【讨论】：

【解决方案2】：

您可以使用过滤方法来过滤空数组：

  likeFilm(film){
     const filteredArray  = film.favouriteFilm.filter( (obj) => !Array.isArray(obj));
     film.favouriteFilm = filteredArray;
     return this.http.post('http://localhost:3000/favouriteFilm', film)
  }

【讨论】：

【解决方案3】：

正如多次提到的，您可以使用isArray() 函数过滤或删除空数组的元素。

我建议使用push() 插入新电影而不是分配它。

filmFiltered:Film[] = new Array<Film>();
selectFilm(data){
  this.filmFiltered.push(data);
  console.log(data);
}

我认为如果你初始化数组，代码中不应该有空数组，但是如果你想真正确定你可以使用下面的代码。

 likeFilm(){
  this.filmfiltered = [...this.filmFiltered.filter(film => !Array.isArray(film)];
  this.http.likeFilm(this.filmFiltered).subscribe(data=>{
    console.log(data);
  })

【讨论】：