Setting flags to show three buttons











up vote
6
down vote

favorite
4












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 () ?










share|improve this question














We are looking for answers that provide insightful observations about the code in the question. Answers that consist of independent solutions with no justification do not constitute a code review, and may be removed.





migrated from stackoverflow.com Dec 8 '17 at 8:35


This question came from our site for professional and enthusiast programmers.















  • do you have only three types in the array?
    – Nina Scholz
    Dec 8 '17 at 8:34










  • no, the array can have more than 3 types @NinaScholz
    – Mouad Ennaciri
    Dec 8 '17 at 8:37






  • 4




    Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
    – Guy Incognito
    Dec 8 '17 at 8:46






  • 1




    An if/else like that should normally be a switch statement anyway
    – theonlygusti
    Dec 8 '17 at 9:05










  • Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
    – 200_success
    Dec 8 '17 at 12:47















up vote
6
down vote

favorite
4












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 () ?










share|improve this question














We are looking for answers that provide insightful observations about the code in the question. Answers that consist of independent solutions with no justification do not constitute a code review, and may be removed.





migrated from stackoverflow.com Dec 8 '17 at 8:35


This question came from our site for professional and enthusiast programmers.















  • do you have only three types in the array?
    – Nina Scholz
    Dec 8 '17 at 8:34










  • no, the array can have more than 3 types @NinaScholz
    – Mouad Ennaciri
    Dec 8 '17 at 8:37






  • 4




    Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
    – Guy Incognito
    Dec 8 '17 at 8:46






  • 1




    An if/else like that should normally be a switch statement anyway
    – theonlygusti
    Dec 8 '17 at 9:05










  • Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
    – 200_success
    Dec 8 '17 at 12:47













up vote
6
down vote

favorite
4









up vote
6
down vote

favorite
4






4





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 () ?










share|improve this question















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 () ?







javascript ecmascript-6






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Dec 8 '17 at 12:49









200_success

127k15148412




127k15148412










asked Dec 8 '17 at 8:33









Mouad Ennaciri

487




487



We are looking for answers that provide insightful observations about the code in the question. Answers that consist of independent solutions with no justification do not constitute a code review, and may be removed.




We are looking for answers that provide insightful observations about the code in the question. Answers that consist of independent solutions with no justification do not constitute a code review, and may be removed.





migrated from stackoverflow.com Dec 8 '17 at 8:35


This question came from our site for professional and enthusiast programmers.






migrated from stackoverflow.com Dec 8 '17 at 8:35


This question came from our site for professional and enthusiast programmers.














  • do you have only three types in the array?
    – Nina Scholz
    Dec 8 '17 at 8:34










  • no, the array can have more than 3 types @NinaScholz
    – Mouad Ennaciri
    Dec 8 '17 at 8:37






  • 4




    Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
    – Guy Incognito
    Dec 8 '17 at 8:46






  • 1




    An if/else like that should normally be a switch statement anyway
    – theonlygusti
    Dec 8 '17 at 9:05










  • Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
    – 200_success
    Dec 8 '17 at 12:47


















  • do you have only three types in the array?
    – Nina Scholz
    Dec 8 '17 at 8:34










  • no, the array can have more than 3 types @NinaScholz
    – Mouad Ennaciri
    Dec 8 '17 at 8:37






  • 4




    Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
    – Guy Incognito
    Dec 8 '17 at 8:46






  • 1




    An if/else like that should normally be a switch statement anyway
    – theonlygusti
    Dec 8 '17 at 9:05










  • Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
    – 200_success
    Dec 8 '17 at 12:47
















do you have only three types in the array?
– Nina Scholz
Dec 8 '17 at 8:34




do you have only three types in the array?
– Nina Scholz
Dec 8 '17 at 8:34












no, the array can have more than 3 types @NinaScholz
– Mouad Ennaciri
Dec 8 '17 at 8:37




no, the array can have more than 3 types @NinaScholz
– Mouad Ennaciri
Dec 8 '17 at 8:37




4




4




Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
– Guy Incognito
Dec 8 '17 at 8:46




Several showXButton variables indicate a deeper code stink. You might want to show more of your code so that the core issue can be fixed.
– Guy Incognito
Dec 8 '17 at 8:46




1




1




An if/else like that should normally be a switch statement anyway
– theonlygusti
Dec 8 '17 at 9:05




An if/else like that should normally be a switch statement anyway
– theonlygusti
Dec 8 '17 at 9:05












Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
– 200_success
Dec 8 '17 at 12:47




Your question has been migrated from Stack Overflow to Code Review. Here, we advise you to show some more code, so that we see exactly what this code is for and give you the best advice possible. Perhaps we could even eliminate these assignments altogether? See How to Ask.
– 200_success
Dec 8 '17 at 12:47










7 Answers
7






active

oldest

votes

















up vote
5
down vote



accepted










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);





share|improve this answer



















  • 1




    Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
    – Ethan
    Dec 8 '17 at 10:32






  • 3




    Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
    – gntskn
    Dec 8 '17 at 13:52










  • This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
    – Micheal Johnson
    Dec 9 '17 at 16:03










  • Couldn't you use setAttribute instead of defining 3 functions?
    – Eric Duminil
    Dec 9 '17 at 16:28


















up vote
17
down vote













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;
}
}





share|improve this answer























  • The best and most concise answer here :)
    – Ethan
    Dec 8 '17 at 10:33






  • 1




    -1 because it uses the this token which represents a security risk in open environments.
    – Blindman67
    Dec 8 '17 at 11:16






  • 2




    @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
    – Nina Scholz
    Dec 8 '17 at 11:17










  • I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
    – Blindman67
    Dec 8 '17 at 12:28




















up vote
5
down vote













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;
}





share|improve this answer























  • Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
    – Peter
    Dec 8 '17 at 12:02










  • The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
    – gntskn
    Dec 8 '17 at 13:55










  • The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
    – xehpuk
    Dec 8 '17 at 15:51






  • 1




    @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
    – gntskn
    Dec 15 '17 at 10:30






  • 1




    @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
    – gntskn
    Dec 15 '17 at 10:32


















up vote
0
down vote













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
}





share|improve this answer




























    up vote
    0
    down vote













    Try bracket notation



    var fnToFirstUpper = (str) => str.charAt(0).toUpperCase() + str.substring(1);

    for (const element of actionsReferences) {
    this["show" + fnToFirstUpper( element ) + "Button" ] = true;
    }





    share|improve this answer




























      up vote
      0
      down vote













      You can use indexOf to achieve this:






      var actionsReferences = ['accept', 'reject', 'transfer']
      var showAcceptButton = actionsReferences.indexOf('accept') > -1;
      var showRejectButton = actionsReferences.indexOf('reject')> -1;
      var showTransferButton = actionsReferences.indexOf('transfer')> -1;

      console.log(showAcceptButton);
      console.log(showRejectButton);
      console.log(showTransferButton);








      share|improve this answer






























        up vote
        -1
        down vote













        You can use ternary operator like this :



        (element === 'accept') ?  this.showAcceptButton = true :  (element === 'reject') ? this.showRejectButton = true :    (element === 'transfer')  ?this.showTransferButton = true : alert('None of them')


        https://jsfiddle.net/Lwbmk616/2/






        share|improve this answer

















        • 2




          (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
          – greybeard
          Dec 8 '17 at 8:58












        protected by 200_success Dec 8 '17 at 12:50



        Thank you for your interest in this question.
        Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).



        Would you like to answer one of these unanswered questions instead?














        7 Answers
        7






        active

        oldest

        votes








        7 Answers
        7






        active

        oldest

        votes









        active

        oldest

        votes






        active

        oldest

        votes








        up vote
        5
        down vote



        accepted










        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);





        share|improve this answer



















        • 1




          Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
          – Ethan
          Dec 8 '17 at 10:32






        • 3




          Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
          – gntskn
          Dec 8 '17 at 13:52










        • This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
          – Micheal Johnson
          Dec 9 '17 at 16:03










        • Couldn't you use setAttribute instead of defining 3 functions?
          – Eric Duminil
          Dec 9 '17 at 16:28















        up vote
        5
        down vote



        accepted










        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);





        share|improve this answer



















        • 1




          Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
          – Ethan
          Dec 8 '17 at 10:32






        • 3




          Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
          – gntskn
          Dec 8 '17 at 13:52










        • This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
          – Micheal Johnson
          Dec 9 '17 at 16:03










        • Couldn't you use setAttribute instead of defining 3 functions?
          – Eric Duminil
          Dec 9 '17 at 16:28













        up vote
        5
        down vote



        accepted







        up vote
        5
        down vote



        accepted






        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);





        share|improve this answer














        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);






        share|improve this answer














        share|improve this answer



        share|improve this answer








        edited Nov 21 at 11:33









        Vogel612

        21.3k346128




        21.3k346128










        answered Dec 8 '17 at 8:40









        xander

        2007




        2007








        • 1




          Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
          – Ethan
          Dec 8 '17 at 10:32






        • 3




          Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
          – gntskn
          Dec 8 '17 at 13:52










        • This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
          – Micheal Johnson
          Dec 9 '17 at 16:03










        • Couldn't you use setAttribute instead of defining 3 functions?
          – Eric Duminil
          Dec 9 '17 at 16:28














        • 1




          Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
          – Ethan
          Dec 8 '17 at 10:32






        • 3




          Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
          – gntskn
          Dec 8 '17 at 13:52










        • This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
          – Micheal Johnson
          Dec 9 '17 at 16:03










        • Couldn't you use setAttribute instead of defining 3 functions?
          – Eric Duminil
          Dec 9 '17 at 16:28








        1




        1




        Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
        – Ethan
        Dec 8 '17 at 10:32




        Improve is very subjective... I see this and think its just overcomplicating things. Still cool though ;)
        – Ethan
        Dec 8 '17 at 10:32




        3




        3




        Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
        – gntskn
        Dec 8 '17 at 13:52




        Downvoting this answer since it adds significant complexity and opacity for no measurable benefit.
        – gntskn
        Dec 8 '17 at 13:52












        This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
        – Micheal Johnson
        Dec 9 '17 at 16:03




        This is way too bloated. See Booligoosh's answer, this is the simplest way and is what I would personally have suggested.
        – Micheal Johnson
        Dec 9 '17 at 16:03












        Couldn't you use setAttribute instead of defining 3 functions?
        – Eric Duminil
        Dec 9 '17 at 16:28




        Couldn't you use setAttribute instead of defining 3 functions?
        – Eric Duminil
        Dec 9 '17 at 16:28












        up vote
        17
        down vote













        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;
        }
        }





        share|improve this answer























        • The best and most concise answer here :)
          – Ethan
          Dec 8 '17 at 10:33






        • 1




          -1 because it uses the this token which represents a security risk in open environments.
          – Blindman67
          Dec 8 '17 at 11:16






        • 2




          @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
          – Nina Scholz
          Dec 8 '17 at 11:17










        • I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
          – Blindman67
          Dec 8 '17 at 12:28

















        up vote
        17
        down vote













        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;
        }
        }





        share|improve this answer























        • The best and most concise answer here :)
          – Ethan
          Dec 8 '17 at 10:33






        • 1




          -1 because it uses the this token which represents a security risk in open environments.
          – Blindman67
          Dec 8 '17 at 11:16






        • 2




          @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
          – Nina Scholz
          Dec 8 '17 at 11:17










        • I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
          – Blindman67
          Dec 8 '17 at 12:28















        up vote
        17
        down vote










        up vote
        17
        down vote









        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;
        }
        }





        share|improve this answer














        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;
        }
        }






        share|improve this answer














        share|improve this answer



        share|improve this answer








        edited Dec 8 '17 at 8:54









        Salman A

        1033




        1033










        answered Dec 8 '17 at 8:39









        Nina Scholz

        53438




        53438












        • The best and most concise answer here :)
          – Ethan
          Dec 8 '17 at 10:33






        • 1




          -1 because it uses the this token which represents a security risk in open environments.
          – Blindman67
          Dec 8 '17 at 11:16






        • 2




          @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
          – Nina Scholz
          Dec 8 '17 at 11:17










        • I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
          – Blindman67
          Dec 8 '17 at 12:28




















        • The best and most concise answer here :)
          – Ethan
          Dec 8 '17 at 10:33






        • 1




          -1 because it uses the this token which represents a security risk in open environments.
          – Blindman67
          Dec 8 '17 at 11:16






        • 2




          @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
          – Nina Scholz
          Dec 8 '17 at 11:17










        • I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
          – Blindman67
          Dec 8 '17 at 12:28


















        The best and most concise answer here :)
        – Ethan
        Dec 8 '17 at 10:33




        The best and most concise answer here :)
        – Ethan
        Dec 8 '17 at 10:33




        1




        1




        -1 because it uses the this token which represents a security risk in open environments.
        – Blindman67
        Dec 8 '17 at 11:16




        -1 because it uses the this token which represents a security risk in open environments.
        – Blindman67
        Dec 8 '17 at 11:16




        2




        2




        @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
        – Nina Scholz
        Dec 8 '17 at 11:17




        @Blindman67, it's not my use of this. and this has nothing to do with a shorter proposal.
        – Nina Scholz
        Dec 8 '17 at 11:17












        I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
        – Blindman67
        Dec 8 '17 at 12:28






        I am well aware it is not your use this I think your exelent answer is not as exelent an answer as the accepted answer. Your answer is not as flexible as the functional approch and I want votes to go to the better answer. What if on of the buttons required an additional action. Code already in place is usually adapted in light of new requirements rather than re-written which would degrade the quality of you code. The functional approch can handle unique actions without addition logic.
        – Blindman67
        Dec 8 '17 at 12:28












        up vote
        5
        down vote













        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;
        }





        share|improve this answer























        • Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
          – Peter
          Dec 8 '17 at 12:02










        • The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
          – gntskn
          Dec 8 '17 at 13:55










        • The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
          – xehpuk
          Dec 8 '17 at 15:51






        • 1




          @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
          – gntskn
          Dec 15 '17 at 10:30






        • 1




          @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
          – gntskn
          Dec 15 '17 at 10:32















        up vote
        5
        down vote













        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;
        }





        share|improve this answer























        • Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
          – Peter
          Dec 8 '17 at 12:02










        • The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
          – gntskn
          Dec 8 '17 at 13:55










        • The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
          – xehpuk
          Dec 8 '17 at 15:51






        • 1




          @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
          – gntskn
          Dec 15 '17 at 10:30






        • 1




          @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
          – gntskn
          Dec 15 '17 at 10:32













        up vote
        5
        down vote










        up vote
        5
        down vote









        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;
        }





        share|improve this answer














        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;
        }






        share|improve this answer














        share|improve this answer



        share|improve this answer








        edited Dec 9 '17 at 1:15

























        answered Dec 8 '17 at 8:38









        Ethan

        1506




        1506












        • Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
          – Peter
          Dec 8 '17 at 12:02










        • The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
          – gntskn
          Dec 8 '17 at 13:55










        • The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
          – xehpuk
          Dec 8 '17 at 15:51






        • 1




          @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
          – gntskn
          Dec 15 '17 at 10:30






        • 1




          @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
          – gntskn
          Dec 15 '17 at 10:32


















        • Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
          – Peter
          Dec 8 '17 at 12:02










        • The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
          – gntskn
          Dec 8 '17 at 13:55










        • The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
          – xehpuk
          Dec 8 '17 at 15:51






        • 1




          @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
          – gntskn
          Dec 15 '17 at 10:30






        • 1




          @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
          – gntskn
          Dec 15 '17 at 10:32
















        Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
        – Peter
        Dec 8 '17 at 12:02




        Was about to add this answer. The one thing I'd change is to add brackets to make it quicker for human to parse. this.showAcceptButton = (element === 'accept');
        – Peter
        Dec 8 '17 at 12:02












        The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
        – gntskn
        Dec 8 '17 at 13:55




        The first part of this answer is probably the best representation of what OP wanted in this entire thread; the second part could be improved by using || rather than a ternary: this.showAcceptButton = element === 'accept' || this.showAcceptButton
        – gntskn
        Dec 8 '17 at 13:55












        The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
        – xehpuk
        Dec 8 '17 at 15:51




        The first snippet is wrong because only at most one button will be visible in the end. The second example contains an obvious code smell, as already pointed out in the comment above.
        – xehpuk
        Dec 8 '17 at 15:51




        1




        1




        @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
        – gntskn
        Dec 15 '17 at 10:30




        @Carl these are not if else branches, they're === and || operations. The difference being that a) they do not accept any blocks, and are therefore a simpler and more primitive language structure and b) the compiler can (to some extent, since we're dynamic here) simply use CMP and OR instructions, which are simple math operations that do not require any branching at all.
        – gntskn
        Dec 15 '17 at 10:30




        1




        1




        @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
        – gntskn
        Dec 15 '17 at 10:32




        @Carl I now see that this comment was left before the answer was updated to use || over ternaries; I'll leave my comment in case anyone happens to have my imagined criticism, however :p
        – gntskn
        Dec 15 '17 at 10:32










        up vote
        0
        down vote













        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
        }





        share|improve this answer

























          up vote
          0
          down vote













          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
          }





          share|improve this answer























            up vote
            0
            down vote










            up vote
            0
            down vote









            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
            }





            share|improve this answer












            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
            }






            share|improve this answer












            share|improve this answer



            share|improve this answer










            answered Dec 8 '17 at 8:36









            Mihai Alexandru-Ionut

            15416




            15416






















                up vote
                0
                down vote













                Try bracket notation



                var fnToFirstUpper = (str) => str.charAt(0).toUpperCase() + str.substring(1);

                for (const element of actionsReferences) {
                this["show" + fnToFirstUpper( element ) + "Button" ] = true;
                }





                share|improve this answer

























                  up vote
                  0
                  down vote













                  Try bracket notation



                  var fnToFirstUpper = (str) => str.charAt(0).toUpperCase() + str.substring(1);

                  for (const element of actionsReferences) {
                  this["show" + fnToFirstUpper( element ) + "Button" ] = true;
                  }





                  share|improve this answer























                    up vote
                    0
                    down vote










                    up vote
                    0
                    down vote









                    Try bracket notation



                    var fnToFirstUpper = (str) => str.charAt(0).toUpperCase() + str.substring(1);

                    for (const element of actionsReferences) {
                    this["show" + fnToFirstUpper( element ) + "Button" ] = true;
                    }





                    share|improve this answer












                    Try bracket notation



                    var fnToFirstUpper = (str) => str.charAt(0).toUpperCase() + str.substring(1);

                    for (const element of actionsReferences) {
                    this["show" + fnToFirstUpper( element ) + "Button" ] = true;
                    }






                    share|improve this answer












                    share|improve this answer



                    share|improve this answer










                    answered Dec 8 '17 at 8:37









                    gurvinder372

                    1173




                    1173






















                        up vote
                        0
                        down vote













                        You can use indexOf to achieve this:






                        var actionsReferences = ['accept', 'reject', 'transfer']
                        var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                        var showRejectButton = actionsReferences.indexOf('reject')> -1;
                        var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                        console.log(showAcceptButton);
                        console.log(showRejectButton);
                        console.log(showTransferButton);








                        share|improve this answer



























                          up vote
                          0
                          down vote













                          You can use indexOf to achieve this:






                          var actionsReferences = ['accept', 'reject', 'transfer']
                          var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                          var showRejectButton = actionsReferences.indexOf('reject')> -1;
                          var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                          console.log(showAcceptButton);
                          console.log(showRejectButton);
                          console.log(showTransferButton);








                          share|improve this answer

























                            up vote
                            0
                            down vote










                            up vote
                            0
                            down vote









                            You can use indexOf to achieve this:






                            var actionsReferences = ['accept', 'reject', 'transfer']
                            var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                            var showRejectButton = actionsReferences.indexOf('reject')> -1;
                            var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                            console.log(showAcceptButton);
                            console.log(showRejectButton);
                            console.log(showTransferButton);








                            share|improve this answer














                            You can use indexOf to achieve this:






                            var actionsReferences = ['accept', 'reject', 'transfer']
                            var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                            var showRejectButton = actionsReferences.indexOf('reject')> -1;
                            var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                            console.log(showAcceptButton);
                            console.log(showRejectButton);
                            console.log(showTransferButton);








                            var actionsReferences = ['accept', 'reject', 'transfer']
                            var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                            var showRejectButton = actionsReferences.indexOf('reject')> -1;
                            var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                            console.log(showAcceptButton);
                            console.log(showRejectButton);
                            console.log(showTransferButton);





                            var actionsReferences = ['accept', 'reject', 'transfer']
                            var showAcceptButton = actionsReferences.indexOf('accept') > -1;
                            var showRejectButton = actionsReferences.indexOf('reject')> -1;
                            var showTransferButton = actionsReferences.indexOf('transfer')> -1;

                            console.log(showAcceptButton);
                            console.log(showRejectButton);
                            console.log(showTransferButton);






                            share|improve this answer














                            share|improve this answer



                            share|improve this answer








                            edited Dec 8 '17 at 10:05









                            Billal Begueradj

                            1




                            1










                            answered Dec 8 '17 at 8:46









                            Vipin Kumar

                            1172




                            1172






















                                up vote
                                -1
                                down vote













                                You can use ternary operator like this :



                                (element === 'accept') ?  this.showAcceptButton = true :  (element === 'reject') ? this.showRejectButton = true :    (element === 'transfer')  ?this.showTransferButton = true : alert('None of them')


                                https://jsfiddle.net/Lwbmk616/2/






                                share|improve this answer

















                                • 2




                                  (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                  – greybeard
                                  Dec 8 '17 at 8:58

















                                up vote
                                -1
                                down vote













                                You can use ternary operator like this :



                                (element === 'accept') ?  this.showAcceptButton = true :  (element === 'reject') ? this.showRejectButton = true :    (element === 'transfer')  ?this.showTransferButton = true : alert('None of them')


                                https://jsfiddle.net/Lwbmk616/2/






                                share|improve this answer

















                                • 2




                                  (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                  – greybeard
                                  Dec 8 '17 at 8:58















                                up vote
                                -1
                                down vote










                                up vote
                                -1
                                down vote









                                You can use ternary operator like this :



                                (element === 'accept') ?  this.showAcceptButton = true :  (element === 'reject') ? this.showRejectButton = true :    (element === 'transfer')  ?this.showTransferButton = true : alert('None of them')


                                https://jsfiddle.net/Lwbmk616/2/






                                share|improve this answer












                                You can use ternary operator like this :



                                (element === 'accept') ?  this.showAcceptButton = true :  (element === 'reject') ? this.showRejectButton = true :    (element === 'transfer')  ?this.showTransferButton = true : alert('None of them')


                                https://jsfiddle.net/Lwbmk616/2/







                                share|improve this answer












                                share|improve this answer



                                share|improve this answer










                                answered Dec 8 '17 at 8:48









                                Emad Dehnavi

                                1071




                                1071








                                • 2




                                  (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                  – greybeard
                                  Dec 8 '17 at 8:58
















                                • 2




                                  (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                  – greybeard
                                  Dec 8 '17 at 8:58










                                2




                                2




                                (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                – greybeard
                                Dec 8 '17 at 8:58






                                (Welcome to CR!) While this answers how can [I get the same result] avoiding if() ?: this being code review, please argue how it is an improvement.
                                – greybeard
                                Dec 8 '17 at 8:58







                                protected by 200_success Dec 8 '17 at 12:50



                                Thank you for your interest in this question.
                                Because it has attracted low-quality or spam answers that had to be removed, posting an answer now requires 10 reputation on this site (the association bonus does not count).



                                Would you like to answer one of these unanswered questions instead?



                                Popular posts from this blog

                                Сан-Квентин

                                8-я гвардейская общевойсковая армия

                                Алькесар