我也遇到了同样的问题，但是lodash模块在处理嵌套属性时受到了限制。我按照递归后代解析器的思想编写了一个更通用的解决方案。该解决方案适用于以下要点:

递归下降对象解引用

您可以使用括号符号动态访问对象的属性。这看起来像obj[yourKey]，然而JavaScript对象并不是为动态更新或读取而设计的。它们打算在初始化时定义。

如果你想动态分配和访问键值对，你应该使用映射。

const yourKey = 'yourKey'; //初始化它的值 const map1 = new Map([ (“yourKey”、“yourValue”) ]); //初始化为空，然后动态赋值 const map2 = new Map(); map2。集(yourKey yourValue); console.log (map1.get (yourKey)); console.log (map2.get (yourKey));

这是我的解决方案:

function resolve(path, obj) {
    return path.split('.').reduce(function(prev, curr) {
        return prev ? prev[curr] : null
    }, obj || self)
}

使用例子:

resolve("document.body.style.width")
// or
resolve("style.width", document.body)
// or even use array indexes
// (someObject has been defined in the question)
resolve("part.0.size", someObject) 
// returns null when intermediate properties are not defined:
resolve('properties.that.do.not.exist', {hello:'world'})

要动态访问属性，只需使用方括号[]，如下所示:

const something = {bar: "Foobar!"}; const userInput = 'bar'; console.log ([userInput])

这个问题

这个解决方案有个大问题!(我很惊讶其他答案还没有提到这一点)。通常你只想访问你自己放在对象上的属性，你不想获取继承的属性。

这里有一个关于这个问题的例子。这里我们有一个看似无辜的程序，但它有一个微妙的错误-你能发现它吗?

const agesOfUsers = {sam: 16, sally: 22} const username = prompt('输入用户名:') if (agesOfUsers[username] !== undefined) { console.log(' ${username}是${agesOfUsers[username]}年') }其他{ Console.log (' ${username}未找到') ｝

当提示输入用户名时，如果你提供“toString”作为用户名，它会给你以下消息:“toString is function toString(){[原生代码]}years old”。问题是agesOfUsers是一个对象，因此会自动从基object类继承某些属性，如. tostring()。您可以在这里查找所有对象继承的属性的完整列表。

解决方案

请使用Map数据结构。映射的存储内容不会受到原型问题的影响，因此它们为这个问题提供了一个干净的解决方案。

const agesOfUsers = new Map() agesOfUsers。设置(“山姆”,16) agesOfUsers。设置(“莎莉”,2) console.log(agesOfUsers.get('sam')) // 16

使用具有空原型的对象，而不是默认原型。你可以使用object. create(null)来创建这样一个对象。这种类型的对象不会受到这些原型问题的影响，因为您已经显式地创建了它，它不会继承任何东西。

const agesOfUsers = Object.create(null) agesOfUsers。山姆= 16 agesOfUsers。莎莉= 22; console.log(agesOfUsers['sam']) // 16 console.log(agesOfUsers['toString']) // undefined - toString没有被继承

You can use Object.hasOwn(yourObj, attrName) to first check if the dynamic key you wish to access is directly on the object and not inherited (learn more here). This is a relatively newer feature, so check the compatibility tables before dropping it into your code. Before Object.hasOwn(yourObj, attrName) came around, you would achieve this same effect via Object.prototype.hasOwnProperty.call(yourObj, attrName). Sometimes, you might see code using yourObj.hasOwnProperty(attrName) too, which sometimes works but it has some pitfalls that you can read about here.

//尝试输入属性名"toString" //你会看到它被正确处理。 Const user = {name: 'sam'，年龄:16} const propName = prompt('输入属性名:') 如果对象。hasOwn(user, propName)) { console.log(' ${propName} = ${user[propName]} ') }其他{ console.log(' ${propName}未找到') ｝

如果你知道你试图使用的键永远不会是一个继承属性的名称(例如，可能它们是数字，或者它们都有相同的前缀，等等)，你可以选择使用原始的解决方案。

我问了一个类似于这个主题的问题，经过大量的研究，看到了很多应该在这里丢失的信息，我觉得我有一些有价值的东西可以添加到这篇旧文章中。

首先，我想说明有几种方法来获取属性的值并将其存储在动态变量中。第一个最受欢迎，也是最简单的方法是:

let properyValue = element.style['enter-a-property'];

然而，我很少走这条路，因为它不工作的属性值通过样式表分配。为了给您一个示例，我将使用一些伪代码进行演示。

 let elem = document.getElementById('someDiv');
 let cssProp = elem.style['width'];

Using the code example above; if the width property of the div element that was stored in the 'elem' variable was styled in a CSS style-sheet, and not styled inside of its HTML tag, you are without a doubt going to get a return value of undefined stored inside of the cssProp variable. The undefined value occurs because in-order to get the correct value, the code written inside a CSS Style-Sheet needs to be computed in-order to get the value, therefore; you must use a method that will compute the value of the property who's value lies within the style-sheet.

因此，getComputedStyle()方法!

function getCssProp(){
  let ele = document.getElementById("test");
  let cssProp = window.getComputedStyle(ele,null).getPropertyValue("width");
}

这提供了一个很好的例子，并让您可以使用它，然而，这个链接Mozilla CSS getComputedValue文档详细讨论了getComputedValue函数，任何有抱负的开发人员如果对这个主题不完全清楚，都应该阅读。

顺便说一句，getComputedValue方法只获取，不设置。这显然是一个主要的缺点，但是有一个方法可以从CSS样式表中获取，以及设置值，尽管它不是标准的Javascript。 JQuery方法…

$(selector).css(property,value)

.．.是get，是set。这就是我所使用的，唯一的缺点是你必须了解JQuery，但这是每个Javascript开发人员都应该学习JQuery的许多很好的理由之一，它只是让生活变得简单，并提供了一些方法，就像这个，这在标准Javascript中是不可用的。 希望这能帮助到一些人!!

更新

使用obj[variable]可以很容易地访问对象中的根属性，但是使用嵌套会使事情变得复杂。为了不编写已经编写好的代码，我建议使用lodash.get。

例子

// Accessing root property
var rootProp = 'rootPropert';
_.get(object, rootProp, defaultValue);

// Accessing nested property
var listOfNestedProperties = [var1, var2];
_.get(object, listOfNestedProperties);

Lodash get可以以不同的方式使用，文档Lodash .get