如何遍历数组并找到项目中包含的部分而不是整个项目？

Question

我正在构建一个天气应用程序，因此我需要获取与来自 API 的调用相匹配的图标。我正在使用包裹和包裹转储 dist 文件夹中的所有图像。我导入所有图像，这给了我一个对象，我将其转换为一维数组。因为 Parcel 提供了一些额外的文字，所以我无法抓取正确的图像。这是我可以看到的数组：

[0: "/01d.b9bbb2b9.svg" 1: "/01n.2290e7c6.svg" 2: "/02d.ac486e56.svg" 3: "/02n.259589cf.svg"]

<img src="${result.weather.icon}" alt="" class="weather--icon" />//I like to render it like this.

有没有一种方法可以遍历数组并只获取匹配 result.weather.icon 的图标？？？我只需要从数组中找到 01d 或 02d。

Answer 1

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter

Array.prototype.filter 允许您遍历数组并根据条件测试其值。然后它只会 return 通过该测试的值。

const array = [   "/01d.b9bbb2b9.svg", "/01n.2290e7c6.svg", "/02d.ac486e56.svg", "/02n.259589cf.svg"
];

const targetVal = '01d';

const filteredArray = array.filter(image => image.includes(targetVal)
);

Answer 2

不太清楚你在问什么 - 因为 [0: "/01d.b9bbb2b9.svg" 1: "/01n.2290e7c6.svg" 2: "/02d.ac486e56.svg" 3: "/02n.259589cf.svg"] 不是一个有效的数组。

但是，假设您的数组只是文本元素，那么您可以只使用查找。即

let data = ["/01d.b9bbb2b9.svg", "/01n.2290e7c6.svg", "/02d.ac486e56.svg", "/02n.259589cf.svg"];

let result = data.find(x => x.startsWith('/01d'));

console.log(result);

此处 find 优于 filter，因为找到 returns 从集合中匹配的第一个值。一旦匹配结果中的值，它就不会检查剩余的值。

如何遍历数组并找到项目中包含的部分而不是整个项目？

How to loop over an Array and find part that is included in the Item not the whole item?

javascript

arrays

parcel