ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript オブジェクトから null 属性と未定義属性を効率的に削除するにはどうすればよいですか?

JavaScript オブジェクトから null 属性と未定義属性を効率的に削除するにはどうすればよいですか?

Linda Hamilton
Linda Hamiltonオリジナル
2024-12-26 00:33:10700ブラウズ

How can I efficiently remove null and undefined attributes from JavaScript objects?

JavaScript オブジェクトから空白の属性を削除する

データ オブジェクトを扱う場合、多くの場合、定義されていない属性や null に設定されていない属性を削除する必要があります。この記事では、さまざまな JavaScript バージョンと手法を使用したこの問題の解決策を説明します。

ES10/ES2019 ソリューション

Object.fromEntries を使用したワンライナー

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

オブジェクトを使用した関数。 fromエントリと再帰

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 === Object(v) ? removeEmpty(v) : v }), {});
}

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;
    }, {});
}

以上がJavaScript オブジェクトから null 属性と未定義属性を効率的に削除するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。