javascript - Remove undefined, null, NaN from JS Object using Lodash? - Stack Overflow

admin管理员组

文章数量:1357568

Given a Javascript object

x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

Is it possible to remove all properties that has NaN, null, or undefined using Lodash, or without Lodash but in a similarly readable way?

Tried

_.omitBy(x, _.isNil)

but it did not remove NaN

{a: 123, b: "hello", c: NaN}

Can _.omitBy take multiple parameters in addition to _.isNil?

Given a Javascript object

x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

Is it possible to remove all properties that has NaN, null, or undefined using Lodash, or without Lodash but in a similarly readable way?

Tried

_.omitBy(x, _.isNil)

but it did not remove NaN

{a: 123, b: "hello", c: NaN}

Can _.omitBy take multiple parameters in addition to _.isNil?

• javascript
• lodash

Share Improve this question Follow asked Feb 14, 2021 at 5:49 NyxynyxNyxynyx 63.8k163163 gold badges507507 silver badges856856 bronze badges

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 4

Because isNil just checks for the null/undefined value (doc)

Checks if value is null or undefined.

So you also have to check if the value is NaN with _.isNaN.

_.overSome([_.isNil, _.isNaN])

const x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

const res = _.omitBy(x, _.overSome([_.isNil, _.isNaN]))

console.log(res)

<script src="https://cdn.jsdelivr/npm/[email protected]/lodash.min.js"></script>

Or you could also do that in vanilla JS.

• Transform the object to array of key-value pairs
• reject pairs that have falsy value
• transform the pairs back to object

const x = { a: 123, b: "hello", c: NaN, d: null, e: undefined };

const isNilOrNaN = (val) => val == null || Number.isNaN(val);

const res = Object.fromEntries(
  Object.entries(x).filter(([key, value]) => !isNilOrNaN(value))
);

console.log(res);

You can use Number.isNaN to detect NaN and value == null to detect null and undefined.

x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

const result = Object.keys(x).reduce((acc, key) => {
  if (x[key] == null || Number.isNaN(x[key])) {
    return acc
  }

  return {
    ...acc,
    [key]: x[key],
  }
}, {})

console.log(result)

Using just javascript, you could use Array.filter on an array created with Object.entries then turn it back into an object with Object.fromEntries.

const sourceObj = {
  'a': 123,
  'b': 'hello',
  'c': NaN,
  'd': null,
  'e': undefined,
  'f': 0,
  'g': ''
}

const result = Object.fromEntries(Object.entries(sourceObj).filter(([key, val]) =>
  val != null && !Number.isNaN(val)
))

console.log(result);

Using lodash you could use pickBy, isNaN, and isNil.

const sourceObj = {
  a: 123,
  b: "hello",
  c: NaN,
  d: null,
  e: undefined,
  f: 0,
  g: ""
};

const result = _.pickBy(sourceObj, (value) => {
  return !_.isNaN(value) && !_.isNil(value)
})

console.log(result);

<script src="https://cdnjs.cloudflare./ajax/libs/lodash.js/4.17.20/lodash.min.js" integrity="sha512-90vH1Z83AJY9DmlWa8WkjkV79yfS2n2Oxhsi2dZbIv0nC4E6m5AbH8Nh156kkM7JePmqD6tcZsfad1ueoaovww==" crossorigin="anonymous"></script>

Which one has better readability is debatable.

Use Array.includes will solve many problems like this.

let x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

let result =
    Object.fromEntries(
        Object.entries(x).filter(
            v => ![NaN, null, undefined].includes(v[1])))

// result is { a: 123, b: "hello" }
console.log(result)

I did it like this:

const x = {'a': 123, 'b': 'hello', 'c': NaN, 'd': null, 'e': undefined}

const cleaned = _(x).omitBy(_.isNil).omitBy(_.isNaN).value()

console.log(cleaned)

<script src="https://cdn.jsdelivr/npm/[email protected]/lodash.min.js"></script>

本文标签： javascriptRemove undefinedNULLNaN from JS Object using LodashStack Overflow