Gfrktyl

I have this loop that iterates and assigns a variable to true depending on the different conditions

for (const element of actionsReferences) {

  if (element === 'accept') {

    this.showAcceptButton = true

  } else if (element === 'reject') {

    this.showRejectButton = true

  } else if (element === 'transfer') {

    this.showTransferButton = true

  }

}

How can i get the same result by avoiding if () ?

You could use a string to function "map", in JavaScript that can be implemented with a simple object:

var map = {

  'accept'   : function(o) {  o.showAcceptButton = true; },

  'reject'   : function(o) {  o.showRejectButton = true; },

  'transfer' : function(o) {  o.showTransferButton = true; }

};



let thisObject = {}; // fake this object



map['accept'](thisObject);

map[element](this); // use within your loop





// ES6 map

const map6 = {

    accept   : (o) => o.showAcceptButton = true,

    reject   : (o) => o.showRejectButton = true,

    transfer : (o) => o.showTransferButton = true

};



// alternative ES6 map

const map6a = {

    accept(o)   { o.showAcceptButton = true; },

    reject(o)   { o.showRejectButton = true; },

    transfer(o) { o.showTransferButton = true; }

};



map6['reject'](thisObject);

map6a['transfer'](thisObject);



// check if function exists and really is a function

if ('accept' in map6 && typeof map6['accept'] === 'function') map6['accept'](thisObject);

You could take an object and check if the action exists. If so, take the value as key for assignment.

const actions = {

        accept: 'showAcceptButton',

        reject: 'showRejectButton',

        transfer: 'showTransferButton'

    };



for (const element of actionsReferences) {

    if (element in actions) {

        this[actions[element]] = true;

    }

}

You can simply use this code:

for (const element of actionsReferences) {

  this.showAcceptButton = element === 'accept';

  this.showRejectButton = element === 'reject';

  this.showTransferButton = element === 'transfer';

}

Or, if you want the variables to stay as what they were set to if it returns false, use this:

for (const element of actionsReferences) {

  this.showAcceptButton = element === 'accept' || this.showAcceptButton;

  this.showRejectButton = element === 'reject' || this.showRejectButton;

  this.showTransferButton = element === 'transfer' || this.showTransferButton;

}

You can use bracket notation.

You have to capitalize first letter of element also.

element.charAt(0).toUpperCase() + element.slice(1)

Solution

for (const element of actionsReferences) {

   this['show' + element.charAt(0).toUpperCase() + element.slice(1) + 'Button'] = true

}