一种在不知道属性在嵌套 js 对象中的路径的情况下访问属性的方法

Question

有没有办法在不知道其路径的情况下访问对象中的嵌套属性？ 例如，我可以有这样的东西

let test1 = {
location: {
state: {
className: 'myCalss'
}
}
};
let test2 = {
params: {
className: 'myCalss'
}
};

有没有巧妙的方法来"提取"className财产？ 我有一个解决方案，但它非常丑陋，它只解释了这两种情况，我想知道我是否可以做更灵活的事情

Answer 1

下面是创建嵌套属性getter的一种优雅方法：

const getProperty = property => {
const getter = o => {
if (o && typeof o === 'object') {
return Object.entries(o)
.map(([key, value]) => key === property ? value : getter(value))
.filter(Boolean)
.shift()
}
}
return getter
}
const test1 = {
location: {
state: {
className: 'test1'
}
}
}
const test2 = {
params: {
className: 'test2'
}
}
const test3 = {}
const getClassName = getProperty('className')
console.log(getClassName(test1))
console.log(getClassName(test2))
console.log(getClassName(test3))

如果你想防止循环对象导致堆栈溢出，我建议使用WeakSet来跟踪迭代的对象引用：

const getProperty = property => {
const getter = (o, ws = new WeakSet()) => {
if (o && typeof o === 'object' && !ws.has(o)) {
ws.add(o)
return Object.entries(o)
.map(([key, value]) => key === property ? value : getter(value, ws))
.filter(Boolean)
.shift()
}
}
return getter
}
const test1 = {
location: {
state: {
className: 'test1'
}
}
}
const test2 = {
params: {
className: 'test2'
}
}
const test3 = {}
const test4 = {
a: {
b: {}
}
}
test4.a.self = test4
test4.a.b.self = test4
test4.a.b.className = 'test4'
const getClassName = getProperty('className')
console.log(getClassName(test1))
console.log(getClassName(test2))
console.log(getClassName(test3))
console.log(getClassName(test4))

Answer 2

当然。试一试。它递归迭代对象并返回第一个匹配项。您可以根据需要配置for循环以匹配所有或最后一个

let test1 = {
location: {
state: {
className: 'myCalss'
}
}
};
let test2 = {
params: {
className: 'myCalss'
}
};
function getClassName(obj) {
if(typeof obj === "object" && 'className' in obj) {
return obj.className
}
const keys = Object.keys(obj)
for(let i = 0; i < keys.length; i++) {
let key = keys[i]
let res = getClassName(obj[key])
if(res) return res
}
return null
}
console.log(getClassName(test1), getClassName(test2))