javascript - 使用键空白值过滤对象的 JavaScript 数组

Question

我有一个 HTML 表单，其中不同的输入文本框绑定(bind)到一个 AngularJS 搜索对象，即，

<input ng-model="search.state_prov">State</input>
<input ng-model="search.zip">Zip</input>
<input ng-model="search.country"></input>

我有很多对象，例如:

places = [{name: place1, state_prov: MO, zip: 63101, country: US},
   {name: place2, state_prov: CA, zip: 90210, country: US},
   {name: place3, state_prov: AB, zip: T0A, country: CA}
   {name: place4, state_prov: CA, zip: 90001, country: US}
]

我正在尝试根据表单中输入的内容过滤此数组(搜索)。初始化表单时，“搜索”对象为空。一旦用户开始在文本框中键入内容，比如 state_prov，搜索对象就会为 search.state_prov 获取一个新键，其值为框中键入的任何值。

然后我可以在 places 数组中搜索匹配项，我已经能够使用这个 array.filter() 原型(prototype)来做到这一点:

var result = places.filter(searchQuery, query);

function searchQuery(place){
   return Object.keys(this).every((key) => place[key] === this[key]);
}

我的问题是，如果用户填写了两个文本框，然后清除了其中一个，希望仅通过仍然包含数据的文本框进行搜索，“搜索”对象仍然会有一个用于删除输入的键一个空字符串的值。

 search = {state_prov: "CA", zip: ""}

过滤器将尝试将数组中的对象与空字符串匹配，而我宁愿完全忽略该键并仅搜索具有与之关联的值的键。我怎样才能到达这最后一步？

Answer 1

您可以检查该键的值是否不为空:

function searchQuery(place){
   return Object.keys(this).every((key) => place[key] === this[key] && this[key]);
}

因为 ""、0、null 和 undefined 的计算结果为 false。