从找到匹配的数组中删除对象时遇到问题答案

【问题标题】：Having issues with deleting object from an array where match is found从找到匹配的数组中删除对象时遇到问题
【发布时间】：2022-01-11 00:53:32
【问题描述】：

我有一个从数组中删除对象的跟随函数。它还返回不包含已删除项目的数组树。我的问题是，当我的 objToFindBy 为 null 时，它会起作用，删除找到 {group: null} 的所有内容，但是如果我设置 objToFindBy {group: 'some string'}

，它会因承诺拒绝而出错

此代码应删除 objToFindBy 匹配的所有匹配项，例如 {group: null} 将在组为 null 的任何地方找到并删除所有对象，然后返回没有被删除对象的完整树

findAndDeleteAll(tree, 'items', {group: null}) // work and delete all where match. then returns the tree without deleted objects

findAndDeleteAll(tree, 'items', {group: 'd575c91f-4765-4073-a948-5e305116610c'}) // promise rejection

const tree ={
    "type": "app",
    "info": "Custom Layout",
    "items": [
      {
        "id": "d575c91f-4765-4073-a948-5e305116610c",
        "title": "Fc",
        "group": null
      },
      {
        "id": "890d5a1e-3f03-42cd-a695-64a17b6b9bea",
        "title": null,
        "group": null
      },
      {
        "id": "cbe00537-0bb8-4837-8019-de48cb04edd6",
        "title": null,
        "group": "d575c91f-4765-4073-a948-5e305116610c",
      },
      {
        "id": "b8751c32-2121-4907-a229-95e3e49bcb39",
        "title": null,
        "group": "d575c91f-4765-4073-a948-5e305116610c"
      }
    ],
    "Children": []
  }

var findAndDeleteAll = function findAndDeleteAll(tree, childrenKey, objToFindBy) {
      var treeModified = false;
      var findKeys = Object.keys(objToFindBy);
      var findSuccess = false;
      findKeys.forEach(function (key) {
        (0, _lodash2.default)(tree[key], objToFindBy[key]) ? findSuccess = true : findSuccess = false;
      });
      if (findSuccess) {
        Object.keys(tree).forEach(function (key) {
          return delete tree[key];
        });
        return tree;
      }
      function innerFunc(tree, childrenKey, objToFindBy) {
        if (tree[childrenKey]) {
          var _loop = function _loop(index) {
            var findKeys = Object.keys(objToFindBy);
            var findSuccess = false;
            findKeys.forEach(function (key) {
              (0, _lodash2.default)(tree[childrenKey][index][key], objToFindBy[key]) ? findSuccess = true : findSuccess = false;
            });
            if (findSuccess) {
              tree[childrenKey].splice(index, 1);
              treeModified = true;
            }
            if (tree[childrenKey][index].hasOwnProperty(childrenKey)) {
              innerFunc(tree[childrenKey][index], childrenKey, objToFindBy);
            }
          };
    
          for (var index = tree[childrenKey].length - 1; index >= 0; index--) {
            _loop(index);
          }
        }
      }
      innerFunc(tree, childrenKey, objToFindBy);
      return treeModified ? tree : false;
    };

【问题讨论】：

如果您发送的不是多余的tree，而是findAndDeleteAll(tree.items, "group", null);，您的函数会更简单、可重用、更好。考虑一下。

标签： javascript arrays object

【解决方案1】：

更短的解决方案怎么样？

const findAndDeleteAll = (tree, childrenKey, nestedKey, nestedValue) => {
  return{...tree, [childrenKey]: tree[childrenKey].filter((row) => {
    return row[nestedKey] !== nestedValue;
  })}
}
const a = findAndDeleteAll(tree, 'items', 'group', null) // work and delete all where match. then returns the tree without deleted objects

const b = findAndDeleteAll(tree, 'items', 'group', 'd575c91f-4765-4073-a948-5e305116610c') // promise rejection

console.warn(a);
console.warn(b);

【讨论】：

此解决方案适用于深层嵌套对象还是仅适用于浅层对象
目前它不是很深，但您可以使用相同的概念对其进行修改。

【解决方案2】：

如果您发送的不是多余的tree，而是deleteFrom(tree.items, "group", null);，那么您的功能会更简单、可重用、更好。考虑一下。

const deleteFrom = (arr, pr, val) => arr.filter(ob => ob[pr] !== val);

const tree = {
  type: "app",
  info: "Custom Layout",
  items: [
    { id: "10c", title: "Fc", group: null  },
    { id: "bea", title: null, group: null  },
    { id: "dd6", title: null, group: "10c" },
    { id: "b39", title: null, group: "10c" },
  ],
  Children: []
};

const items = deleteFrom(tree.items, "group", null);

console.log(items); // Only the filtered items array

const newTree = {...tree, items};

console.log(newTree); // Your brand new tree!

【讨论】：