Why my code with switch(true) and Array.concat() doesn't work properly

Question

//JavaScript:

    function concatArrays() {
      var recentlyCompleted = ["rc1", "rc2"];
      var upcomingActivities = [];
      var decisionsRequired = [];
      var records = [];
        switch(true) {
          case (recentlyCompleted.length >0):
            records.concat(recentlyCompleted);
            console.log("recentlyCompleted.length >0");
            console.log(records);
          case (upcomingActivities.length >0):
            records.concat(upcomingActivities);
            console.log("upcomingActivities.length >0");
            console.log(records);
          case (decisionsRequired.length >0):
            records.concat(decisionsRequired);
            console.log("decisionsRequired.length >0");
            console.log(records);
            break;
        }
      document.getElementById("demo").innerHTML = JSON.stringify(records);
      
      var records2 = recentlyCompleted.concat(upcomingActivities).concat(decisionsRequired);
      document.getElementById("demo2").innerHTML = JSON.stringify(records2);
    }

    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>switch(true)</title>
    </head>
    <body>
      <p>Click the button to join arrays.</p>
      <button onclick="concatArrays()">Try it</button>
      <p id="demo"></p>
      <p id="demo2"></p>
    </body>

Sorry please I have read that the main advantage over the obvious if else if sequence is the ability to omit the break statement and execute more than one block. I wanted to execute more than one block in my case(true) code. But I see something wrong with this simple code.

I am very sorry but could you explain what's wrong with part of this code with switch(true) Thanks!

Execution more than one block:

Screenshot of the execution of the correct answer:

function concatArrays() {
  var recentlyCompleted = ["rc1", "rc2"];
  var upcomingActivities = [];
  var decisionsRequired = [];
  var records = [];
  switch (true) {
    case (recentlyCompleted.length > 0):
      records = records.concat(recentlyCompleted);
      console.log("recentlyCompleted.length >0");
      console.log(records);
    case (upcomingActivities.length > 0):
      records = records.concat(upcomingActivities);
      console.log("upcomingActivities.length >0");
      console.log(records);
    case (decisionsRequired.length > 0):
      records = records.concat(decisionsRequired);
      console.log("decisionsRequired.length >0");
      console.log(records);
      break;
  }
  document.getElementById("demo").innerHTML =
    JSON.stringify(records);

  var records2 = recentlyCompleted
    .concat(upcomingActivities)
    .concat(decisionsRequired);
  document.getElementById("demo2").innerHTML =
    JSON.stringify(records2);
}

[`switch`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/switch): _"A switch statement first evaluates its expression. It then looks for the first case clause whose expression evaluates to the same value as the result of the input expression (using the strict comparison, ===) and transfers control to that clause, executing the associated statements. (**If multiple cases match the provided value, the first case that matches is selected, even if the cases are not equal to each other**.)"_ — Andreas, Jul 30 '19 at 10:20
In Switch is only equal conditions are allowed. Otherwise use IF statement. — daremachine, Jul 30 '19 at 10:21

Bergi · Accepted Answer · 2019-07-30T10:42:14.230

2

A case without a break doesn't re-evaluate the next case for equality, but just runs the block unconditionally - called fallthrough. I doubt this is what you wanted. Use multiple successive if statements instead (not an if-else chain) - or just go for the records2 approach if you don't care about the log statements.

Second, concat creates a new array, it doesn't mutate the target by appending to it. See How to append something to an array? or How to extend an existing JavaScript array with another array, without creating a new array for various solutions.

edited Jul 30 '19 at 10:42

answered Jul 30 '19 at 10:26

Bergi

630,263
148
957
1,375

Thank you @Bergi! concat creates a new array, it doesn't mutate the target by appending to it Correct! – Alex Pilugin Jul 30 '19 at 10:40
A case without a break doesn't re-evaluate the next case for equality, but just runs the block unconditionally... Many thanks to you, Bergi! – Alex Pilugin Jul 30 '19 at 10:58

score -1 · Answer 2 · answered Jul 30 '19 at 10:28

-1

You should take a look at the spread operator:

var records = [...recentlyCompleted, ...upcomingActivities, ..decisionsRequired]

Also your records and records2 are always going to be the same.

answered Jul 30 '19 at 10:28

Jacobdo

1,681
2
18
38

Why my code with switch(true) and Array.concat() doesn't work properly

2 Answers2