javascript - 遍历特定的嵌套对象键

Question

有一个对象如下:

props = {
  any: 'thing',
  intro: { content: 'foo' }
}

现在我想遍历表示特定路径(props.intro.content)的给定字符串，以将最深的值设置为undefined :

props.intro.content = undefined
props.intro = undefined
props = undefined

所以通过上面给出的路径迭代的结果应该输出这三个对象:

{
  any: 'thing',
  intro: { content: undefined }
},
{
  any: 'thing',
  intro: undefined
},
undefined

我尝试使用 split 和 for 循环

const array = 'props.intro.content'.split('.')

for (let index = array.length - 1; index > -1; index--) {
  console.log([array.join('.')]) // this returns the flatten path
  array.pop()
}

但这并不处理对象本身，所以我没有得到正确的对象作为输出。

Answer 1

这是一个执行此操作的递归函数。我把这个例子加深了，以表明它对深层嵌套很稳健。

一个棘手的部分是最后一个，如果路径以变量名称开头，您应该得到undefined。您无法获取引用传递给函数的对象的变量的名称，因此也许您可以添加一个 bool 参数，将 undefined 推到数组的末尾，并让字符串输入开始在第一个关键层。

const object = {
  any: 'thing',
  intro: { 
    content: {
      lets: {
        go: {
          deeper: 20
        }
      }
    } 
  }
}

function deepDelete (mainObj, locations) {
  const props = locations.split('.')
  const outputs = [];
  
  function recurseDelete(obj, props, mainObj) {
    if (props.length === 0) return
 
    recurseDelete(obj[props[0]], props.slice(1), mainObj)
    obj[props[0]] = undefined
    outputs.push(structuredClone(mainObj))
  }
  recurseDelete(mainObj, props, mainObj);
  return outputs
}

const locations = 'intro.content.lets.go.deeper';
const outputArray = deepDelete(object, locations)
console.log(outputArray)