Удалить пустые атрибуты из объекта в Javascript

Вероятно, вы ищете ключевое слово delete.

var obj = { };
obj.theProperty = 1;
delete obj.theProperty;

Вы можете пройти по объекту в цикле:

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.info(test);
console.info(clean(test));

Если вас беспокоит, что удаление этого свойства не запускает цепочку типов свойств объекта, вы также можете:

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

можно сделать короче с условием !

var r = {a: null, b: undefined, c:1};
for(var k in r)
   if (!r[k]) delete r[k];

Помните в использовании: как @semicolor анонсирует в комментариях: Это также приведет к удалению свойств, если значение является пустой строкой, ложью или нулем.

Если кому-то нужна рекурсивная версия ответа Оуэна (и Эрика), вот она:

/**
 * Delete all null (or undefined) properties from an object.
 * Set 'recurse' to true if you also want to delete properties in nested objects.
 */
function delete_null_properties(test, recurse) {
    for (var i in test) {
        if (test[i] === null) {
            delete test[i];
        } else if (recurse && typeof test[i] === 'object') {
            delete_null_properties(test[i], recurse);
        }
    }
}

JSON.stringify удаляет неопределенные ключи.

removeUndefined = function(json){
  return JSON.parse(JSON.stringify(json))
}

Для глубокого поиска я использовал следующий код, возможно, он будет полезен для всех, кто задает этот вопрос (он не подходит для циклических зависимостей):

function removeEmptyValues(obj) {
        for (var propName in obj) {
            if (!obj[propName] || obj[propName].length === 0) {
                delete obj[propName];
            } else if (typeof obj[propName] === 'object') {
                removeEmptyValues(obj[propName]);
            }
        }
        return obj;
    }

Если вы используете lodash или underscore.js, вот простое решение:

var obj = {name: 'John', age: null};

var compacted = _.pickBy(obj);

Это будет работать только с lodash 4, pre lodash 4 или underscore.js, используйте _.pick(obj, _.identity);

Чтобы скопировать на Ответ бена, как решить эту проблему с помощью lodash _.pickBy, вы также можете решить эту проблему в родственной библиотеке: Underscore.js's _.pick.

var obj = {name: 'John', age: null};

var compacted = _.pick(obj, function(value) {
  return value !== null && value !== undefined;
});

См .: Пример JSFiddle

Если кому-то нужно удалить значения undefined из объекта с помощью глубокого поиска с помощью lodash, то вот код, который я использую. Его довольно просто изменить, удалив все пустые значения (null / undefined).

function omitUndefinedDeep(obj) {
  return _.reduce(obj, function(result, value, key) {
    if (_.isObject(value)) {
      result[key] = omitUndefinedDeep(value);
    }
    else if (!_.isUndefined(value)) {
      result[key] = value;
    }
    return result;
  }, {});
}

Примеры 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;
    }, {});
}

Вы можете использовать комбинацию JSON.stringify, его параметра replacer и JSON.parse, чтобы снова превратить его в объект. Использование этого метода также означает, что замена выполняется для всех вложенных ключей во вложенных объектах.

Пример объекта

var exampleObject = {
  string: 'value',
  emptyString: '',
  integer: 0,
  nullValue: null,
  array: [1, 2, 3],
  object: {
    string: 'value',
    emptyString: '',
    integer: 0,
    nullValue: null,
    array: [1, 2, 3]
  },
  arrayOfObjects: [
    {
      string: 'value',
      emptyString: '',
      integer: 0,
      nullValue: null,
      array: [1, 2, 3]
    },
    {
      string: 'value',
      emptyString: '',
      integer: 0,
      nullValue: null,
      array: [1, 2, 3]
    }
  ]
};

Функция замены

function replaceUndefinedOrNull(key, value) {
  if (value === null || value === undefined) {
    return undefined;
  }

  return value;
}

Очистить объект

exampleObject = JSON.stringify(exampleObject, replaceUndefinedOrNull);
exampleObject = JSON.parse(exampleObject);

Пример CodePen

Используя ramda # pickBy, вы удалите все значения null, undefined и false:

const obj = {a:1, b: undefined, c: null, d: 1}
R.pickBy(R.identity, obj)

Как отметил @manroe, для сохранения значений false используйте isNil():

const obj = {a:1, b: undefined, c: null, d: 1, e: false}
R.pickBy(v => !R.isNil(v), obj)

С Lodash:

_.omitBy({a: 1, b: null}, (v) => !v)

Если вы не хотите мутировать на месте, но возвращаете клон с удаленными значениями null / undefined, вы можете использовать функцию сокращения ES6.

// Helper to remove undefined or null properties from an object
function removeEmpty(obj) {
  // Protect against null/undefined object passed in
  return Object.keys(obj || {}).reduce((x, k) => {
    // Check for null or undefined
    if (obj[k] != null) {
      x[k] = obj[k];
    }
    return x;
  }, {});
}

Вместо удаления свойства вы также можете создать новый объект с ключами, которые не равны нулю.

const removeEmpty = (obj) => {
  return Object.keys(obj).filter(key => obj[key]).reduce(
    (newObj, key) => {
      newObj[key] = obj[key]
      return newObj
    }, {}
  )
}

Более короткое чистое решение ES6, преобразовать его в массив, использовать функцию фильтрации и преобразовать обратно в объект. Также было бы легко сделать функцию ...

Кстати. с этим .length > 0 я проверяю, есть ли пустая строка / массив, поэтому он удалит пустые ключи.

const MY_OBJECT = { f: 'te', a: [] }

Object.keys(MY_OBJECT)
 .filter(f => !!MY_OBJECT[f] && MY_OBJECT[f].length > 0)
 .reduce((r, i) => { r[i] = MY_OBJECT[i]; return r; }, {});

JS BINhttps://jsbin.com/kugoyinora/edit?js,console

Простейшее возможное решение Lodash для возврата объекта с отфильтрованными значениями null и undefined.

_.omitBy(obj, _.isNil)

Если вы используете eslint и хотите избежать срабатывания правила no-param-reassign, вы можете использовать Object.assign вместе с .reduce и вычисляемым именем свойства для довольно элегантного решения ES6:

const queryParams = { a: 'a', b: 'b', c: 'c', d: undefined, e: null, f: '', g: 0 };
const cleanParams = Object.keys(queryParams) 
  .filter(key => queryParams[key] != null)
  .reduce((acc, key) => Object.assign(acc, { [key]: queryParams[key] }), {});
// { a: 'a', b: 'b', c: 'c', f: '', g: 0 }

Если вам нужны 4 строки чистого решения ES7:

const clean = e => e instanceof Object ? Object.entries(e).reduce((o, [k, v]) => {
  if (typeof v === 'boolean' || v) o[k] = clean(v);
  return o;
}, e instanceof Array ? [] : {}) : e;

Или, если вы предпочитаете более читаемую версию:

function filterEmpty(obj, [key, val]) {
  if (typeof val === 'boolean' || val) {
    obj[key] = clean(val)
  };

  return obj;
}

function clean(entry) {
  if (entry instanceof Object) {
    const type = entry instanceof Array ? [] : {};
    const entries = Object.entries(entry);

    return entries.reduce(filterEmpty, type);
  }

  return entry;
}

Это сохранит логические значения, а также очистит массивы. Он также сохраняет исходный объект, возвращая очищенную копию.

У меня такой же сценарий в моем проекте, и я использовал следующий метод.

Он работает со всеми типами данных, некоторые из упомянутых выше не работают с датами и пустыми массивами.

removeEmptyKeysFromObject.js

removeEmptyKeysFromObject(obj) {
   Object.keys(obj).forEach(key => {
  if (Object.prototype.toString.call(obj[key]) === '[object Date]' && (obj[key].toString().length === 0 || obj[key].toString() === 'Invalid Date')) {
    delete obj[key];
  } else if (obj[key] && typeof obj[key] === 'object') {
    this.removeEmptyKeysFromObject(obj[key]);
  } else if (obj[key] == null || obj[key] === '') {
    delete obj[key];
  }

  if (obj[key]
    && typeof obj[key] === 'object'
    && Object.keys(obj[key]).length === 0
    && Object.prototype.toString.call(obj[key]) !== '[object Date]') {
    delete obj[key];
  }
});
  return obj;
}

передать любой объект в эту функцию removeEmptyKeysFromObject ()

Вот функциональный способ удалить nulls из объекта с помощью ES6 без изменения объекта, используя только reduce:

const stripNulls = (obj) => {
  return Object.keys(obj).reduce((acc, current) => {
    if (obj[current] !== null) {
      return { ...acc, [current]: obj[current] }
    }
    return acc
  }, {})
}

Чистый объект на месте

// General cleanObj function
const cleanObj = (valsToRemoveArr, obj) => {
   Object.keys(obj).forEach( (key) =>
      if (valsToRemoveArr.includes(obj[key])){
         delete obj[key]
      }
   })
}

cleanObj([undefined, null], obj)

Чистая функция

const getObjWithoutVals = (dontReturnValsArr, obj) => {
    const cleanObj = {}
    Object.entries(obj).forEach( ([key, val]) => {
        if (!dontReturnValsArr.includes(val)){
            cleanObj[key]= val
        } 
    })
    return cleanObj
}

//To get a new object without `null` or `undefined` run: 
const nonEmptyObj = getObjWithoutVals([undefined, null], obj)

помощник reduce может сделать трюк (без проверки типов) -

const cleanObj = Object.entries(objToClean).reduce((acc, [key, value]) => {
      if (value) {
        acc[key] = value;
      }
      return acc;
    }, {});

Вы также можете использовать синтаксис ...spread, используя forEach примерно так:

let obj = { a: 1, b: "b", c: undefined, d: null };
let cleanObj = {};

Object.keys(obj).forEach(val => {
  const newVal = obj[val];
  cleanObj = newVal ? { ...cleanObj, [val]: newVal } : cleanObj;
});

console.info(cleanObj);

Если вы предпочитаете чистый / функциональный подход

const stripUndef = obj => 
  Object.keys(obj)
   .reduce((p, c) => ({ ...p, ...(x[c] === undefined ? { } : { [c]: x[c] })}), {});

Если вы не хотите изменять исходный объект (используя некоторые операторы ES6):

const keys = Object.keys(objectWithNulls).filter(key => objectWithNulls[key]);
const pairs = keys.map(key => ({ [key]: objectWithNulls[key] }));

const objectWithoutNulls = pairs.reduce((val, acc) => ({ ...val, ...acc }));

filter(key => objectWithNulls[key]) возвращает все, что правда, поэтому отклоняет любые значения, такие как 0 или false, а также undefined или null. Может быть легко заменен на filter(key => objectWithNulls[key] !== undefined) или что-то подобное, если это нежелательное поведение.

Вы можете выполнить рекурсивное удаление в одной строке, используя Аргумент replacer json.stringify

const removeEmptyValues = obj => (
  JSON.parse(JSON.stringify(obj, (k,v) => v ?? undefined))
)

Использование:

removeEmptyValues({a:{x:1,y:null,z:undefined}}) // Returns {a:{x:1}}

Как упоминалось в комментарии Эммануэля, этот метод работал только в том случае, если ваша структура данных содержит только типы данных, которые могут быть помещены в формат JSON (строки, числа, списки и т. д.).

(Этот ответ был обновлен для использования нового Оператор Nullish Coalescing. В зависимости от потребностей поддержки браузера вы можете вместо этого использовать эту функцию: (k,v) => v!=null ? v : undefined)

Рекурсивно удалять пустые, неопределенные, пустые объекты и пустые массивы, возвращая копию (версия ES6)

export function skipEmpties(dirty) {
    let item;
    if (Array.isArray(dirty)) {
        item = dirty.map(x => skipEmpties(x)).filter(value => value !== undefined);
        return item.length ? item : undefined;
    } else if (dirty && typeof dirty === 'object') {
        item = {};
        Object.keys(dirty).forEach(key => {
            const value = skipEmpties(dirty[key]);
            if (value !== undefined) {
                item[key] = value;
            }
        });
        return Object.keys(item).length ? item : undefined;
    } else {
        return dirty === null ? undefined : dirty;
    }
}

Функциональный и неизменный подход, без .filter и без создания большего количества объектов, чем необходимо

Object.keys(obj).reduce((acc, key) => (obj[key] === undefined ? acc : {...acc, [key]: obj[key]}), {})

Мы можем использовать JSON.stringify и JSON.parse для удаления пустых атрибутов из объекта.

jsObject = JSON.parse(JSON.stringify(jsObject), (key, value) => {
               if (value == null || value == '' || value == [] || value == {})
                   return undefined;
               return value;
           });

Самый короткий лайнер для ES6 +

Отфильтровать все ложные значения ("", 0, false, null, undefined)

Object.entries(obj).reduce((a,[k,v]) => (v ? (a[k]=v, a) : a), {})

Отфильтруйте значения null и undefined:

Object.entries(obj).reduce((a,[k,v]) => (v == null ? a : (a[k]=v, a)), {})

ТОЛЬКО фильтр null

Object.entries(obj).reduce((a,[k,v]) => (v === null ? a : (a[k]=v, a)), {})

ТОЛЬКО фильтр undefined

Object.entries(obj).reduce((a,[k,v]) => (v === undefined ? a : (a[k]=v, a)), {})

Рекурсивные решения: Фильтры null и undefined

Для объектов:

const cleanEmpty = obj => Object.entries(obj)
        .map(([k,v])=>[k,v && typeof v === "object" ? cleanEmpty(v) : v])
        .reduce((a,[k,v]) => (v == null ? a : (a[k]=v, a)), {});

Для объектов и массивов:

const cleanEmpty = obj => {
  if (Array.isArray(obj)) { 
    return obj
        .map(v => (v && typeof v === 'object') ? cleanEmpty(v) : v)
        .filter(v => !(v == null)); 
  } else { 
    return Object.entries(obj)
        .map(([k, v]) => [k, v && typeof v === 'object' ? cleanEmpty(v) : v])
        .reduce((a, [k, v]) => (v == null ? a : (a[k]=v, a)), {});
  } 
}

30+ ответов, но я не видел этого короткого однострочника ES6, использующего оператор распространения благодаря тому, что Object.assign() является функцией vararg, которая молча игнорирует любые не-объекты (например, false).

Object.assign({}, ...Object.entries(obj).map(([k,v]) => v != null && {[k]: v]))

Если вы просто хотите удалить неопределенные свойства верхнего уровня из объекта, я считаю, что это самый простой вариант:

const someObject = {
  a: null,
  b: 'someString',
  c: 3,
  d: undefined
};

for (let [key, value] of Object.entries(someObject)) {
  if (value === null || value === undefined) delete someObject[key];
}

console.info('Sanitized', someObject);

ES6 arrow function and ternary operator:
Object.entries(obj).reduce((acc, entry) => {
   const [key, value] = entry
  if (value !== undefined) acc[key] = value;
  return acc;
}, {})
    const obj = {test:undefined, test1:1 ,test12:0, test123:false};
    const newObj = Object.entries(obj).reduce((acc, entry) => {
       const [key, value] = entry
      if (value !== undefined) acc[key] = value;
      return acc;
    }, {})
    console.info(newObj)

Вот комплексная рекурсивная функция (изначально основанная на функции @chickens), которая:

• рекурсивно удалите то, что вы говорите defaults=[undefined, null, '', NaN]
• Правильно обрабатывать обычные объекты, массивы и объекты Date

const cleanEmpty = function(obj, defaults = [undefined, null, NaN, '']) {
  if (!defaults.length) return obj
  if (defaults.includes(obj)) return

  if (Array.isArray(obj))
    return obj
      .map(v => v && typeof v === 'object' ? cleanEmpty(v, defaults) : v)
      .filter(v => !defaults.includes(v))

  return Object.entries(obj).length 
    ? Object.entries(obj)
        .map(([k, v]) => ([k, v && typeof v === 'object' ? cleanEmpty(v, defaults) : v]))
        .reduce((a, [k, v]) => (defaults.includes(v) ? a : { ...a, [k]: v}), {}) 
    : obj
}

ИСПОЛЬЗОВАНИЕ:

// based off the recursive cleanEmpty function by @chickens. 
// This one can also handle Date objects correctly 
// and has a defaults list for values you want stripped.

const cleanEmpty = function(obj, defaults = [undefined, null, NaN, '']) {
  if (!defaults.length) return obj
  if (defaults.includes(obj)) return

  if (Array.isArray(obj))
    return obj
      .map(v => v && typeof v === 'object' ? cleanEmpty(v, defaults) : v)
      .filter(v => !defaults.includes(v))

  return Object.entries(obj).length 
    ? Object.entries(obj)
        .map(([k, v]) => ([k, v && typeof v === 'object' ? cleanEmpty(v, defaults) : v]))
        .reduce((a, [k, v]) => (defaults.includes(v) ? a : { ...a, [k]: v}), {}) 
    : obj
}


// testing

console.info('testing: undefined \n', cleanEmpty(undefined))
console.info('testing: null \n',cleanEmpty(null))
console.info('testing: NaN \n',cleanEmpty(NaN))
console.info('testing: empty string \n',cleanEmpty(''))
console.info('testing: empty array \n',cleanEmpty([]))
console.info('testing: date object \n',cleanEmpty(new Date(1589339052 * 1000)))
console.info('testing: nested empty arr \n',cleanEmpty({ 1: { 2 :null, 3: [] }}))
console.info('testing: comprehensive obj \n', cleanEmpty({
  a: 5,
  b: 0,
  c: undefined,
  d: {
    e: null,
    f: [{
      a: undefined,
      b: new Date(),
      c: ''
    }]
  },
  g: NaN,
  h: null
}))
console.info('testing: different defaults \n', cleanEmpty({
  a: 5,
  b: 0,
  c: undefined,
  d: {
    e: null,
    f: [{
      a: undefined,
      b: '',
      c: new Date()
    }]
  },
  g: [0, 1, 2, 3, 4],
  h: '',
}, [undefined, null]))

удалить объект пустого поля

for (const objectKey of Object.keys(data)) {
      if (data[objectKey] === null || data[objectKey] === '' || data[objectKey] === 'null' || data[objectKey] === undefined) {
        delete data[objectKey];
      }
    }

На этот вопрос уже дан исчерпывающий ответ, я просто хотел бы поделиться своей версией на основе других приведенных примеров:

function filterObject(obj, filter) {
    return Object.entries(obj)
        .map(([key, value]) => {
            return [key, value && typeof value === 'object'
                ? filterObject(value, filter)
                : value];
        })
        .reduce((acc, [key, value]) => {
            if (!filter.includes(value)) {
                acc[key] = value;
            }

            return acc;
        }, {});
}

Что отличает это решение, так это возможность указать, какие значения вы хотите фильтровать во втором параметре следующим образом:

const filtered = filterObject(originalObject, [null, '']);

Что вернет новый объект (не изменяет исходный объект), не включая свойства со значением null или ''.

Вот альтернатива

Машинопись:

function objectDefined <T>(obj: T): T {
  const acc: Partial<T> = {};
  for (const key in obj) {
    if (obj[key] !== undefined) acc[key] = obj[key];
  }
  return acc as T;
}

Javascript:

function objectDefined(obj) {
  const acc = {};
  for (const key in obj) {
    if (obj[key] !== undefined) acc[key] = obj[key];
  }
  return acc;
}

Если вас устраивает использование Лодаш, вы можете добавить рекурсивную библиотеку DeepDash и добиться желаемого с помощью довольно краткого кода:

const prune = obj => _.filterDeep(obj, (v) => !(_.isUndefined(v) || _.isNull(v)));

Вызов prune(anObjectWithNulls) вернет объект без значений undefined или null.

Удалите все свойства с null и undefined

let obj = {
"id": 1,
"firstName": null,
"lastName": null,
"address": undefined,
"role": "customer",
"photo": "fb79fd5d-06c9-4097-8fdc-6cebf73fab26/fc8efe82-2af4-4c81-bde7-8d2f9dd7994a.jpg",
"location": null,
"idNumber": null,
};

   let result =  Object.entries(obj).reduce((a,[k,v]) => (v == null ? a : (a[k]=v, a)), {});
console.info(result)