In Javascript, come aggiungere condizionalmente un membro a un oggetto?

Vorrei creare un oggetto con un membro aggiunto in modo condizionale. L'approccio semplice è:

var a = {};
if (someCondition)
    a.b = 5;

Ora, vorrei scrivere un codice più idiomatico. Sto provando:

a = {
    b: (someCondition? 5 : undefined)
};

Ma ora, bè un membro del acui valore è undefined. Questo non è il risultato desiderato.

C'è una soluzione utile?

Aggiornare

Cerco una soluzione in grado di gestire il caso generale con diversi membri.

a = {
  b: (conditionB? 5 : undefined),
  c: (conditionC? 5 : undefined),
  d: (conditionD? 5 : undefined),
  e: (conditionE? 5 : undefined),
  f: (conditionF? 5 : undefined),
  g: (conditionG? 5 : undefined),
 };

In puro Javascript, non riesco a pensare a qualcosa di più idiomatico del tuo primo frammento di codice.

Se, tuttavia, l'uso della libreria jQuery non è fuori discussione, $ .extend () dovrebbe soddisfare i tuoi requisiti perché, come dice la documentazione:

Le proprietà non definite non vengono copiate.

Pertanto, puoi scrivere:

var a = $.extend({}, {
    b: conditionB ? 5 : undefined,
    c: conditionC ? 5 : undefined,
    // and so on...
});

E ottieni i risultati che ti aspetti (se lo conditionBè false, allora bnon esisterà a).

Penso che @InspiredJW l'abbia fatto con ES5 e, come sottolineato da @trincot, usare es6 è un approccio migliore. Ma possiamo aggiungere un po 'più di zucchero, usando l'operatore spread, e una valutazione logica E di corto circuito:

const a = {
   ...(someCondition && {b: 5})
}

Con EcmaScript2015 è possibile utilizzare Object.assign:

Object.assign(a, conditionB ? { b: 1 } : null,
                 conditionC ? { c: 2 } : null,
                 conditionD ? { d: 3 } : null);

var a, conditionB, conditionC, conditionD;
conditionC = true;
a = {};
Object.assign(a, conditionB ? { b: 1 } : null,
                 conditionC ? { c: 2 } : null,
                 conditionD ? { d: 3 } : null);

console.log(a);

Alcune osservazioni:

• Object.assign modifica il primo argomento sul posto, ma restituisce anche l'oggetto aggiornato: quindi è possibile utilizzare questo metodo in un'espressione più grande che manipola ulteriormente l'oggetto.
• Invece di nullte potresti passare undefinedo {}, con lo stesso risultato. Potresti anche fornire 0invece, poiché i valori primitivi sono racchiusi e Numbernon ha proprietà enumerabili .

Ancora più conciso

Prendendo ulteriormente il secondo punto, si potrebbe ridurre come segue (come @Jamie ha fuori a punta), come valori falsy non hanno proprie proprietà enumerabili ( false, 0, NaN, null, undefined, '', tranne document.all):

Object.assign(a, conditionB && { b: 1 },
                 conditionC && { c: 2 },
                 conditionD && { d: 3 });

var a, conditionB, conditionC, conditionD;
conditionC = "this is truthy";
conditionD = NaN; // falsy
a = {};
Object.assign(a, conditionB && { b: 1 },
                 conditionC && { c: 2 },
                 conditionD && { d: 3 });
console.log(a);

const obj = {
   ...(condition) && {someprop: propvalue},
   ...otherprops
}

Dimostrazione dal vivo:

const obj = {
  ...(true) && {someprop: 42},
  ...(false) && {nonprop: "foo"},
  ...({}) && {tricky: "hello"},
}

console.log(obj);

L'uso della sintassi diffusa con booleano (come suggerito qui) non è sintassi valida. Lo spread può essere utilizzato solo con iterables .

Suggerisco quanto segue:

const a = {
   ...(someCondition? {b: 5}: {} )
}

Che ne pensi dell'utilizzo di Enhanced Object Properties e imposta la proprietà solo se è vera, ad esempio:

[isConditionTrue() && 'propertyName']: 'propertyValue'

Quindi se la condizione non è soddisfatta non crea la proprietà preferita e quindi puoi scartarla. Vedi: http://es6-features.org/#ComputedPropertyNames

AGGIORNAMENTO: È ancora meglio seguire l'approccio di Axel Rauschmayer nel suo articolo di blog sull'aggiunta condizionale di voci all'interno di letterali e array di oggetti ( http://2ality.com/2017/04/conditional-literal-entries.html ):

const arr = [
  ...(isConditionTrue() ? [{
    key: 'value'
  }] : [])
];

const obj = {
  ...(isConditionTrue() ? {key: 'value'} : {})
};

Mi ha aiutato molto.

più semplificato,

const a = {
    ...(condition && {b: 1}) // if condition is true 'b' will be added.
}

Se l'obiettivo è che l'oggetto appaia autonomo e si trovi all'interno di un set di parentesi graffe, è possibile provare questo:

var a = new function () {
    if (conditionB)
        this.b = 5;

    if (conditionC)
        this.c = 5;

    if (conditionD)
        this.d = 5;
};

Se si desidera eseguire questo lato server (senza jquery), è possibile utilizzare lodash 4.3.0:

a = _.pickBy({ b: (someCondition? 5 : undefined) }, _.negate(_.isUndefined));

E questo funziona usando lodash 3.10.1

a = _.pick({ b: (someCondition? 5 : undefined) }, _.negate(_.isUndefined));

var a = {
    ...(condition ? {b: 1} : '') // if condition is true 'b' will be added.
}

Spero che questo sia il modo molto efficace per aggiungere una voce in base alla condizione. Per ulteriori informazioni su come aggiungere in modo condizionale voci all'interno di un oggetto letterali.

Questa è stata a lungo una risposta, ma guardando altre idee ho trovato alcuni derivati ​​interessanti:

Assegnare valori non definiti alla stessa proprietà ed eliminarlo in seguito

Crea il tuo oggetto usando un costruttore anonimo e assegna sempre membri indefiniti allo stesso membro fittizio che rimuovi alla fine. Questo ti darà una sola riga (spero non troppo complessa) per membro + 1 riga aggiuntiva alla fine.

var a = new function() {
    this.AlwaysPresent = 1;
    this[conditionA ? "a" : "undef"] = valueA;
    this[conditionB ? "b" : "undef"] = valueB;
    this[conditionC ? "c" : "undef"] = valueC;
    this[conditionD ? "d" : "undef"] = valueD;
    ...
    delete this.undef;
};

È possibile aggiungere tutti i valori non definiti senza alcuna condizione e quindi utilizzare JSON.stringifyper rimuoverli tutti:

const person = {
  name: undefined,
  age: 22,
  height: null
}

const cleaned = JSON.parse(JSON.stringify(person));

// Contents of cleaned:

// cleaned = {
//   age: 22,
//   height: null
// }

Vorrei fare questo

var a = someCondition ? { b: 5 } : {};

Modificato con una versione del codice di linea

Usando la libreria lodash, puoi usare _.omitBy

var a = _.omitBy({
    b: conditionB ? 4 : undefined,
    c: conditionC ? 5 : undefined,
}, _.IsUndefined)

Ciò risulta utile quando si hanno richieste opzionali

var a = _.omitBy({
    b: req.body.optionalA,  //if undefined, will be removed
    c: req.body.optionalB,
}, _.IsUndefined)

Penso che il tuo primo approccio per aggiungere membri in modo condizionale sia perfettamente soddisfacente. Io in realtà non sono d'accordo con il non voler avere un membro bdi aun valore undefined. È abbastanza semplice aggiungere un undefinedcontrollo con l'uso di un forciclo con l' inoperatore. Ma comunque, potresti facilmente scrivere una funzione per filtrare i undefinedmembri.

var filterUndefined = function(obj) {
  var ret = {};
  for (var key in obj) {
    var value = obj[key];
    if (obj.hasOwnProperty(key) && value !== undefined) {
      ret[key] = value;
    }
  }
  return ret;
};

var a = filterUndefined({
  b: (conditionB? 5 : undefined),
  c: (conditionC? 5 : undefined),
  d: (conditionD? 5 : undefined),
  e: (conditionE? 5 : undefined),
  f: (conditionF? 5 : undefined),
  g: (conditionG? 5 : undefined),
});

È inoltre possibile utilizzare l' deleteoperatore per modificare l'oggetto sul posto.

Avvolgere in un oggetto

Qualcosa del genere è un po 'più pulito

 const obj = {
   X: 'dataX',
   Y: 'dataY',
   //...
 }

 const list = {
   A: true && 'dataA',
   B: false && 'dataB',
   C: 'A' != 'B' && 'dataC',
   D: 2000 < 100 && 'dataD',
   // E: conditionE && 'dataE',
   // F: conditionF && 'dataF',
   //...
 }

 Object.keys(list).map(prop => list[prop] ? obj[prop] = list[prop] : null)

Avvolgere in un array

Oppure, se si desidera utilizzare il metodo di Jamie Hill e disporre di un elenco molto lungo di condizioni, è necessario scrivere la ...sintassi più volte. Per renderlo un po 'più pulito, puoi semplicemente avvolgerli in un array, quindi utilizzare reduce()per restituirli come un singolo oggetto.

const obj = {
  X: 'dataX',
  Y: 'dataY',
  //...

...[
  true && { A: 'dataA'},
  false && { B: 'dataB'},
  'A' != 'B' && { C: 'dataC'},
  2000 < 100 && { D: 'dataD'},
  // conditionE && { E: 'dataE'},
  // conditionF && { F: 'dataF'},
  //...

 ].reduce(( v1, v2 ) => ({ ...v1, ...v2 }))
}

O usando la map()funzione

const obj = {
  X: 'dataX',
  Y: 'dataY',
  //...
}

const array = [
  true && { A: 'dataA'},
  false &&  { B: 'dataB'},
  'A' != 'B' && { C: 'dataC'},
  2000 < 100 && { D: 'dataD'},
  // conditionE && { E: 'dataE'},
  // conditionF && { F: 'dataF'},
  //...

 ].map(val => Object.assign(obj, val))

Questa è la soluzione più concisa che posso trovare:

var a = {};
conditionB && a.b = 5;
conditionC && a.c = 5;
conditionD && a.d = 5;
// ...

Definisci un var lete assegna semplicemente una nuova proprietà

let msg = {
    to: "hito@email.com",
    from: "hifrom@email.com",
    subject: "Contact form",    
};

if (file_uploaded_in_form) { // the condition goes here
    msg.attachments = [ // here 'attachments' is the new property added to msg Javascript object
      {
        content: "attachment",
        filename: "filename",
        type: "mime_type",
        disposition: "attachment",
      },
    ];
}

Ora msgdiventa

{
    to: "hito@email.com",
    from: "hifrom@email.com",
    subject: "Contact form",
    attachments: [
      {
        content: "attachment",
        filename: "filename",
        type: "mime_type",
        disposition: "attachment",
      },
    ]
}

Secondo me questa è una soluzione molto semplice e facile.

Usando la libreria lodash, puoi usare _.merge

var a = _.merge({}, {
    b: conditionB ? 4 : undefined,
    c: conditionC ? 5 : undefined,
})

1. Se conditionB è falsee conditionC è true, alloraa = { c: 5 }
2. Se sono sia conditionB che conditionC true, alloraa = { b: 4, c: 5 }
3. Se sono sia conditionB che conditionC false, alloraa = {}