Conditional Parameter addition to an Object Javascript

Question

Following is my code, in which I am trying to add passStatus to an object only if it has a value otherwise omit it.

I tried this one - In Javascript, how to conditionally add a member to an object?

But seems like I am doing it wrong. Any pointers Please.

Code -

var a = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "",
  query: "simple"
};

// var newObj = Object.assign(a, a.passStatus ? {a.passStatus} : null);

var newObj = {
   ...(a.passStatus? {passStatus: a.passStatus}: {} )
}

console.log(newObj); // {} <- Getting a blank object

Expected Output -

If passStatus = ""

{
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  query: "simple"
}

If passStatus = "pass"

{
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "pass",
  query: "simple"
}

Ori Drori · Accepted Answer · 2020-04-15 09:55:13Z

4

Destructure the object (a) to remove the value, than use object spread to add it, if it's truthy:

var a = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  query: "simple"
};

const { passStatus, ...obj } = a;

const newObj = {
  ...obj,
  ...(passStatus && { passStatus })
};

console.log(newObj);

edited Apr 15, 2020 at 9:55

answered Apr 15, 2020 at 9:41

Ori Drori

196k32 gold badges243 silver badges233 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

CertainPerformance · Accepted Answer · 2020-04-15 09:40:15Z

1

I think the clearest way to conditionally remove a property from the object like this would be to use rest syntax followed by a possible Object.assign:

var a = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "",
  query: "simple"
};

const { passStatus, ...newObj } = a;
if (passStatus) {
  Object.assign(newObj, { passStatus });
}

console.log(newObj);

You can do it in one line by destructuring a computed property name, where the property name uses the conditional operator to remove the passStatus property if it exists - but this is hard to understand, I wouldn't recommend it:

var a = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "",
  query: "simple"
};

const { [a.passStatus ? '' : 'passStatus']: _, ...newObj } = a;
console.log(newObj);

answered Apr 15, 2020 at 9:40

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

2 Comments

Nesh Over a year ago

What is the underscore referring to ? here in - [a.passStatus ? '' : 'passStatus']: _. Can u please explain this a bit ..this is quite interesting and unique

CertainPerformance Over a year ago

The [] brackets indicate a computed property name. Eg ['foo' + '1'] will destructure the property foo1. The identifier that comes after the : is the variable name into which the destructured property gets stored. Here, we don't care about the variable, we just want to remove it so it isn't included in the ...newObj rest syntax. You could name it anything you want and console.log its (empty) value later, if you wanted. But _ is the convention for a variable name which isn't going to be used.

Drew Reese · Accepted Answer · 2020-04-15 09:51:37Z

1

Shallow copy the entire object, if the new object has a falsey passStatus value, delete the property.

const a = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "",
  query: "simple"
};

const b = {
  firstName: "Tom",
  lastName: "Simmon",
  email: "[email protected]",
  phone: "+36456",
  passStatus: "test",
  query: "simple"
};

const copyKeepOrRemovePassStatus = obj => {
  const newObj = { ...obj };

  if (!newObj.passStatus) {
    delete newObj.passStatus;
  }
  return newObj;
};

console.log(copyKeepOrRemovePassStatus(a));
console.log(copyKeepOrRemovePassStatus(b));

edited Apr 15, 2020 at 9:51

answered Apr 15, 2020 at 9:42

Drew Reese

207k20 gold badges282 silver badges293 bronze badges

Collectives™ on Stack Overflow

Conditional Parameter addition to an Object Javascript

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related