Question

在Typescript（和Javascript）中，您可以使用点表示法或括号表示法访问对象的属性：

object.property
object['property']

使用后者的具体示例：

const user = {
    firstName: 'John',
    lastName: 'Doe'
}
const prop = 'firstName';
console.log(user[prop]);  //"John"

我的问题是括号表示法是否/如何用于数组属性，其中括号中的值是数组的路径。这是一个例子：

const user = {
    firstName: 'John',
    lastName: 'Doe',
    nicknames: [
        { id: 1, value: 'Johnny'}, 
        { id: 2, value: 'JD'}, 
        { id: 3, value: 'Dude'}
    ]
}
const prop = 'nicknames[2].value';
console.log(user[prop]);

console.log()的目标是打印JD，但此示例会失败，因为当然没有user的属性称为nicknames[2].value; < / p>

如何以这种方式对数组属性使用括号表示法？

Answer 1

如果您不想将lodash包含在单个函数中，那么您可以考虑在提供此功能的对象上添加一个函数。

我提供了一个示例代码段，该示例可以使用您在问题中指定的prop字符串类型

const user = {
    firstName: 'John',
    lastName: 'Doe',
    nicknames: [
        { id: 1, value: 'Johnny'}, 
        { id: 2, value: 'JD'}, 
        { id: 3, value: 'Dude'}
    ],
    byProp (path) {
      return path.split(/\].|\]\[|\[|\./) // split on [] or .
                 .map( el => el.replace(/\]$/,'')) // remove any trailing ']'
                 // loop over split-string to get element
                 // return undefined if the property does not exist
                 .reduce( (obj, el) => obj? obj[el]:undefined, this);
    }
}

console.log(user.byProp('nicknames[2].value'));
console.log(user.byProp('nicknames[1][value]'));
console.log(user.byProp('firstName'));
console.log(user.byProp('firstName.undefined'));

Answer 2

基于@ JanS的建议，我能够通过以下使用lodash get()方法完成我所需要的工作：

const prop = 'nicknames[2].value';
console.log(_.get(user, prop));

数组的括号表示法属性访问器

2 个答案: