Question

我有一个包含不同对象列表的数组，我希望能够重用相同的函数来过滤同一数组中的不同对象和值。

我的数组

cocktailList = [
  Object {
    "abv": "24",
    "alcoholic": "true",
    "strength": "medium",
    "type": Object {
      "key": 3,
      "label": "Medium",
      "value": "medium",
    ...,
    ...,
    },
  },
  Object {
    ...
  },
]

我正在调用一个函数来过滤传递2个参数的数组：

我要过滤的字段
应过滤的值

这是我的功能和调用者

const drinkTypeHandler = (field, value) => {       
    const selectedType = cocktailList.filter((cocktail) => cocktail.field === value);
    console.log(selectedType); 
}

onPress={() => drinkTypeHandler(item.field, item.value)}

该函数可以很好地拾取“值”参数，但未使用我传递的“字段”参数。我尝试将其作为动态参数传递，如下所示，但仍然没有成功

cocktailList.filter((cocktail) => `cocktail.${field} === ${value}`)

如果我对字段值进行硬编码，它将起作用

i.e.
cocktailList.filter((cocktail) => cocktail.type.value === value)

Answer 1

要使用动态字段名称，必须使用方括号。因此，您将使用：

cocktailList.filter((cocktail) => cocktail[field] === value)

您将要遇到的问题是type下的嵌套键/值对，因为您不能使用带有该符号的type.value之类的东西。

Answer 2

您可以使用cocktail[field]来做到这一点：

const drinkTypeHandler = (field, value) => {       
    const selectedType = cocktailList.filter((cocktail) => cocktail[field] === value);
    console.log(selectedType); 
}

Answer 3

为了使用变量访问对象属性，您需要使用点表示法

const drinkTypeHandler = (field, value) => {       
    const selectedType = cocktailList.filter((cocktail) => cocktail[field] === value);
    console.log(selectedType); 
}

您可以阅读有关bracket and dot notation here

的更多信息

根据JS中的动态对象和值过滤数组

3 个答案: