Does Sass have a switch function?

Question

With Sass' ability to use variables, one would hope there is a large set of logic functions we can do with them.

Is there a way to do something like this?

$someVar: someValue !default;  @switch $someVar {     @case 'red':         .arbitrary-css here {}      @break;      @case 'green':         .arbitrary-css here {}      @break;      @case 'blue':         .arbitrary-css here {}      @break; } 

However, I can't find anything in the Sass reference about this.

Answer 1

No there isn't any supported switch statement in sass but if you only need to use the switch statement to tweak a variable, you can use sass maps in a switch statement sort of way.

Using SASS maps in place of a switch statement

$newVar: map-get((     case_1_test_name : case_1_return_value,     case_2_test_name : case_2_return_value, ), $testVar); 

So here's an example:

$vehicle: car;  $vehicleSeating: map-get((     car : 4,     bus : 20, ), $vehicle);  //$vehicleSeating = 4 

The above example translated into if/else statements:

$vehicle: car;  @if ($vehicle == 'car') {     $vehicleSeating: 4; } @else if ($vehicle == 'bus'){     $vehicleSeating: 20; }  //$vehicleSeating = 4