递归地添加和删除javascript对象中的值

Question

因此，我正在使用来自API的数据在React中构建基本方面搜索，但我正在努力添加和删除发送回服务器的有效负载中的值。有效负载对象可以包含数组，对象和字符串。所以说我有一个如下所示的有效载荷结构：

payload = {
   search_query: ""
   topic: [],
   genre: [],
   rating: "",
   type: {}
}

使用deepmerge我能够将多个值传递回工作正常的API，因此示例有效负载将是......

payload = {
   search_query: "Luther"
   topic: ["9832748273", "4823794872394"],
   genre: ["3827487483", "3287483274873"],
   rating: "18",
   type: {
     args: {
       when: "today",
       min: 15
     },
     name: "spot"
   }
}

到目前为止一切顺利，我得到了预期的结果。现在我在facet上进行切换以将其从有效负载中移除，有效负载将值发送回函数以从有效负载中移除。例如：

清除搜索，删除值=“Luther” 切换主题，删除值=“9832748273” 切换类型，删除值=“3827487483” 切换评级，删除值=“18” 切换类型，要删除的值= { args: { when: "today", min: 15}, name: "spot"}

搜索和评级将返回空字符串，主题和流派将从数组中删除项目，类型将返回一个空对象。

这适用于删除数组值，但感觉很脏，我想要一个干净的方式来处理所有类型！

const removeObjValue = (obj, filterValue) => {
  Object.entries(obj).forEach(([key, value]) => {
    Object.entries(value).forEach(([subKey, subValue]) => {
      if(subvalue === filterValue) {
        if(Array.isArray(value)) {
          const index = value.indexOf(subvalue);
          if (index > -1) {
            value.splice(index, 1);
          }
        }
      }
    });
  });
  return obj;
}

Answer 1

我只是使用delete关键字来删除对象属性，就像这样

if (payload[key]) {
 if (payload[key] instanceof Array) {
    var idx = payload[key].indexOf(value);
  if (idx > -1) payload[key].splice(idx, 1);
 } else {
    delete payload[key];
 }
}

code example