Javascript - removing undefined fields from an object

JavascriptObjectFieldUndefined

Javascript Problem Overview


Is there a clean way to remove undefined fields from an object?

i.e.

> var obj = { a: 1, b: undefined, c: 3 }
> removeUndefined(obj)
{ a: 1, c: 3 }

I came across two solutions:

_.each(query, function removeUndefined(value, key) {
  if (_.isUndefined(value)) {
    delete query[key];
  }
});

or:

_.omit(obj, _.filter(_.keys(obj), function(key) { return _.isUndefined(obj[key]) }))

Javascript Solutions


Solution 1 - Javascript

A one-liner using ES6 arrow function and ternary operator:

Object.keys(obj).forEach(key => obj[key] === undefined ? delete obj[key] : {});

Or use short-circuit evaluation instead of ternary: (@Matt Langlois, thanks for the info!)

Object.keys(obj).forEach(key => obj[key] === undefined && delete obj[key])

Same example using if statement:

Object.keys(obj).forEach(key => {
  if (obj[key] === undefined) {
    delete obj[key];
  }
});

If you want to remove the items from nested objects as well, you can use a recursive function:

const removeEmpty = (obj) => {
  let newObj = {};
  Object.keys(obj).forEach((key) => {
    if (obj[key] === Object(obj[key])) newObj[key] = removeEmpty(obj[key]);
    else if (obj[key] !== undefined) newObj[key] = obj[key];
  });
  return newObj;
};

Solution 2 - Javascript

I prefer to use something like Lodash:

import { pickBy, identity } from 'lodash'

const cleanedObject = pickBy(originalObject, identity)

Note that the identity function is just x => x and its result will be false for all falsy values. So this removes undefined, "", 0, null, ...

If you only want the undefined values removed you can do this:

const cleanedObject = pickBy(originalObject, v => v !== undefined)

It gives you a new object, which is usually preferable over mutating the original object like some of the other answers suggest.

Solution 3 - Javascript

Use JSON Utilities

Overview

Given an object like:

var obj = { a: 1, b: undefined, c: 3 }

To remove undefined props in an object we can use nested JSON methods stringify and parse like so:

JSON.parse(JSON.stringify(obj))

Live Example

var obj = { a: 1, b: undefined, c: 3 }
var output = JSON.parse(JSON.stringify(obj));

console.log(output)

Limitations and warnings

Depending on how Javascript is implemented.

  • It is possible that undefined will be converted to null instead of just being removed.
  • Nested Object, Array will be converted to strings
  • Date, time values also converted to strings

Tested

The above code was tested in Firefox, Chrome, and Node 14.18.1 and removed "b" from all obj arrays. Still I recommend exercising caution using this method unless you are in a stable environment (such as cloud functions or docker) I would not rely on this method client side.

Solution 4 - Javascript

Because it doesn't seem to have been mentioned, here's my preferred method, sans side effects or external dependencies:

const obj = {
  a: 1,
  b: undefined
}

const newObject = Object.keys(obj).reduce((acc, key) => {
  const _acc = acc;
  if (obj[key] !== undefined) _acc[key] = obj[key];
  return _acc;
}, {})

console.log(newObject)
// Object {a: 1}

Solution 5 - Javascript

This solution also avoids hasOwnProperty() as Object.keys returns an array of a given object's own enumerable properties.

Object.keys(obj).forEach(function (key) {
 if(typeof obj[key] === 'undefined'){
    delete obj[key];
  }
});

and you can add this as null or '' for stricter cleaning.

Solution 6 - Javascript

Here's a plain javascript (no library required) solution:

function removeUndefinedProps(obj) {
    for (var prop in obj) {
        if (obj.hasOwnProperty(prop) && obj[prop] === undefined) {
            delete obj[prop];
        }
    }
}

Working demo: http://jsfiddle.net/jfriend00/djj5g5fu/

Solution 7 - Javascript

This one is easy to remember, but might be slow. Use jQuery to copy non-null properties to an empty object. No deep copy unless you add true as first argument.

myObj = $.extend({}, myObj);

Solution 8 - Javascript

Mhh.. I think @Damian asks for remove undefined field (property) from an JS object. Then, I would simply do :

for (const i in myObj)  
   if (typeof myObj[i] === 'undefined')   
     delete myObj[i]; 

Short and efficient solution, in (vanilla) JS ! Example :

const myObj = {
  a: 1,
  b: undefined,
  c: null, 
  d: 'hello world'
};

for (const i in myObj)  
  if (typeof myObj[i] === 'undefined')   
    delete myObj[i]; 

console.log(myObj);

Solution 9 - Javascript

Another Javascript Solution

for(var i=0,keys = Object.keys(obj),len=keys.length;i<len;i++){ 
  if(typeof obj[keys[i]] === 'undefined'){
    delete obj[keys[i]];
  }
}

No additional hasOwnProperty check is required as Object.keys does not look up the prototype chain and returns only the properties of obj.

DEMO

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionDamianView Question on Stackoverflow
Solution 1 - JavascriptRotaretiView Answer on Stackoverflow
Solution 2 - JavascriptThijs KoerselmanView Answer on Stackoverflow
Solution 3 - JavascriptnmanikiranView Answer on Stackoverflow
Solution 4 - JavascriptptimView Answer on Stackoverflow
Solution 5 - JavascriptAlvaro PinotView Answer on Stackoverflow
Solution 6 - Javascriptjfriend00View Answer on Stackoverflow
Solution 7 - JavascriptFredrikView Answer on Stackoverflow
Solution 8 - JavascriptDam FaView Answer on Stackoverflow
Solution 9 - JavascriptPrabhu MurthyView Answer on Stackoverflow