Conditionally set an object property

Javascript

Javascript Problem Overview


Is there some syntax for setting properties based on a condition?

data: {
    userId: 7,
    actionId: 36,
    express: (myCondition ? true : null) // does not work
}

I want express to be either set to a value or not set at all (i.e., there should be no key named express), and without extra statements after the definition. I know I can use it as a boolean, but the receiving side is using an isset() check and I'm wondering if I can avoid modifying it.


Edit: Seems there is no direct solution to the problem as stated. Here are the close suggestions:

JSON.stringify (Chris Kessel, dystroy):

var json = JSON.stringify( {
    data: {
        userId: 7,
        actionId: 36,
        express: (myCondition ? true : null)
    }
});

An anonymous function (Paulpro):

var data = new function(){
    this.userId = 7;
    this.actionId = 36;
    myCondition && (this.express = true);
};

An extra statement (x4rf41):

data: {
    userId: 7,
    actionId: 36
}
if(myCondition) data["express"] = true;

Eval (a former colleague of mine):

eval("data = {userId: 7, actionId: 36 " + (myCondition ? ", express: true}" : "}"))

Conditional definition (don't really know how to label this one):

data = (
    (myCondition && { userId: 7, actionId: 36, express: true }) ||
    (!myCondition && { userId: 7, actionId: 36 })
);

Javascript Solutions


Solution 1 - Javascript

Use the spread operator.

data: {
    userId: 7,
    actionId: 36,
    ...myCondition && {express: true}
}

Note that if you're using Flow, that syntax might generate type check errors. You can write the above more explicitly, and less succinctly, as:

data: {
    userId: 7,
    actionId: 36,
    ...(myCondition ? {express: true} : {})
}

Solution 2 - Javascript

Do it like this :

data: {
    userId: 7,
    actionId: 36,
    express: (myCondition ? true : undefined)
}

A property whose value is undefined isn't written when you stringify the object to JSON.


EDIT : It appears from the comments that there is no JSON involved in fact. OP is using $.ajax so $.param is probably used. $.param, unfortunately, does create an entry for properties whose value is undefined. So there's probably no solution without any supplementary line of code.

Solution 3 - Javascript

You can do it if you define your object using an anonymous function instead of object literal notation:

var data = new function(){
    this.userId = 7;
    this.actionId = 36;
    myCondition && (this.express = true);
};

The resulting data object is the exact same, except it's constructor will be the anonymous function instead of window.Object.

Solution 4 - Javascript

You could do something like this:

var json = JSON.stringify( {
    data: {
        userId: 7,
        actionId: 36,
        express: (myCondition ? true : null)
    }
});

Solution 5 - Javascript

A bit old but there is a good solution as well you can do :

data: {
    userId: 7,
    actionId: 36
}

Object.assign(data, !myCondition && { express: yourValue });

Thus it will assign your express property with the value you need if your condition is false.

Solution 6 - Javascript

The spread operator now fixes this. Here is an example with two comparisons.

Note: I changed date: to const date = so that it is valid runnable javascript. This can also be used with data: if it is supposed to be inside of a deep object structure.

const compareValue = 13;
const data =  {
    userId: 7,
    actionId: 36,
    ...(compareValue > 10 && {propertyForGreaterThan10: 'foo'}),
    ...(compareValue < 10 && {propertyForLessThan10: 'bar'}),
}
console.log(data);

Solution 7 - Javascript

first of all, thats javascript, not JSON.

the solution:

data: {
    userId: 7,
    actionId: 36
}
if(myCondition) data["express"] = true;

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
QuestionmcmlxxxviView Question on Stackoverflow
Solution 1 - JavascriptericsocoView Answer on Stackoverflow
Solution 2 - JavascriptDenys SéguretView Answer on Stackoverflow
Solution 3 - JavascriptPaulView Answer on Stackoverflow
Solution 4 - JavascriptChris KesselView Answer on Stackoverflow
Solution 5 - JavascriptImad El HittiView Answer on Stackoverflow
Solution 6 - JavascriptRobKohrView Answer on Stackoverflow
Solution 7 - Javascriptx4rf41View Answer on Stackoverflow