从 Javascript 中的对象中删除空白属性

Question

如何删除 JavaScript 对象中所有 undefined 或为 null 的属性？

（ 问题 与数组类似）

原文由 abhijit 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以遍历对象：

 var test = {
 test1: null,
 test2: 'somestring',
 test3: 3,
 }

 function clean(obj) {
 for (var propName in obj) {
 if (obj[propName] === null || obj[propName] === undefined) {
 delete obj[propName];
 }
 }
 return obj
 }

 console.log(test);
 console.log(clean(test));

如果您担心此属性删除不会运行对象的 proptype 链，您还可以：

 function clean(obj) {
 var propNames = Object.getOwnPropertyNames(obj);
 for (var i = 0; i < propNames.length; i++) {
 var propName = propNames[i];
 if (obj[propName] === null || obj[propName] === undefined) {
 delete obj[propName];
 }
 }
 }

关于 null 与 undefined 的一些注意事项：

 test.test1 === null; // true
 test.test1 == null; // true

 test.notaprop === null; // false
 test.notaprop == null; // true

 test.notaprop === undefined; // true
 test.notaprop == undefined; // true

原文由 Owen 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

ES10/ES2019 示例

一个简单的单行代码（返回一个新对象）。

 let o = Object.fromEntries(Object.entries(obj).filter(([_, v]) => v != null));

与上面相同，但写成一个函数。

 function removeEmpty(obj) {
  return Object.fromEntries(Object.entries(obj).filter(([_, v]) => v != null));
}

此函数使用 递归 从嵌套对象中删除项目。

 function removeEmpty(obj) {
  return Object.fromEntries(
    Object.entries(obj)
      .filter(([_, v]) => v != null)
      .map(([k, v]) => [k, v === Object(v) ? removeEmpty(v) : v])
  );
}

ES6/ES2015 示例

一个简单的单线。警告：这会改变给定的对象而不是返回一个新对象。

 Object.keys(obj).forEach((k) => obj[k] == null && delete obj[k]);

单个声明（不改变给定的对象）。

 let o = Object.keys(obj)
  .filter((k) => obj[k] != null)
  .reduce((a, k) => ({ ...a, [k]: obj[k] }), {});

与上面相同，但写成一个函数。

 function removeEmpty(obj) {
  return Object.entries(obj)
    .filter(([_, v]) => v != null)
    .reduce((acc, [k, v]) => ({ ...acc, [k]: v }), {});
}

此函数使用递归从嵌套对象中删除项目。

 function removeEmpty(obj) {
  return Object.entries(obj)
    .filter(([_, v]) => v != null)
    .reduce(
      (acc, [k, v]) => ({ ...acc, [k]: v === Object(v) ? removeEmpty(v) : v }),
      {}
    );
}

与上面的函数相同，但以命令式（非函数式）风格编写。

 function removeEmpty(obj) {
  const newObj = {};
  Object.entries(obj).forEach(([k, v]) => {
    if (v === Object(v)) {
      newObj[k] = removeEmpty(v);
    } else if (v != null) {
      newObj[k] = obj[k];
    }
  });
  return newObj;
}

ES5/ES2009 示例

在过去，事情要冗长得多。

这是一个以函数式风格编写的非递归版本。

 function removeEmpty(obj) {
  return Object.keys(obj)
    .filter(function (k) {
      return obj[k] != null;
    })
    .reduce(function (acc, k) {
      acc[k] = obj[k];
      return acc;
    }, {});
}

这是一个以命令式风格编写的非递归版本。

 function removeEmpty(obj) {
  const newObj = {};
  Object.keys(obj).forEach(function (k) {
    if (obj[k] && typeof obj[k] === "object") {
      newObj[k] = removeEmpty(obj[k]);
    } else if (obj[k] != null) {
      newObj[k] = obj[k];
    }
  });
  return newObj;
}

以及以函数式风格编写的递归版本。

 function removeEmpty(obj) {
  return Object.keys(obj)
    .filter(function (k) {
      return obj[k] != null;
    })
    .reduce(function (acc, k) {
      acc[k] = typeof obj[k] === "object" ? removeEmpty(obj[k]) : obj[k];
      return acc;
    }, {});
}

原文由 Rotareti 发布，翻译遵循 CC BY-SA 4.0 许可协议