How can I use ranges in a switch case statement using JavaScript? So, instead of writing code for each and every single possibility, I'd like to group them in ranges, For example:
switch(myInterval){
case 0-2:
//doStuffWithFirstRange();
break;
case 3-6:
//doStuffWithSecondRange();
break;
case 6-7:
//doStuffWithThirdRange();
break;
default:
//doStuffWithAllOthers();
}
You have at least four options:
1. List each case
As shown by LightStyle, you can list each case explicitly:
switch(myInterval){
case 0:
case 1:
case 2:
doStuffWithFirstRange();
break;
case 3:
case 4:
case 5:
doStuffWithSecondRange();
break;
case 6:
case 7:
doStuffWithThirdRange();
break;
default:
doStuffWithAllOthers();
}
2. Use if / else if / else
If the ranges are large, that gets unwieldy, so you'd want to do ranges. Note that with if...else if...else if, you don't get to the later ones if an earlier one matches, so you only have to specify the upper bound each time. I'll include the lower bound in /*...*/ for clarity, but normally you would leave it off to avoid introducing a maintenance issue (if you include both boundaries, it's easy to change one and forget to change the other):
if (myInterval < 0) {
// I'm guessing this is an error
}
else if (/* myInterval >= 0 && */ myInterval <= 2){
doStuffWithFirstRange();
}
else if (/* myInterval >= 3 && */ myInterval <= 5) {
doStuffWithSecondRange();
}
else if (/* myInterval >= 6 && */ myInterval <= 7) {
doStuffWithThirdRange();
}
else {
doStuffWithAllOthers();
}
3. Use case with expressions:
JavaScript is unusual in that you can use expressions in the case statement, so we can write the if...else if...else if sequence above as a switch statement:
switch (true){
case myInterval < 0:
// I'm guessing this is an error
break;
case /* myInterval >= 0 && */ myInterval <= 2:
doStuffWithFirstRange();
break;
case /* myInterval >= 3 && */ myInterval <= 5:
doStuffWithSecondRange();
break;
case /* myInterval >= 6 && */ myInterval <= 7:
doStuffWithThirdRange();
break;
default:
doStuffWithAllOthers();
}
I'm not advocating that, but it is an option in JavaScript, and there are times it's useful. The case statements are checked in order against the value you give in the switch. (And again, lower bounds could be omitted in many cases because they would have matched earlier.) Even though the cases are processed in source-code order, the default can appear anywhere (not just at the end) and is only processed if either no cases matched or a case matched and fell through to the default (didn't have a break; it's rare you want to do that, but it happens).
4. Use a dispatch map
If your functions all take the same arguments (and that could be no arguments, or just the same ones), another approach is a dispatch map:
In some setup code:
var dispatcher = {
0: doStuffWithFirstRange,
1: doStuffWithFirstRange,
2: doStuffWithFirstRange,
3: doStuffWithSecondRange,
4: doStuffWithSecondRange,
5: doStuffWithSecondRange,
6: doStuffWithThirdRange,
7: doStuffWithThirdRange
};
Then instead of the switch:
(dispatcher[myInterval] || doStuffWithAllOthers)();
That works by looking up the function to call on the dispatcher map, defaulting to doStuffWithAllOthers if there's no entry for that specific myInterval value using the curiously-powerful || operator, and then calling it.
You can break that into two lines to make it a bit clearer:
var f = dispatcher[myInterval] || doStuffWithAllOthers;
f();
I've used an object for maximum flexibility. You could define dispatcher like this with your specific example:
var dispatcher = [
/* 0-2 */
doStuffWithFirstRange,
doStuffWithFirstRange,
doStuffWithFirstRange,
/* 3-5 */
doStuffWithSecondRange,
doStuffWithSecondRange,
doStuffWithSecondRange,
/* 6-7 */
doStuffWithThirdRange,
doStuffWithThirdRange
];
...but if the values aren't contiguous numbers, it's much clearer to use an object instead.
The ranges in this example are pretty small, but here's how one can handle larger ranges, per the JavaScript MDN Docs:
// The value we'll be evaluating:
let code = 100;
// Matches for any case where the expression === `true`:
switch (true) {
case code <= 64:
return "Your number is 64 or less!";
break;
case code >= 65 && code <= 90:
return "Your number is in the range of 65-90!";
break;
case code >= 97 && code <= 122:
return "Your number is in the range of 97-122!";
break;
case code >= 123:
return "Your number is 123 or greater!";
break;
default:
break;
}
I know that this style was already shown by T.J. Crowder via Use case with Expressions, but I just wanted to show another example of how to utilize this same method. I just did this and had thought maybe another example might help someone, as I was still a little confused after reading other replies.
Is this maybe what you need?
switch(myInterval){
case 0:
case 1:
case 2:
//doStuff();
break;
case 3:
case 4:
case 5:
case 6:
//doStuff();
break;
case 6:
case 7:
//doStuff();
break;
default:
//doStuff();
}
If you know the range is going to be very high(for example 0-100) you can also do this, which is surely easier, cleaner and simpler:
if (myInterval >= 0 && myInterval <= 20) {
//doStuff();
} else if (myInterval > 20 && myInterval <= 60) {
//doStuff();
} else if (myInterval > 60 && myInterval <= 70) {
//doStuff();
} else /* it is greater than 70 */ {
//doStuff();
}
If your ranges are the same and start from 0 you can do some math.
doStuffWithRange(Math.floor(myInterval/range));
For example, if you want RED, GREEN, and BLUE to the map like your example:
Range 0-2 maps to RED
Range 3-6 maps to GREEN
Range 7-8 maps to BLUE
You can write:
function colorInterval(n, max) {
var colors = ["RED", "GREEN", "BLUE"];
var range = max/colors.length
return colors[Math.floor(n/range)];
}
//You get 3 of RED, 3 of GREEN, 2 of BLUE
for (var i=0; i<8; i++) {
console.log(colorInterval(i, 8));
}
Note that the last range in the example is 2, not 3 and this still works as long as the previous ranges are the same.
To add a bit of diversity to the excellent answers already posted, especially as the intervals starts with 0, here is a solution with findIndex (Yeah ES6):
const range = [0, 2, 6, 7];
const randeIndex = range.findIndex(threshold => myInterval <= threshold);
switch (rangeIndex) {
case 1:
//doStuffWithFirstRange();
break;
case 2:
//doStuffWithSecondRange();
break;
case 3:
//doStuffWithThirdRange();
break;
default:
//doStuffWithAllOthers();
}
Because the range array is ordered, findIndex will match the first one. Depending on how you name your ranges, stating from 0 or 1, you may need to remove the first 0 in range.
Use case statement with defined string or value or use "if else if", in case range is higher
int levelNumber = YOUR_VALUE FROM
NSString* strMessage;
switch (levelNumber) {
case 1...10:
{
// Do something...
break;
}
case 11...20:
{
// Do something...
break;
}
case 21...30:
{
// Do something...
break;
}
case 31...40:
{
// Do something...
break;
}
default:
break;
}
Refer:
https://www.codingexplorer.com/loops-switch-statements-ranges-swift/
Related
Trying simple switch with random number.
It does not seem to work. Always getting to default case.
var x = 0;
x = (Math.random() * 10 + 1);
switch(x) {
case x >= 5:
console.log("the number is bigger than 5");
break;
case x <= 5:
console.log("the number is smaller than 5");
break;
default:
console.log("strange number");
}
console.log(x);
The output is always similar to that:
strange number
5.922413225153608
That's just not how switch statements work in JavaScript,1 what you're looking for there is an if/else if/else series instead:
if (x >= 5) {
console.log("the number is bigger than 5");
} else if (x <= 5) {
console.log("the number is smaller than 5");
} else {
console.log("strange number");
}
Two notes, though:
Your first and second cases both include 5; the first will win.
The only value for x that will reach the final else is NaN (or something that converts to NaN when converted to number), because NaN >= 5 and NaN <= 5 are both false.
In a comment you've said:
Thanks, the point is to practice switch.
If so, you'll either have to do the thing below (which probably isn't what your instructor wanted), or limit the range of values, because the cases of a switch are tested for exact match.
For instance, if you changed your code only allow integers, you could use cases with fall-through:
var x = 0;
x = Math.floor(Math.random() * 10 + 1); // Note change: Only integers
switch(x) {
case 5:
case 6:
case 7:
case 8:
case 9:
case 10:
console.log("the number is bigger than 5");
break;
case 1:
case 2:
case 3:
case 4:
console.log("the number is smaller than 5");
break;
default:
console.log("strange number");
}
console.log(x);
That makes use of the fact that cases fall through to the following case when you don't use break.
But you can't do that with your original x, because there are just too many floating-point values in the range 1 <= x < 11 to list.
JavaScript's switch does have a feature that makes it possible to use switch here, but an if/else if/else is almost certainly a better choice. Purely for completeness:
// PROBABLY NOT A GOOD IDEA
switch (true) {
case x >= 5:
console.log("the number is bigger than 5");
break;
case x <= 5:
console.log("the number is smaller than 5");
break;
default:
console.log("strange number");
break;
}
That works because unlike many languages, JavaScript's switch cases are allowed to be expressions, and they're tested in the order in which they appear in the switch (other than default, of course), with the first matching case being used.
But again, probably not great to use in the real world except in very, very limited situations.
Between case and : you have to have a value.
x >= 5 and x <= 5 are going to give you true or false, which x will then be compared to. Since x will always be a number, it will never be true or false so you will always hit the default.
Use if/else if/else instead.
You can't do in thatway. You have to do
switch(true) {
case x >= 5:
console.log("the number is bigger than 5");
break;
case x <= 5:
console.log("the number is smaller than 5");
break;
default:
console.log("strange number");
}
While switch is using strict comparison and you have already in the case clause already a comparison, you could change your switch statement to
switch(true) {
and use the rest, you have.
Here is my script
var marks = 11;
switch (marks) {
case (marks < 20):
console.log('Yes Freaking Failed');
break;
case (marks > 20):
console.log('Ahh Its Ok');
break;
case (marks > 80):
console.log('Whooping');
break;
default:
console.log('Cant say u maybe Flunked');
break;
}
I think it should display 'Yes Freaking Failed' because the marks are less than 20. But it shows 'Cant say u maybe Flunked'
Why is that?
When you write
switch (x) {
case(y):
...
}
it's equivalent to testing
if (x == y) {
...
}
So
case (marks < 20):
means:
if (marks == (marks < 20)) {
You can't use case for range tests like this, you need to use a series of if/else if:
if (marks < 20) {
console.log('Yes Freaking Failed');
} else if (marks < 80) {
console.log('Ahh Its OK');
} else {
console.log('Whooping');
}
Also notice that if it worked the way you thought, it could never execute marks > 80, because that would also match marks > 20, and the first matching case is always executed.
There's no need for the Cant say u maybe flunked case, because there are no other possibilities.
Technically it's not possible. Javascript makes it so.
If you need to compare, use if/else if/else.
Switch cases are for when you know you will have specific values.
var marks=11;
switch(marks){
case (11):
console.log('It would go in here');
break;
case (42):
console.log('If equal to 42');
break;
case (80):
console.log('if equal to 80.');
break;
default:
console.log('Cant say u maybe Flunked');
break;
}
Your code is equivalent to:
var marks=11;
switch(marks){
case (true):
console.log('Yes Freaking Failed');
break;
case (false):
console.log('Ahh Its Ok');
break;
case (false):
console.log('Whooping');
break;
default:
console.log('Cant say u maybe Flunked');
break;
}
marks is not true and is not false - so switch goes to default.
when you use switch statement, you are evaluating marks and compare the values of marks with the cases. And you have the following cases: 1, 0, 0, default. It's because (marks<20) evaluates to true which is 1, and the other two are false, which is 0.
So you should do if and else if in your case.
<script type="text/javascript">
//You will receive a different greeting based
//on what day it is. Note that Sunday=0,
//Monday=1, Tuesday=2, etc.
var d = new Date();
var theDay = d.getDay();
switch (theDay)
{
case 5:
document.write("Finally Friday");
break;
case 6:
document.write("Super Saturday");
break;
case 0:
document.write("Sleepy Sunday");
break;
default:
document.write("I'm looking forward to this weekend!");
}
</script>
If the theDay = 5, then we display Finally Friday. I want if theDay !=5, then display 'Finally Something'.. similarly for others too...
Is it possible without an If/else condition. If the case 5 does not execute, can i do something else in that place?
Is it possible without an If/else condition. If the case 5 does not execute, can i do something else in that place?
No.
The switch statement will execute the first matching case, and then keep going (ignoring all further case labels) until it gets to either a break statement or the end of the switch block - but even though you can "fall through" to subsequent cases by omitting the break statement the switch does not provide any mechanism to say "do something when this case isn't matched/executed, but also keep trying to look for a matching case".
What you are describing would normally be done with a series of if/else statements:
var d = new Date(),
theDay=d.getDay(),
matched = false;
if (theDay === 5) {
matched = true;
document.write("Finally Friday");
} else {
// your != 5 case here
}
if (theDay === 6) {
matched = true;
document.write("Super Saturday");
} else {
// your != 6 case here
}
if (theDay === 0) {
matched = true;
document.write("Sleepy Sunday");
} else {
// your != 0 case here
}
// default when none matched:
if (!matched) {
document.write("I'm looking forward to this weekend!");
}
Note that I've added a matched flag to allow the default to work. And note that there are no else if statements because you need every if/else pair to execute.
If you are really determined to use a switch statement you could do something silly like the following:
var d = new Date(),
theDay = d.getDay(),
c,
cases = { // pre-list all the "not" cases
"!5" : true,
"!6" : true,
"!0" : true
};
// add case for theDay and remove the "not" case for theDay (if there is one)
cases[theDay] = true;
if (cases["!" + theDay])
delete cases["!" + theDay];
for (c in cases) {
switch(c) {
case "5":
document.write("Finally Friday");
break;
case "!5":
document.write("Finally Something");
break;
case "6":
document.write("Super Saturday");
break;
case "!6":
document.write("Finally Something - but not 6");
break;
case "0":
document.write("Sleepy Sunday");
break;
case "!0":
document.write("Finally Something - but not 0");
break;
default:
document.write("I'm looking forward to this weekend!");
}
}
If you need the cases to execute in a specific order use an array rather than an object.
Its like switch does a jump to the matching case, if it doesn't match it will jump to what matches. The answer to your question "If the case 5 does not execute, can i do something else in that place?" is No, because it never reaches that case at all. It jumps to the next matching case or default.
Is it possible without an If/else condition. If the case 5 does not execute, can i do something else in that place?
Use a default code block as seen below. Anything that doesn't match the cases will fallback to the default one.
switch(expression) {
case x:
// code block
break;
case y:
// code block
break;
default:
// code block
}
How this works:
The value of the expression is compared with the values of each case.
If there is a match, the associated block of code is executed.
If there is no match, the default code block is executed.
A standard if/else would be the best way to achieve this. I wonder why you want to do it without.
That said, It's not very elegant, but you could try adding the following to the top of your switch statement:
case 0:
case 1:
case 2:
case 3:
case 4:
case 6:
document.write("Finally Something");
Giving you:
switch (theDay)
{
case 0:
case 1:
case 2:
case 3:
case 4:
case 6:
document.write("Finally Something");
case 5:
document.write("Finally Friday");
break;
case 6:
document.write("Super Saturday");
break;
case 0:
document.write("Sleepy Sunday");
break;
default:
document.write("I'm looking forward to this weekend!");
}
You can do something like:
var something = 0;
switch (theDay) {
case 5:
document.write("Finally Friday");
something = 15;
break;
case 6:
document.write("Super Saturday");
something = 16;
break;
case 0:
document.write("Sleepy Sunday");
something = 20;
break;
default:
document.write("I'm looking forward to this weekend!");
}
switch (something) {
case 15: document.write("Not Friday"); break;
case 16: document.write("Not Saturday"); break;
case 20: document.write("Not Sunday"); break;
default: document.write("Nothing"); break;
}
Overly complicated answers.
Simplify.
var switchElse = true;
switch (CHECK_SOMETHING)
{
case "SOME_VALUE":
...DO SOMETHING...
switchElse = false;
break;
default:
}
if (switchElse)
{
...DO ELSE...
}
The only solution that can be formulated without a compare.
USE "DEFAULT" PATTERN
var myValue = "Friday"
switch (CHECK_SOMETHING)
{
case "SOME_VALUE":
myValue = "Some Other Day";
default:
}
switch (t.value) {
case < 5:
alert('hi');
break;
}
I know it's the part where I have "< 5". How do I make it so that it has a case where t.value is less than 5??
switch only supports equality comparisons.
if (t.value < 5) {
alert('hi');
}
I don't know if it fits your particular case, but you could also do something like this:
switch (t.value) {
case 5:
case 4:
case 3:
case 2:
case 1:
alert('hi');
break;
}
An if statement seems best suited for this purpose, but although I do not recommend it the fact that JavaScript will let you switch on any datatype (and not just numbers/enums like some languages) means you can do this:
switch(true) {
case t.value < 5:
// do something
break;
case t.value >= 112:
// do something
break;
case someOtherVar == 17:
// do something
break;
case x == 7:
case y == "something":
case z == -12:
case a == b * c:
// works with fallthrough
break;
case someFunc():
// even works on a function call (someFunc() should return true/false)
break;
default:
// whatever
break;
}
The above should select whichever case matches first, noting that several if not all of the cases could be true.
In a way that style is more readable than a long series of if/else if, but I wouldn't use it in a team development environment where it could confuse other developers.
Another, more conventional use of switch for your less than 5 scenario would be as follows (assuming you know the range that t.value could possibly be):
switch(t.value) {
case 0:
case 1:
case 2:
case 3:
case 4:
// do something
break;
case 5:
// etc
}
switch statements don't support less-than or greater-than comparisons (or anything other than equals). Use:
if (t.value < 5) {
alert("hi");
}
default:
if(t.value< 5)
alert('hi');
break;
Maybe it's you want!
well i have this trouble and ive been dealing with but i just cant get it to work
i have this function
function getDirections(dir)
{
var img;
switch(dir)
{
case 0:
img+='N.png';
break;
case 1:
img+='NE.png';
break;
case 2:
img+='E.png';
break;
case 3:
img+='SE.png';
break;
case 4:
img+='S.png';
break;
case 5:
img+='SO.png';
break;
case 6:
img+='O.png';
break;
case 7:
img+='NO.png';
break;
default:
alert('enetered default but direction='+dir);
}
return img;
}
quite simple right? now i have this interval set to 5000 ms to call getDirections(variable), the function works well the first time its called but after that , it always enter in the default clause and it also alerts the 'entered default but direction=dirvalue' , i mean even if dir is a value between 0-7 it will always enter to default: but it would alert the value so it was supossed to enter to one of the cases.
i made the same using else if and it worked so i dont know what its wrong with SWITCH
if(dir==0){img+='N.png';}
else if(dir==1){img+='NE.png';}
else if(dir==2){img+='E.png';}
else if(dir==3){img+='SE.png';}
else if(dir==4){img+='S.png';}
else if(dir==5){img+='SO.png';}
else if(dir==6){img+='O.png';}
else if(dir==7){img+='NO.png';}
That is weird... try to make sure that dir is an int, do this before the switch:
dir = parseInt(dir);
If the alert shows the value correctly it should enter the switch, but still it can "look" correct but be of a different data type. Do the conversion manually to ensure it's an int
I know I'm a bit late to the party, but I thought it might be important for anyone who doesn't understand why the "ifs" worked and the switch didn't. It's likely no one will read this answer, but I found it while searching for something else, so perhaps someone will find this helpful anyway:
Your switch is this:
function getDirections(dir) {
var img;
switch(dir) {
case 0:
img+='N.png';
break;
case 1:
img+='NE.png';
break;
case 2:
img+='E.png';
break;
case 3:
img+='SE.png';
break;
case 4:
img+='S.png';
break;
case 5:
img+='SO.png';
break;
case 6:
img+='O.png';
break;
case 7:
img+='NO.png';
break;
default:
alert('enetered default but direction='+dir);
}
return img;
}
This is not the same as a series of double equals (==) but a series of triple equals (===). It would be equivalent to:
if (dir === 0) {
img+='N.png';
} else if (dir === 1) {
img+='NE.png';
} else if (dir === 2) {
img+='E.png';
} else if (dir === 3) {
img+='SE.png';
} else if (dir === 4) {
img+='S.png';
} else if (dir === 5) {
img+='SO.png';
} else if (dir === 6) {
img+='O.png';
} else if (dir === 7) {
img+='NO.png';
} else {
alert('enetered default but direction='+dir);
}
In the world of "==", the integer 2 IS the same as the string "2", but not in the land of "===".
I'd guess that for some reason dir is being passed in as a string. Try changing case 1: to case '1':
Using an array instead of a chain of if/else blocks or a giant switch statement will be faster, more flexible and less error-prone. Also, you wouldn't have to worry if dir is a number or a string. Instead of:
if(dir==0){img+='N.png';}
else if(dir==1){img+='NE.png';}
else if(dir==2){img+='E.png';}
else if(dir==3){img+='SE.png';}
else if(dir==4){img+='S.png';}
else if(dir==5){img+='SO.png';}
else if(dir==6){img+='O.png';}
else if(dir==7){img+='NO.png';}
you can store the file names in an array:
var images = [
'N.png', 'NE.png', 'E.png', 'SE.png', 'S.png', 'SO.png', 'O.png', 'NO.png'
];
or arguably more readable:
var images = "N.png NE.png E.png SE.png S.png SO.png O.png NO.png".split(' ');
and then use just:
img = images[dir];
Full implementation of getDirections using an array would be:
var images = "N.png NE.png E.png SE.png S.png SO.png O.png NO.png".split(' ');
function getDirections(dir) {
var img = images[dir];
if (!img) {
alert("something");
}
return img;
}
Does it work for you?
If images is used only in that one function then you may want to store it as a property of the function to avoid your namespace pollution like this:
function getDirections(dir) {
var img = getDirections.images[dir];
if (!img) {
alert("something");
}
return img;
}
getDirections.images =
"N.png NE.png E.png SE.png S.png SO.png O.png NO.png".split(' ');
or use a closure.
Hard to explain why, but the default: case also need a break; statement after it like all the other cases.
I just ran the code in FireFox/FireBug and called the function this way
getDirections(0);
getDirections('1');
getDirections("2");
The first one does it correctly and the next two enter default.
They are strings and not integer which is what the cases are looking for.
I added
case "2":
img+='NO2.png';
break;
and then only the middle one entered the default. Obviously there is an issue with the way you are calling the function. It is likely passing a string.
I also used your if-else block (added an else{alert(dir);} and that returned the correct value for each call.
Javascript can do on the fly conversion (I think there's a better word for that) between strings and ints (and others). This is occuring when you do the comparrison using ==. If you change the comparison in the ifs to === you get the same behavior as with the switch block.
I pasted your code into an HTML file and ran it with the following buttons:
<button onclick="alert(getDirections(2))">Switch / Int</button>
<button onclick="alert(getDirections('2'))">Switch / String</button>
<button onclick="alert(getDirections2(2))">If-Else / Int</button>
<button onclick="alert(getDirections2('2'))">If-Else / String</button>
When calling the switch-version with a plain 2, it works as expected. Calling it with '2' makes it drop through to the default line. The if-else version works as expected in both cases. So the issue is probably that switch doesn't do an implicit conversion and == does.