javascript - 从数组中删除所有没有子元素的元素

标签 javascript jquery json recursion underscore.js

<分区>

我以扁平树的形式从服务器获取数据。然后我将构建树的数据 JsTree 库传输给我。 在传输数据 JsTree 之前,我过滤数据并删除 folder 类型的没有子元素的空元素。

这是我得到的一些代码:

dataFilter: function (jsonString) {
  function getItemList(item, list) {
    if (item === null) {
      return null;
    }
    if (item.parent === "#" && item.type !== "folder") {
      return item;
    } else {
      if (item.type === "folder") {
        var itemFolder = _.findWhere(list, { parent: item.id });
        if (itemFolder) {
          return item;
        }
      } else {
        return item;
      }
    }
    return null;
  };
  function removeEmptyFolder(list) {
    console.log(list);
    var treeListTemp = [];
    for (var i = 0; i < list.length; i++) {
      treeListTemp.push(getItemList(list[i], list));
    }
    var treeList = [];
    for (var j = 0; j < treeListTemp.length; j++) {
      var k = getItemList(treeListTemp[j], treeListTemp);
      if (k === null) {
        removeEmptyFolder(_.filter(treeListTemp,
                                   function(item) {
          return item !== null;
        }));
      } else {
        treeList.push(k);
      }
    }
    //console.log(treeList);
    return treeList;
  };
  return JSON.stringify(_.filter(removeEmptyFolder(JSON.parse(jsonString)),
                                 function (item) {
    return item !== null;
  }));
}

这是一个工作示例 https://jsfiddle.net/nkqgot2a/11/

这段代码几乎可以正常工作。但是,如果最后一个元素包含一个子元素,则它不会从列表中删除。数据过滤后,元素“folder 9”不应出现在列表中。

请告诉我如何修复我的函数以便删除所有空文件夹?

到目前为止,在我看来,递归是由过多的时间引起的。

最佳答案

检查我对它做了很多修改

var data = [{
    "id": "15",
    "parent": "#",
    "title": "folder 1",
    "type": "folder"
}, {
    "id": "16",
    "parent": "15",
    "title": "file 2",
    "type": "file"
}, {
    "id": "21",
    "parent": "25",
    "title": "file 6",
    "type": "file"
}, {
    "id": "25",
    "parent": "15",
    "title": "folder 10",
    "type": "folder"
}, {
    "id": "33",
    "parent": "#",
    "title": "folder 3",
    "type": "folder"
}, {
    "id": "34",
    "parent": "33",
    "title": "folder 4",
    "type": "folder"
}, {
    "id": "35",
    "parent": "25",
    "title": "file 5",
    "type": "file"
}, {
    "id": "36",
    "parent": "#",
    "title": "file 7",
    "type": "file"
}, {
    "id": "37",
    "parent": "#",
    "title": "folder 8",
    "type": "folder"
}, {
    "id": "38",
    "parent": "#",
    "title": "folder 9",
    "type": "folder"
}, {
    "id": "39",
    "parent": "40",
    "title": "folder 11",
    "type": "folder"
}, {
    "id": "40",
    "parent": "38",
    "title": "folder 12",
    "type": "folder"
}];

function dataFilter(jsonString) {
    function getItemList(item, list) {
        if (item) {
            if (item.type === "folder") {
                var itemFolder = _.findWhere(list, {
                    parent: item.id
                });
                if (itemFolder) {
                    return item;
                }
            } else {
                return item;
            }
        }
        return null;
    };

    function removeEmptyFolder(list) {
        var tempItem = null;
        var i;
        for (i = 0; i < list.length; i++) {
            tempItem = getItemList(list[i], list);
            if (tempItem == null) {
                break;
            }
        }
        if (tempItem == null) {
            if (_.size(list) > 0) {
                list.splice(i, 1);
                removeEmptyFolder(list);
            }
        }
        return list;
    };
    return removeEmptyFolder(jsonString);
}


$(document).ready(function() {
    var $beforelist = $('#before_json');
    $.each(data, function() {
        $('<li>' + this.title + '</li>').appendTo($beforelist);
    });
    var $afterlist = $('#after_json');
    $.each(dataFilter(data), function() {
        $('<li>' + this.title + '</li>').appendTo($afterlist);
    });
});
<pre id="before_json"></pre>
<p>After:</p>
<pre id="after_json"></pre>


<script src="https://code.jquery.com/jquery-3.1.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.3/underscore-min.js"></script>

关于javascript - 从数组中删除所有没有子元素的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40543325/

相关文章:

javascript - 如何获得刷新 token ?

javascript - 为页面添加边距,包括绝对/固定定位元素

javascript - 使用 Javascript/jQuery 在表格中随机播放 <td>

javascript - 序列化表单并将 ajax 发布到函数

android - Gson:反序列化可以是单个对象或数组的对象

javascript - Bootstrap 3 - 使用 json 加载表中的链接

Javascript 检查空格

javascript - 为什么这些符号链接(symbolic link)会发生无限递归循环

javascript - jQuery parseJSON 不保持 json 键的顺序

java - 如何使用 Jackson 将 JSON 数组序列化为编号/索引 JSON?