我试图使用动态名称访问对象的属性。这可能吗?

const something = { bar: "Foobar!" };
const foo = 'bar';
something.foo; // The idea is to access something.bar, getting "Foobar!"

当前回答

通过引用查找对象,字符串, 注意,确保你传递的对象是克隆的,我使用cloneDeep从lodash

如果对象看起来像

const obj = {data: ['an Object',{person: {name: {first:'nick', last:'gray'} }]

路径看起来像这样

const objectPath = ['data',1,'person',name','last']

然后调用下面的方法,它将按给定的路径返回子对象

const child = findObjectByPath(obj, objectPath)
alert( child) // alerts "last"


const findObjectByPath = (objectIn: any, path: any[]) => {
    let obj = objectIn
    for (let i = 0; i <= path.length - 1; i++) {
        const item = path[i]
        // keep going up to the next parent
        obj = obj[item] // this is by reference
    }
    return obj
}

其他回答

下面是一个ES6示例,说明如何使用通过连接两个字符串动态生成的属性名访问对象的属性。

var suffix = " name";

var person = {
    ["first" + suffix]: "Nicholas",
    ["last" + suffix]: "Zakas"
};

console.log(person["first name"]);      // "Nicholas"
console.log(person["last name"]);       // "Zakas"

这称为计算属性名

更新

使用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

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

递归下降对象解引用

我遇到过这样的情况,我想把对象属性的“地址”作为数据传递给另一个函数,并填充对象(使用AJAX),从地址数组进行查找,并在另一个函数中显示。我不能使用点表示法而不做字符串杂技,所以我认为一个数组可能是很好的传递代替。我最终做了一些不同的事情,但似乎与这篇文章有关。

这是一个类似于我想要数据的语言文件对象的示例:

const locs = {
  "audioPlayer": {
    "controls": {
      "start": "start",
      "stop": "stop"
    },
    "heading": "Use controls to start and stop audio."
  }
}

我希望能够传递一个数组,如:["audioPlayer", "controls", "stop"]来访问语言文本,在这种情况下是"stop"。

我创建了这个小函数,它查找“最不特定的”(第一个)地址参数,并将返回的对象重新分配给自己。然后它准备查找下一个最特定的地址参数(如果存在的话)。

function getText(selectionArray, obj) {
  selectionArray.forEach(key => {
    obj = obj[key];
  });
  return obj;
}

用法:

/* returns 'stop' */
console.log(getText(["audioPlayer", "controls", "stop"], locs)); 

/* returns 'use controls to start and stop audio.' */
console.log(getText(["audioPlayer", "heading"], locs)); 

您应该使用JSON。解析,看看https://www.w3schools.com/js/js_json_parse.asp

const obj = JSON.parse('{ "name":"John", "age":30, "city":"New York"}')
console.log(obj.name)
console.log(obj.age)