如何根据键/值从对象中递归删除属性

Question

我正在尝试根据对象的“大小”键的值是否为 0 来删除对象的某些子项。
我正在使用 npm 包 directory-tree 来获取代表选定目录的 javascript 对象。

对象看起来像这样：

{
  "path": "directory",
  "name": "directory",
  "children": [
    {
      "path": "directory\\file1.html",
      "name": "file1.html",
      "size": 147,
      "extension": ".html",
      "type": "file"
    },
    {
      "path": "directory\\file2.htm",
      "name": "file2.htm",
      "size": 147,
      "extension": ".htm",
      "type": "file"
    },
    {
      "path": "directory\\file3.php",
      "name": "file3.php",
      "size": 147,
      "extension": ".php",
      "type": "file"
    },
    {
      "path": "directory\\subdirectory-1",
      "name": "subdirectory-1",
      "children": [],
      "size": 0,
      "type": "directory"
    },
    {
      "path": "directory\\subdirectory-2",
      "name": "subdirectory-2",
      "children": [
        {
          "path": "directory\\subdirectory-2\\subfile1.html",
          "name": "subfile1.html",
          "size": 147,
          "extension": ".html",
          "type": "file"
        },
        {
          "path": "directory\\subdirectory-2\\subfile2.htm",
          "name": "subfile2.htm",
          "size": 147,
          "extension": ".htm",
          "type": "file"
        }
      ],
      "size": 294,
      "type": "directory"
    },
    {
      "path": "directory\\subdirectory-3",
      "name": "subdirectory-3",
      "children": [
        {
          "path": "directory\\subdirectory-3\\sub-subdirectory",
          "name": "sub-subdirectory",
          "children": [],
          "size": 0,
          "type": "directory"
        },
        {
          "path": "directory\\subdirectory-3\\subfile3.php",
          "name": "subfile3.php",
          "size": 147,
          "extension": ".php",
          "type": "file"
        },
        {
          "path": "directory\\subdirectory-3\\subfile4.html",
          "name": "subfile4.html",
          "size": 147,
          "extension": ".html",
          "type": "file"
        }
      ],
      "size": 294,
      "type": "directory"
    }
  ],
  "size": 1029,
  "type": "directory"
}

现在，我正在尝试删除每个递归大小为 0 的目录。

我尝试使用自调用函数遍历子对象：

function filterObject(obj){
  for(i=0; i<obj.children.length; i++){
    if(obj.children[i].type == "directory"){
      if(obj.children[i].size == 0){
        delete obj.children[i]
      }
      else {
        filterObject(obj.children[i])
      }
    }
  }
}

但我遇到了错误：

renderer.js:22 Uncaught TypeError: Cannot read property 'type' of undefined

当我更改代码以便检查每个子对象本身是否为对象时

if(typeof obj.children[i] === 'object' && obj.children[i].type == "directory"){...}

我造成了一些循环问题，浏览器死机（必须重新启动）。

Answer 1

您可以过滤项目并改变嵌套子级的对象。

function removeZero(o) {            
    if (o.size === 0) return false;
    if (o.children) o.children = o.children.filter(removeZero);
    return true;
}

var data = { path: "directory", name: "directory", children: [{ path: "directory\file1.html", name: "file1.html", size: 147, extension: ".html", type: "file" }, { path: "directory\file2.htm", name: "file2.htm", size: 147, extension: ".htm", type: "file" }, { path: "directory\file3.php", name: "file3.php", size: 147, extension: ".php", type: "file" }, { path: "directory\\subdirectory-1", name: "subdirectory-1", children: [], size: 0, type: "directory" }, { path: "directory\\subdirectory-2", name: "subdirectory-2", children: [{ path: "directory\\subdirectory-2\\subfile1.html", name: "subfile1.html", size: 147, extension: ".html", type: "file" }, { path: "directory\\subdirectory-2\\subfile2.htm", name: "subfile2.htm", size: 147, extension: ".htm", type: "file" }], size: 294, type: "directory" }, { path: "directory\\subdirectory-3", name: "subdirectory-3", children: [{ path: "directory\\subdirectory-3\\sub-subdirectory", name: "sub-subdirectory", children: [], size: 0, type: "directory" }, { path: "directory\\subdirectory-3\\subfile3.php", name: "subfile3.php", size: 147, extension: ".php", type: "file" }, { path: "directory\\subdirectory-3\\subfile4.html", name: "subfile4.html", size: 147, extension: ".html", type: "file" }], size: 294, type: "directory" }], size: 1029, type: "directory" };

data.children = data.children.filter(removeZero);

console.log(data);

.as-console-wrapper { max-height: 100% !important; top: 0; }