"toggle" between 2 values in array - JS

Question

If I have an array containing an order of variables, lets use 2 colors for example:

["red","blue","red","blue","red","red"]

Is there a built-in function or well known method to "invert" the colors to the other color, so you end up with the result:

["blue","red","blue","red","blue","blue"]

SOME CONTEXT

So I have 3 arrays, one of colors like the above example, one with html ID's which looks like ["blue01","red01","blue02","blue03",...] and another with cell references in them looking like ["B2","D2","B3","B4",...]. I want to be able to "toggle" these variables in each array, as explained in the example above.

CURRENT CODE

At the minute I just have an event handler that hard codes the changes as such:

  $("#myonoffswitch").on("change",function(d){
    team = (team =="blue")? "red" : "blue" ;
    if (team =="blue"){
      divRange = ["blueBan1","redBan1","bluePick1","redPick1","redPick2","bluePick2","bluePick3","redBan2","blueBan2","redPick3","redPick4","bluePick4","bluePick5","redPick5"];
      cellRange = ["B12","D12","B2","D2","D3","B3","B4","D13","B13","D4","D5","B5","B6","D6"];
    }
    else{
      divRange = ["redBan1","blueBan1","redPick1","bluePick1","bluePick2","redPick2","redPick3","blueBan2","redBan2","bluePick3","bluePick4","redPick4","redPick5","bluePick5"]
      cellRange = ["D12","B12","D2","B2","B3","D3","D4","B13","D13","B4","B5","D5","D6","B6"];
    };
  });

i think the method i have in place is simpler than looping through, the divRange variables would be annoying to "toggle" with a for loop. - Agreed that would be another way of achieving this though. — JabbaWook
– JabbaWook, Commented Jun 15, 2016 at 13:44
What is your question then? "clean" is not an objective criteria, and if you're looking for opinions, SO doesn't do those. You might be able to ask this question on Code Review, but you should read their help center to determine if it is on topic. — Heretic Monkey
– Heretic Monkey, Commented Jun 15, 2016 at 13:46
I'll amend the question then, i guess what i'm asking is, is there a built in function? i was hoping to see if anyone knew neat ways of doing it by some other method if a built in method is not available. — JabbaWook
– JabbaWook, Commented Jun 15, 2016 at 13:48

Redu · Accepted Answer · 2016-06-15 13:49:02Z

2

I might do the job like this. Though i can not make sure if there is a better way of doing this

var arr = ["red","blue","red","blue","red","red"],
    map = {red :0, blue:1, lut: ["blue","red"]};
    arr = arr.map(e => map.lut[map[e]]);
console.log(arr);

answered Jun 15, 2016 at 13:49

Redu

26.3k6 gold badges61 silver badges84 bronze badges

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

Comments

Jeremy Thille · Accepted Answer · 2016-06-15 13:59:42Z

1

var array = ["red","blue","red","red","blue","red","blue"];

array = array.map( colour => colour === "red" ? "blue" : "red");

console.log(array);

If you have IDs after the colours, as you requested :

var array2 = ["red05","blue123","red85","red741","blue456","red789","blue320"];

array2 = array2.map( colour => colour.indexOf("red") > -1 ? colour.replace("red","blue") : colour.replace("blue","red"));

console.log(array2);

edited Jun 15, 2016 at 13:59

answered Jun 15, 2016 at 13:51

Jeremy Thille

26.4k12 gold badges48 silver badges64 bronze badges

1 Comment

JabbaWook Over a year ago

this is nifty, i think i prefer defining the mapping like this although @Redu answer works too. Would you know of a way to do this on the Array of IDs that have numbers after them, would it be something like `colour === "red*" ? "blue*" : "red*" ?

Collectives™ on Stack Overflow

"toggle" between 2 values in array - JS

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related