Question

React Javascript，在数组中查找未定义并跳过它

2020-12-14

349

javascript arrays find undefined

我有一个对象数组

const contentTypes = [
    {
        "contentType": {
            "content_type_id": 2,
            "content_type": "image",
        },
    },
    {
        "contentType": {
            "content_type_id": 3,
            "content_type": "video",
        },
    },
    {
        "contentType": {
            "content_type_id": 1,
            "content_type": "audio",
        },
    },
]

这是我的函数 setType ，我在其中找到任何元素并将 content_type_id 设置为 content_type 。我将值转换为字符串

const setType = (selectedType) => {
    _setType(selectedType)
    const typeString = contentTypes.find((item) => {
        return item.contentType.content_type_id === selectedType
    }).contentType.content_type;
    onTypeChange(typeString)
}

我的问题是数组 contentTypes 中还有一个元素，但没有 content_type_id 和 content_type ，所以我收到此错误

未处理的运行时错误 TypeError：无法读取未定义的属性“contentType”

这是一个 jsFiddle => https://jsfiddle.net/9x426Lv7/2/

如何在 find 方法中跳过此元素？有没有更好的方法？

Answer 1

Koala7，你可以试试这个

const setType = (selectedType) => {
    _setType(selectedType)
    let typeString = contentTypes.find((item) => {
        return item.contentType.content_type_id === selectedType
    })
    typeString = typeString ? typeString.contentType.content_type : null; // null or give it another default value
    onTypeChange(typeString)
}

Answer 2

显然您的查找函数没有获得任何值并返回未定义，请检查您尝试查找的选定类型是否真的存在

Answer 3

怎么样？

const setType = (selectedType) => {
    const typeString = contentTypes.find((item) => {
        return item.contentType.content_type_id === selectedType
    })
    if(typeString) {
     return contentType.content_type;
    }
    return null;
}