Javascript 遍历特定的嵌套对象键

发布于08月06日

有一个类似以下对象的对象:

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

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

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

因此，通过迭代上面给出的路径得到的结果应该输出以下三个对象:

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

我try 使用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()
}

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

推荐答案

下面是一个执行此操作的递归函数.我把这个例子做得特别深，以表明它对深度嵌套是健壮的.

最后一个棘手的部分是，如果路径以变量名称开头，则应该只得到undefined.您无法获得引用传递给函数的对象的变量的名称，因此您可以添加一个布尔参数，将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)