首页 > 解决方案 > 如何使用另一个数组获取对象数组中的值 - Javascript

问题描述

我有一个与 2 个数组交互的函数,第一个数组是一个包含我的下拉选项的对象数组,第二个数组是一个值数组。我正在尝试过滤第一个数组以返回与我的第二个数组中的值匹配的值。我如何实现这一目标?

第一个数组:

const books = [
    {
        label: "To Kill a Mockingbird",
        value: 1
    },
    {
        label: "1984",
        value: 2
    },
    {
        label: "The Lord of the Rings",
        value: 3
    },
    {
        label: "The Great Gatsby",
        value: 4
    }
]

代码片段如下:

const idString = "1,2,3";

function getSelectedOption(idString, books) {
        const ids = idString.split(",");
        const selectedOptions = [];

        ids.map(e => {
            const selected = books.map(options => {
                if (options.value === e){
                    return {
                        label: options.label,
                        value: options.value
                    }
                }
            })
            selectedOptions.push(selected)
        })

        return selectedOptions
    }

结果:

[
    [undefined, undefined, undefined, undefined],
    [undefined, undefined, undefined, undefined],
    [undefined, undefined, undefined, undefined]
]

预期结果:

[
    {
        label: "To Kill a Mockingbird",
        value: 1
    },
    {
        label: "1984",
        value: 2
    },
    {
        label: "The Lord of the Rings",
        value: 3
    }
]

标签: javascriptarrays

解决方案


假设该值是唯一的,您可以按以下方式更新代码以使它们按顺序排列。

const idString = "1,2,3";

function getSelectedOption(idString, books) {
  const ids = idString.split(",");
  return ids.map(id => books.find(book => book.value == id)).filter(Boolean)
}

如果您不关心订单或如果value不是唯一的,您还可以过滤书籍数组。

const idString = "1,2,3";

function getSelectedOption(idString, books) {
  const ids = idString.split(",");
  return books.filter(book => ids.includes(book.value.toString()))
}

请注意,这些是 O(n*m) 算法,不应该用于大型数据集,但是如果其中一个数组相对较小,您可以使用它。


推荐阅读