Why isn't my jquery switch statement working? - javascript

I am trying a jquery (javascript) switch statement with some simple operators but it isn't working as expecting
console.log('test '+getShippingCost(8));
function getShippingCost(shop_qty) {
shipping_costs = 0;
dest = $("input[name='dest']").val();
console.log(dest);
if (dest === 'DOMESTIC') {
switch (shop_qty) {
case (shop_qty > 4):
shipping_costs = 3.5;
break;
case (shop_qty <= 4):
shipping_costs = 2;
break;
}
console.log('domestic shipping '+shipping_costs);
}
if (dest === 'INT') {
switch (shop_qty) {
case (shop_qty > 4):
shipping_costs = 4.5;
break;
case (shop_qty <= 4):
shipping_costs = 3;
break;
}
}
return shipping_costs;
}//end function
see see jsfiddle

To use conditions for the cases in a switch, you would look for a true value among the cases:
switch (true) {
case (shop_qty > 4):
shipping_costs = 3.5;
break;
case (shop_qty <= 4):
shipping_costs = 2;
break;
}
As the second case is the inverse of the first, you can just use default for that:
switch (true) {
case (shop_qty > 4):
shipping_costs = 3.5;
break;
default:
shipping_costs = 2;
break;
}
Such a construct fits better when you have several conditions. You should consider if an if statement would be a better fit in this case:
if (shop_qty > 4) {
shipping_costs = 3.5;
} else {
shipping_costs = 2;
}
As both cases assign a value to the same variable, you can also write it using the conditional operator:
shipping_costs = shop_qty > 4 ? 3.5 : 2;

Cases in switch statements evaluate values, not boolean expressions: See Here.
You can put the logic suggested by your attempted use of the switch statement in a ternary expression, e.g.:
shipping_costs = (shop_qty > 4) ? 3.5 : 2;

Switch doesn't work by evaluating boolean expressions. Switch evaluates an initial expression and then tries to match the cases to that expression using strict equality. So you can't do
case(x<4.5):
You have to do something like
case 4:
Use if, else if, else statments instead.

Related

Why this switch isn't giving any output? [duplicate]

Am I writing the correct switch case with conditions?
var cnt = $("#div1 p").length;
alert(cnt);
switch (cnt) {
case (cnt >= 10 && cnt <= 20):
alert('10');
break;
case (cnt >= 21 && cnt <= 30):
alert('21');
break;
case (cnt >= 31 && cnt <= 40):
alert('31');
break;
default:
alert('>41');
}
For some reason, the alert does not occur when the conditions are matched!
A switch works by comparing what is in switch() to every case.
switch (cnt) {
case 1: ....
case 2: ....
case 3: ....
}
works like:
if (cnt === 1) ...
if (cnt === 2) ...
if (cnt === 3) ...
Therefore, you can't have any logic in the case statements.
switch (cnt) {
case (cnt >= 10 && cnt <= 20): ...
}
works like
if (cnt === (cnt >= 10 && cnt <= 20)) ...
and that's just nonsense. :)
Use if () { } else if () { } else { } instead.
You should not use switch for this scenario. This is the proper approach:
var cnt = $("#div1 p").length;
alert(cnt);
if (cnt >= 10 && cnt <= 20)
{
alert('10');
}
else if (cnt >= 21 && cnt <= 30)
{
alert('21');
}
else if (cnt >= 31 && cnt <= 40)
{
alert('31');
}
else
{
alert('>41');
}
This should work with this :
var cnt = $("#div1 p").length;
switch (true) {
case (cnt >= 10 && cnt <= 20):
alert('10');
break;
case (cnt >= 21 && cnt <= 30):
alert('21');
break;
case (cnt >= 31 && cnt <= 40):
break;
default:
alert('>41');
}
Something I came upon while trying to work a spinner was to allow for flexibility within the script without the use of a ton of if statements.
Since this is a simpler solution than iterating through an array to check for a single instance of a class present it keeps the script cleaner. Any suggestions for cleaning the code further are welcome.
$('.next').click(function(){
var imageToSlide = $('#imageSprite'); // Get id of image
switch(true) {
case (imageToSlide.hasClass('pos1')):
imageToSlide.removeClass('pos1').addClass('pos2');
break;
case (imageToSlide.hasClass('pos2')):
imageToSlide.removeClass('pos2').addClass('pos3');
break;
case (imageToSlide.hasClass('pos3')):
imageToSlide.removeClass('pos3').addClass('pos4');
break;
case (imageToSlide.hasClass('pos4')):
imageToSlide.removeClass('pos4').addClass('pos1');
}
}); `
What you are doing is to look for (0) or (1) results.
(cnt >= 10 && cnt <= 20) returns either true or false.
--edit--
you can't use case with boolean (logic) experessions. The statement cnt >= 10 returns zero for false or one for true. Hence, it will we case(1) or case(0) which will never match to the length.
--edit--
function date_conversion(start_date){
var formattedDate = new Date(start_date);
var d = formattedDate.getDate();
var m = formattedDate.getMonth();
var month;
m += 1; // JavaScript months are 0-11
switch (m) {
case 1: {
month="Jan";
break;
}
case 2: {
month="Feb";
break;
}
case 3: {
month="Mar";
break;
}
case 4: {
month="Apr";
break;
}
case 5: {
month="May";
break;
}
case 6: {
month="Jun";
break;
}
case 7: {
month="Jul";
break;
}
case 8: {
month="Aug";
break;
}
case 9: {
month="Sep";
break;
}
case 10: {
month="Oct";
break;
}
case 11: {
month="Nov";
break;
}
case 12: {
month="Dec";
break;
}
}
var y = formattedDate.getFullYear();
var now_date=d + "-" + month + "-" + y;
return now_date;
}
Switch case is every help full instead of if else statement :
switch ($("[id*=btnSave]").val()) {
case 'Search':
saveFlight();
break;
case 'Update':
break;
case 'Delete':
break;
default:
break;
}
Ok it is late but in case you or someone else still want to you use a switch or simply have a better understanding of how the switch statement works.
What was wrong is that your switch expression should match in strict comparison one of your case expression. If there is no match it will look for a default. You can still use your expression in your case with the && operator that makes Short-circuit evaluation.
Ok you already know all that. For matching the strict comparison you should add at the end of all your case expression && cnt.
Like follow:
switch(mySwitchExpression)
case customEpression && mySwitchExpression: StatementList
.
.
.
default:StatementList
var cnt = $("#div1 p").length;
alert(cnt);
switch (cnt) {
case (cnt >= 10 && cnt <= 20 && cnt):
alert('10');
break;
case (cnt >= 21 && cnt <= 30 && cnt):
alert('21');
break;
case (cnt >= 31 && cnt <= 40 && cnt):
alert('31');
break;
default:
alert('>41');
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="div1">
<p> p1</p>
<p> p2</p>
<p> p3</p>
<p> p3</p>
<p> p4</p>
<p> p5</p>
<p> p6</p>
<p> p7</p>
<p> p8</p>
<p> p9</p>
<p> p10</p>
<p> p11</p>
<p> p12</p>
</div>

How do i make switch and if statement in one function

function texas(val) {
var answer = "";
switch(val) {
case 1:
case 2:
case 3:
var answer = "low";
case 4:
case 5:
case 6:
var answer = "medium";
break;
} else if(val => 7) {
var answer = "Huge"
}
return answer;
}
it says error Declaration or statement expected. ts(1128) [13, 7]
and it poits at the else if statement
You can use the "default" keyword, but you should probably update your code in order to handle the cases in which the value of the parameter is not positive or not a number:
function texas(val) {
if (val <= 0 || isNan(val)) {
throw new InvalidOperationException("val should be a positive number");
}
switch(val) {
case 1:
case 2:
case 3:
return "low";
case 4:
case 5:
case 6:
return "medium";
default:
return "Huge"
}
}
It's >= and the elsehas to be deleted. The varfor answer is unnecesary, just declare it once with let. You forgot the break in case 3:.
function texas(val) {
let answer = "";
switch(val) {
case 1:
case 2:
case 3:
answer = "low";
break;
case 4:
case 5:
case 6:
answer = "medium";
break;
}
if(val >= 7) {
answer = "Huge"
}
return answer;
}
console.log(texas(2));
console.log(texas(8));
You just need to return in the switch
function texas(val) {
var answer = "";
switch(val) {
case 1:
case 2:
case 3:
var answer = "low";
return answer;
case 4:
case 5:
case 6:
var answer = "medium";
return answer;
}
if(val => 7) {
var answer = "Huge"
}
return answer;
}
The syntax does not allow to put an else after a switch. else only makes sense in combination with an if statemen. But switch has a default: case which most closely matches your intention (hopefully):
function texas(val) {
var answer = "";
switch(val) {
case 1:
case 2:
case 3:
var answer = "low";
break;
case 4:
case 5:
case 6:
answer = "medium";
break;
default:
if(val >= 7) {
answer = "Huge"
}
// decide what should happen if val is 0, -1 or not even a number (e.g. texas('gotcha!')
break;
}
return answer;
}
Don't forget to put break in your cases, otherwise execution will "fall through" and execute the next cases. You would never end up with "low"
You can't use an if statement within a switch block.
You do have the default option tho -
function texas(val) {
var answer = "";
switch(val) {
case 1:
case 2:
case 3:
answer = "low";
case 4:
case 5:
case 6:
answer = "medium";
break;
default:
answer = val >= 7 ? "Huge" : "Invalid";
break;
}
return answer;
Note that if you have a minus / negative answer, it'll also fall into this clause, but you can the the value of answer with an inline ?: if statement...
You can't put the else after the switch block as people have stated above. switch statement is better for multi way branching and fixed data values. On the other side, if statement is better for boolean values. You can do something like this. It might not be the shortest line of codes, but just so you that there's another approach:
function texas(val) {
let answer = "";
switch (true) {
case (val == 1 || val == 2 || val == 3):
answer = "low";
break;
case (val == 4 || val == 5 || val == 6):
answer = "medium";
break;
case (val >= 7):
answer = "huge";
break;
}
return answer;
}

Why "if" works but "switch" doesn't work?

// It is simple code
var num = prompt("put number");
// This way is not worked
switch (num) {
case num > 0:
console.log("num++");
break;
case num < 0:
console.log(num-2);
break;
}
// But this worked
if (num > 0){
console.log(num++);
} else if (num < 0){
console.log(num -2);
}
My first way by "switch" is not worked but "if" method worked.
I tried all of thing for changing code or other ways but the same result.
Please guys help me.
Because the statement num > 0 inside you case will return true or false.
If you do this:
switch (true) {
case num > 0:
console.log("num++");
break;
case num < 0:
console.log(num-2);
break;
}
It will work.
Cases cannot be expressions, you must normalize your input first.
Although it is valid to place an expression in a case, in this scenario a more tried-and-true way of dealing with this is to first normalize your input first.
You can determine direction for example:
var num = parseInt(prompt("put number"), 10);
var direction = num < 0 ? -1 : 1;
switch (direction) {
case 1:
console.log("num++");
break;
case -1:
console.log(num - 2);
break;
}
The switch acts as a case switcher, meaning you cannot make comparisons to create cases, just list cases by case, and perform some function from this case. The if / else structure is suitable for making comparisons, as the expected result in the if call is always a boolean.
Example:
const a = 1;
if (a === 1) {
console.log('hello');
} else {
console.log('sad');
switch (a) {
case 1 : console.log('hello'); break;
default: console.log('sad'); break;
In your case, I recommend using if/else if/else, as it is more recommended.

Javascript operators in switch case

I'm creating a panel and there are stats for memory, CPU and HDD. I'm using a switch statement and in the case method, I'm putting the current usage of CPU, memory and HDD.
However, the problem is that I'm using operators and I don't know which operator to use because I've tried all of them and I didn't get the results that I expected.
And this is the code: https://pastebin.com/YaxCm0Be
switch(true){
case (mem_percent_get <= 0.01):
var mem_progress_color = 'progress-bar-primary';
break;
case (mem_percent_get <= 33):
var mem_progress_color = 'progress-bar-success';
break;
case (mem_percent_get <= 66):
var mem_progress_color = 'progress-bar-warning';
break;
case (mem_percent_get <= 80):
var mem_progress_color = 'progress-bar-danger';
break;
default:
mem_progress_color = 'progress-bar-theme';
}
switch(true){
case (cpu_percent_get <= 33):
var cpu_progress_color = 'progress-bar-success';
break;
case (cpu_percent_get <= 66):
var cpu_progress_color = 'progress-bar-warning';
break;
case (cpu_percent_get <= 80):
var cpu_progress_color = 'progress-bar-danger';
break;
default:
cpu_progress_color = 'progress-bar-primary';
}
switch(true){
case hdd_percent_get <= 0.01:
var hdd_progress_color = 'progress-bar-primary';
break;
case hdd_percent_get <= 30:
var hdd_progress_color = 'progress-bar-success';
break;
case hdd_percent_get <= 60:
var hdd_progress_color = 'progress-bar-warning';
break;
case hdd_percent_get <= 80:
var hdd_progress_color = 'progress-bar-danger';
break;
default:
hdd_progress_color = 'progress-bar-theme';
}
Well, my first comment is to not use a switch in this case. What you are doing is essentially if () { } else if() {} blocks. You should be using switch when you have a value that you want to strictly check against. I suggest looking into at the MDN docs for switch.
Secondly, from what I can gather is that for the memory, you need it to be red when the value is 1696 / 2098 (80.83%). All of your if/elseif cases rely on <= which would mean that the value must be less than or equal to the number on the right of the equation. In your case, you are looking for <= 80, and without seeing how you calculate mem_percent_get (if it is in the pastebin, I'm unable to open that on my current network), you're value is likely above 80.
For your danger, you likely want 80-100+% as being red, so you should be using >= or greater than or equal to operator.
MDN has an excellent resources on comparison operators.
Created a getClassName method that accepts a percent and will return a className:
const getClassName = percent => {
switch(true){
case (percent <= 0.01):
return 'progress-bar-primary';
case (percent <= 33):
return 'progress-bar-success';
case (percent <= 66):
return 'progress-bar-warning';
case (percent <= 80):
return 'progress-bar-danger';
default:
return 'progress-bar-theme';
}
}
console.log('0: ', getClassName(0));
console.log('40: ', getClassName(40));
console.log('50: ', getClassName(50));
console.log('80: ', getClassName(80));
console.log('100: ', getClassName(100));

javascript: switch statement

I'm trying to learn how to do a switch statement using javascript. Can you guys help me how to convert this one into switch statement?
if (x == ix && y == iy){//should be the default
x.style.backgroundColor = 'white';
}
if(x < ix){
x.style.backgroundColor = 'red';
}
else if(x > ix){
x.style.backgroundColor = 'blue';
}
if(y < iy){
x.style.backgroundColor = 'green';
}
else if(y > iy){
x.style.backgroundColor = 'yellow';
}
JavaScript does not support operations other than strict equality in switches. In other words, you cannot write that program as a switch.
In a switch, you can compare a variable to different values (or cases) and check if they are equal. If they are, you execute the code given under the case.
There is a drawback, however, and it is that you can convert this code into a switch easily:
if (a === 1) {
console.log("one");
} else if (a === 2) {
console.log("two");
} else {
console.log("Out of range! :(");
}
The above code in switch is
switch (a) {
case 1:
console.log("one");
break;
case 2:
console.log("two");
break;
default:
console.log("Out of range! :(");
break;
}
But you cannot do the same to a code that contains relational operations.
switch (a) {
case > 1: // throws error
doSomething();
break;
}
Hope this could be helpful to convert your above conditions.
switch (new Date().getDay()) {
case 0:
day = "Sunday";
break;
case 1:
day = "Monday";
break;
case 2:
day = "Tuesday";
break;
case 3:
day = "Wednesday";
break;
case 4:
day = "Thursday";
break;
case 5:
day = "Friday";
break;
case 6:
day = "Saturday";
}

Categories