嵌套 json 对象中数组过滤器的使用答案

【问题标题】：Usage of array filter in nested json object嵌套 json 对象中数组过滤器的使用
【发布时间】：2019-11-02 19:25:13
【问题描述】：

我的目标是引用嵌套 json structure 内的特定视图（A、B 或 C）。

this.selected_table = this.all_tables.views.find(x => x)['A'];

这是使用过滤器的正确方法吗，因为我发现的所有示例在array.find() 中都有一些条件。在我的情况下，它可以在没有条件的情况下工作，但我觉得array.find() 在我的情况下是不必要的？但是，我找不到其他方法。

JSON 对象

all_tables = {  
   "views":[  
      {  
         "A":[  
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ],
         "B":[  
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ],
         "C":[  
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ]
      }
   ]
}

【问题讨论】：

您的预期结果是什么？

标签： javascript arrays json typescript filter

【解决方案1】：

通常Array.prototype.find 用于根据内部函数是否返回 true 来查找数组中的特定元素。在您的示例中，您将返回x，这是您在views 数组中的对象，因此它的计算结果为true。因此，您的 .find 只是返回您的 views 数组中的一个对象（或者更具体地说是您的 views 数组中的第一个对象）。既然是这种情况，就不需要.find()，而是可以使用它的索引来引用views 中的对象：

this.selected_table = this.all_tables.views[0]['A']

请看下面的例子：

all_tables = {  
   "views":[  
      {  
         "A":[  
            {  
               "id":"a",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"a2",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ],
         "B":[  
            {  
               "id":"b",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"b2",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ],
         "C":[  
            {  
               "id":"c",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            },
            {  
               "id":"c2",
               "username":"",
               "status":"",
               "location":"",
               "positionen":[  
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  },
                  {  
                     "field1":"",
                     "field2":"",
                     "field3":""
                  }
               ]
            }
         ]
      }
   ]
};

console.log(all_tables.views[0]['A']);
console.log(all_tables.views[0]['C']);

【讨论】：

谢谢，你的解释对我帮助很大:)
这只有在您知道要查找的视图是数组中的第一项时才有效。

【解决方案2】：

.find(x => x)

将返回数组中第一个为真值的元素，任何非真值、false、0、''、未定义或 null。

不确定我是否完全遵循您的问题，但您是否希望找到包含 A 属性的视图然后返回该属性？

const getProp = (views, prop) => {
  const view = views.find(v => v[prop]);
  //Will return the first view that has a property called prop
  return view && view[prop]; // If it found one return the property
};

然后就可以使用了

const prop = getProp(views, 'A');

【讨论】：