根据匹配值从另一个数组中获取一个新数组答案

【问题标题】：Getting a new array from another array based on matching value根据匹配值从另一个数组中获取一个新数组
【发布时间】：2020-11-23 12:15:30
【问题描述】：

我有一个包含数千个对象的数组，需要检查其中一个值是否包含特定值。

我的数组：

const images = [
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["pink", "yellow", "red"],
  },
  {
    "name" : "old car",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark purple", "sand", "light green"],
  },
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark blue", "violet"],
  },
...
]

我正在尝试获取一个新数组，该数组仅包含那些包含特定颜色的对象。此外，该值必须是完美匹配：即如果我通过“蓝色”，如果它检查“深蓝色”，它应该返回 false

我正在尝试执行以下操作但遇到错误

const checkColourtHandler = async (selectedColour) => {
   const imageList = images.filter(function (item, i) {
        if (item.colours.includes(selectedColour)) {
          return true;
        } else return false;
   });
   console.log(imageList);
}

理想情况下，我也在寻找性能最佳的方法。

【问题讨论】：

标签： javascript arrays multidimensional-array array-map array-filter

【解决方案1】：

使用filter 和includes 方法检查匹配的元素：

const images = [
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["pink", "yellow", "red"],
  },
  {
    "name" : "old car",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark purple", "sand", "light green"],
  },
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark blue", "violet"],
  }
];

const filtered = (col) => images.filter(i => i.colours.includes(col));

const output = filtered('dark blue');

console.log(output);
console.log(filtered('blue'));

【讨论】：

感谢@DigitalDrifter，它看起来正在工作，但它返回一个函数。实际上，我正在尝试将数组作为最终结果，以便将其保存并在其他地方使用。
它在哪里返回一个函数？我只是将filtered 定义为一个函数并使用所需的颜色字符串调用它：filtered('dark blue');。当然，这可以根据您的实施需求进行更改。
好吧，我需要在某处获取并保存该函数的数组结果。所以我看到它有两个步骤：运行函数并将结果保存在其他变量中，以便我可以访问它并在其他地方使用它。
我更新了答案。您现在会看到 const output = filtered('dark blue');，因此您可以稍后在代码中引用 output 数组。
由于某种原因，这对我不起作用。我有 const output = filters('dark blue');在另一个函数中和过滤（）分开，我得到未处理的承诺拒绝：TypeError：未定义不是对象（评估'i.colours.includes'

【解决方案2】：

应该这样做

const images = [
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["pink", "yellow", "red"],
  },
  {
    "name" : "old car",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark purple", "sand", "light green"],
  },
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark blue", "violet"],
  }
];

const checkColourtHandler = (selectedColour) => images.filter(item => item.colours.includes(selectedColour));

console.log(checkColourtHandler("sand"));
console.log(checkColourtHandler("violet"));

【讨论】：

【解决方案3】：

@DigitalDrifter

在这里更新我的代码

const images = [
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["pink", "yellow", "red"],
  },
  {
    "name" : "old car",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark purple", "sand", "light green"],
  },
  {
    "name" : "sky",
    "width" : "90",
    "height" : "150",
    "colours" : ["dark blue", "violet"],
  }
];

const filtered = (col) => images.filter(i => i.colours.includes(col));

const checkColourtHandler = (selectedColour) => {
    const result = filtered(selectedColour); 
    console.log("result: ",result);
  }

checkColourtHandler('pink');

【讨论】：

找到问题，我的代码中的另一个错误导致了冲突。非常感谢您的帮助！