JavaScript：转换字符串并将其连接起来以动态创建对象属性引用

Question

我正在创建一个API，其中服务器通过data属性传递值，因此JS可以用来检索信息...我的JS进行AJAX调用并返回JSON对象...

{
    "data": {
        "results": {
            "type": [
                {
                    "cars" : {
                        "brands": {
                            "ford" : {},
                            "honda" : {}
                        }
                    }
                }
            ]
        }
    }
}

为了获得品牌，我只要输入

let brand = data.result.type[0].cars.brands.ford

这样，我可以获得所需的结果，但是我需要通过连接路径的2个部分来动态构建此路径。 就像我在问题开头所说的那样，一些信息是通过data属性传递的，信息是type[0].cars.brands.ford ...我需要在我的代码data.result其加入data.result中。 我现在可以通过使用eval()来获得所需的结果，像这样

entry.querySelectorAll('[data-brand]').forEach((e) =>
    let brand = eval('data.result.' + e.dataset.brand);
)

我知道你们中的许多人都会说使用eval()不好，我对此非常了解，但是我只是找不到更好的方法来实现这一目标，还有另一个问题，那就是品牌，例如， nissan不在JSON上，我收到一个错误TypeError: Cannot read property 'nissan' of undefined ...在继续代码之前，可以通过检查属性是否存在来避免这种情况，但是我不知道该怎么做涉及eval()时进行这种测试。

所以...基本上，我需要的是一种动态构建属性路径的更好方法，可以对其进行测试以查看属性是否存在...

提前致谢...

Answer 1

const brand = e.dataset.brand.split(".").reduce((obj,id) => obj[id] || {}, data.results);

这确实会支撑支架，所以：

type.0.whatever.keys

要为不存在的键（而不是空对象）返回undefined：

const brand = e.dataset.brand.split(".").reduce((obj,id) => (obj || {} )[id], data.results);

Answer 2

您可以先检查data.result是否具有该属性，然后才能设置变量品牌：

if(data.result.hasOwnProperty(e.dataset.brand)){
    let brand = data.result[e.dataset.brand];
}

Answer 3

您可以使用String＃match查找所有键，然后使用Array＃reduce迭代键，并从对象获取键值：

 const obj = {"data":{"results":{"type":[{"cars":{"brands":{"ford":{"name":"ford"},"honda":{"name":"honda"}}}}]}}}; const brand = 'data.results.type[0].cars.brands.ford'; const getPathValue = (src, path) => path.match(/[^.\\[\\]]+/g) .reduce((p, k) => typeof p === 'object' ? p[k] : p, src); const brandOBj = getPathValue(obj, brand); console.log(brandOBj); 

Answer 4

您可以检查lodash get方法，该方法允许您使用路径访问对象的值。

如果lodash对您来说太大了，请查看其实现。