Javascript: How can I simplify an if-statement with multiple OR conditions? - javascript

Sorry if I've made mistakes writing this post. I'm new here and I don't know how this works, hope I learn quick. I am also new at JavaScript.
So the question is: I have this on my code.elements.js file and I can't make it work.
Does putting this work?
if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};
Or do I have to make it by the normal way?, like
if (codePrompt == codeSwitch || codePrompt == codeSwitchBG || codePrompt == codeBlur || codePrompt == codeShowInfo){};
var codeSwitch = 'switch()';
var codeSwitchBG = 'switch(background)';
var codeBlur = 'blur()';
var codeShowInfo = 'showInfo()';
$(".code").on("click", function () {
var codePrompt = prompt("Set the code in the command line.");
if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)) {
if (codePrompt == codeSwitch) {
alert("Switching background...");
console.log("Used '" + codeSwitch + "' command.");
} else if(codePrompt == codeBlur) {
alert("Blurring elements...");
console.log("Used '" + codeBlur + "' command.");
} else if(codePrompt == codeSwitchBG) {
alert("Switching background...");
console.log("Used '"+ codeSwitchBG + "' command.");
}else if(codePrompt == codeShowInfo) {
alert("Showing info...");
console.log("Used '"+ codeShowInfo + "' command.");
}
} else {
alert("Wrong command, try again.");
console.log("Wrong command, try again.");
};
});

The "normal" way works the way you probably expect.
However, that if statement is redundant, anyway. You can just skip it:
if (codePrompt === codeSwitch) {
alert("Switching background...");
console.log("Used '" + codeSwitch + "' command.");
} else if (codePrompt === codeBlur) {
alert("Blurring elements...");
console.log("Used '" + codeBlur + "' command.");
} else if (codePrompt === codeSwitchBG) {
alert("Switching background...");
console.log("Used '" + codeSwitchBG + "' command.");
} else if (codePrompt === codeShowInfo) {
alert("Showing info...");
console.log("Used '" + codeShowInfo + "' command.");
} else {
alert("Wrong command, try again.");
console.log("Wrong command, try again.");
}
This is a good use case for a switch, and I would refactor it this way:
var alertMessage = "",
consoleMessage = "Used '" + codePrompt + "' command.";
switch (codePrompt) {
case codeSwitch:
alertMessage = "Switching background...";
break;
case codeBlur:
alertMessage = "Blurring elements...";
break;
case codeSwitchBG:
alertMessage = "Switching background...";
break;
case codeShowInfo:
alertMessage = "Showing info...";
break;
default:
alertMessage = consoleMessage = "Wrong command, try again.";
break;
}
alert(alertMessage);
console.log(consoleMessage);

Because JavaScript has short circuit evaluation and your strings are truthy then you need to use the second approach or what you referred to as "the normal way".
The first way does not work because you end up evaluating the wrong thing. Evaluation works like this:
var result = 0 || "zero" ;
0 is evaluated and determined to be falsy.
"zero" is evaluated as truthy and becomes the result.
var result = "zero" || 0 ;
"zero" is evaluated and determined to be truthy and returned as the result.
0 is not evaluated because short circuit evaluation.
In your original code:
if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};
The operator associativity of || is left to right. Parenthesis are evaluated inner to outer.
(codeSwitch || codeSwitchBG || codeBlur || codeShowInfo) is evaluated first. Because of the rules we already discussed the result becomes codeSwitch:
codeSwitch || codeSwitchBG becomes codeSwitch
codeSwitch || codeBlur becomes codeSwitch
codeSwitch || codeShowInfo becomes codeSwitch
So you end up evaluating:
if(codePrompt == codeSwitch)
Which of course is wrong.

You must do it the second way you mentioned:
if (codePrompt == codeSwitch ||
codePrompt == codeSwitchBG || codePrompt == codeBlur || codePrompt == codeShowInfo){};

The way you are implementing this logic I would suggest a switch statement for readability like such:
switch (codePrompt){
case "switch()":
{
//Handle case
break;
}
case "switch(background)":
{
//Handle Case
break;
}
case "blur()":
{
//Handle Case
break;
}
default :
{
alert("Wrong command, try again.");
console.log("Wrong command, try again.");
}

You could also refactor as follows to cut out the if/switch:
var commands = {
'switch()': 'Switching background',
'switch(background)': 'Switching background',
'blur()': 'Blurring elements',
'showInfo()': 'Showing info'
};
$(".code").on("click", function () {
var codePrompt = prompt("Set the code in the command line.");
if (commands.hasOwnProperty(codePrompt)) {
alert(commands[codePrompt] + '...');
console.log("Used '" + codePrompt + "' command.");
} else {
alert("Wrong command, try again.");
console.log("Wrong command, try again.");
}
});

Yes, you have to make it the 'normal' way.
What
if (codePrompt == (codeSwitch || codeSwitchBG || codeBlur || codeShowInfo)){};
does is
1) test all the switches -- returns TRUE if any are TRUE
2) test if codePrompt == TRUE or FALSE.
Based on your code, you can remove that test altogether and simply drop through to your final ELSE.
Another option is use a SWITCH statement, the last ELSE becoming the DEFAULT clause.

Related

Formvalidation with Javascript

i wanted to validate my form but im stuck with the validation of formfield persnr.
It won´t compare the string. For this i already tried the comparison and operators (or || ). The validation of the other fields is ok. Did i use the operators wrong?
function checkForm() {
var strFehler = '';
if (document.forms[0].user.value == "user")
strFehler += "user not ok!\n";
if (document.forms[0].test.value == "")
strFehler += "test not ok!\n";
if (document.forms[0].time.value == "")
strFehler += "time not ok";
if (document.forms[0].cost.value == "")
strFehler += "cost not ok!\n";
if (document.forms[0].persnr.value != "13088") || (document.forms[0].persnr.value != "10286")
strFehler += "persnr false!\n";
if (strFehler.length > 0) {
alert("problems!!: \n\n" + strFehler);
return (false);
}
}
I expected that the validation would show an alert if the value isn´t 13088 or 10286 but no message pops up.
This:
if (document.forms[0].persnr.value != "13088") || (document.forms[0].persnr.value != "10286")
Needs to be changed to this:
if ((document.forms[0].persnr.value != "13088") || (document.forms[0].persnr.value != "10286"))
Your are missing parentheses to have both conditions inside the the if statement.

else not working after nested if else fails

I am doing some conditional concatenations on pairs of strings. if the condition is not satisfied, then a space should be added between the two
The following is a small subset of my larger code but replicates my problem
a = "ai";
b = "b";
res = "";
if (a.match(/ai$/))
{
if (b.match(/^ā/) || b.match(/^a/) ||
b.match(/^i/) || b.match(/^ī/) ||
b.match(/^u/) || b.match(/^ū/) ||
b.match(/^e/) || b.match(/^o/) ||
b.match(/^ṛ/))
{
res = a.slice(0, -1) + 'a ' + b
}
}
else
res = a+ ' ' + b
the result should be ai b
But I get ''
What am I doing wrong?
Move your else inside the first if so that that else is triggered when the inner if is not satisfied:
a = "ai";
b = "b";
res = "";
if (a.match(/ai$/))
{
if (b.match(/^ā/) || b.match(/^a/) ||
b.match(/^i/) || b.match(/^ī/) ||
b.match(/^u/) || b.match(/^ū/) ||
b.match(/^e/) || b.match(/^o/) ||
b.match(/^ṛ/))
{
res = a.slice(0, -1) + 'a ' + b
}
else{
res = a+ ' ' + b
}
}
console.log(res);
The nested if doesn't go to the outer else for example:
if (1 === 1) {
if (1 === 2) {
console.log(1);
}
}
else {
console.log(2);
}
the else statement in this case will never trigger.
It seems to me that what you need to do is simply combine the if statements:
a = "ai";
b = "b";
res = "";
if (a.match(/ai$/) && (b.match(/^ā/) || b.match(/^a/) ||
b.match(/^i/) || b.match(/^ī/) ||
b.match(/^u/) || b.match(/^ū/) ||
b.match(/^e/) || b.match(/^o/) ||
b.match(/^ṛ/))) {
res = a.slice(0, -1) + 'a ' + b;
}
else {
res = a + ' ' + b;
}
note the extra "(" after the && this is so the entire statement is treated as one unit and not seperated.

missing ) after argument list when creating a variable right after a for statement

I am trying to create the Bagel game and keep getting missing ) after argument list when I try to create the guess variable right after the for statement. Can someone tell me how to fix this?
alert('Lets play the bagel game! If you can guess my three digit number (with each digit being unique) within 20 turns, then you win! I will only provide you with three hints. Pico, which means one digit is correct, but in the wrong position. Fermi, which means one digit is correct and in the right position. Bagels, which means no digits are correct');
//computer generates number
function numberRange(){
var number = Math.round(Math.random()*1000);
var num =number.toString();
if (number <= 100 || number == 1000){
numberRange();
}
else if (num[0] == num[1] || num[0] == num[2] || num[1]==num[2]){
numberRange();
}
else if (number == undefined || num == undefined){
numberRange();
}else{
var numSave = JSON.stringify(num);
sessionStorage.setItem('number',numSave);
}}
numberRange();
var numGet = sessionStorage.getItem('number');
var numUse = JSON.parse(numGet);
//game start
for (i=1;i<21;i++){
var validNumber = /\d{3}/;
var guess = prompt('Turn ' + i ': Guess a number!');
while (validNumber.test(guess) == false) {
alert('Put in a three digit number!');
var guess = prompt('Turn ' + i ': Guess a number!');
}
if (validNumber.test(guess)){
var guessNum = guess.toString();
if (guessNum[0] == numUse[0] && guessNum[1] && numUse[1] && guessNum[2] == numUse[2]){
alert('Congratulations! You win!');
break
}
else if ((guessNum[0] == numUse[0] || guessNum[1] == numUse[1] || guessNum[2] == numUse[2]) && (guessNum[0] == numUse[1] || guessNum[0] == numUse[2] || guessNum[1] == numUse[0] || guessNum[1] == numUse[2] || guessNum[2] == numUse[0] || guessNum[2] == numUse[3])){
alert('Pico and Fermi!');
}else if(guessNum[0] == numUse[1] || guessNum[0] == numUse[2] || guessNum[1] == numUse[0] || guessNum[1] == numUse[2] || guessNum[2] == numUse[0] || guessNum[2] == numUse[3]){
alert('Pico!');
}else if (guessNum[0] == numUse[0] || guessNum[1] == numUse[1] || guessNum[2] == numUse[2]){
alert('Fermi!');
}else (guessNum[0] != numUse[0] && guessNum[0] != numUse[1] && guessNum[0] != numUse[2] && guessNum[1] != numUse[0] && guessNum[1] != numUse[1] && guessNum[1] != numUse[2] && guessNum[2] != numUse[0] && guessNum[2] != numUse[1] && guessNum[2] != numUse[2]){
alert('Begels!');
}
}
}
I see several issues.
var guess = prompt('Turn ' + i ': Guess a number!');
is missing + after i '
It should be like this:
var guess = prompt('Turn ' + i + ': Guess a number!');
You're also defining the same variable name twice inside the for scope, just do guess = prompt('Turn ' + i ': Guess a number!'); inside the while loop.
I didn't check the rest of the code, but this should get you started.
you seem to have missed a "+" as a part of string concatenation.
prompt('Turn ' + i+': Guess a number!');
instead of
prompt('Turn ' + i': Guess a number!');
What the other folks said (there are 2 places you need + signs, l#s 25, 28) and your final else needs an if before the test clause (L# 41). After that it should at least run. A few other comments:
only var a variable the first time it is declared.
look into switch statements and use them when you have more than 2 options and a default.
try to break up long lines (as in add line feeds) and keep all the code on the screen. Javascript doesn't care at all about white space so use it. Far easier to debug things when you can see it all.
a good editor will find this stuff for you. There are a lot of free ones (Atom, Komodo) that do a decent job of syntax highlighting and error detection.

javascript if elseif else not working

Help! The if/elseif/else code block won't work! When the code reaches prompt "what will you do?" no matter what you type, you get all the alerts. It should come up blank when you type a command that is not in the if blocks, and give you an alert if you did type R, L or M. Typing F should give you no alert.
while (Room = 1) {
var Choice = prompt ("What will you do?");
if (Turn = "Start");
{
if (Choice = "F");
{
Turn = "1";
}
else if (Choice = "R");
{
alert ("You cannot do that...");
}
else if (Choice = "L");
{
alert ("You cannot do that...");
}
else if (Choice = "M");
{
alert (" 1"+'\n'+" 1" + '\n' + "221" + '\n' + " X");
}
else
{
alert ("You cannot do that...")
}
}
Use == instead of =. A single equals is a variable assignment and evaluates to the result of the assignment. == is used for equality test.
Remove ; from your if and else if statement.
; represents end of statement
Also you can't use = as comparison operation, instead == or ===(strict comparison) as #Andy mentioned.
while (Room == 1) { // Actually your code fails at the beginning itself.
However I would suggest you to use switch for your case.
If you write "=" single equal to means assignment of value to that variable.
So, You should change the "=" Single equalto to "==" Double equalto for conditional purpose.
And If else has no end ";" Semi-Colon required in Javascript. removed it.
I have updated the following please try it.
while (Room == 1) {
var Choice = prompt ("What will you do?");
if (Turn == "Start")
{
if (Choice == "F")
{
Turn == "1";
}
else if (Choice == "R")
{
alert ("You cannot do that...");
}
else if (Choice == "L")
{
alert ("You cannot do that...");
}
else if (Choice == "M")
{
alert (" 1"+'\n'+" 1" + '\n' + "221" + '\n' + " X");
}
else
{
alert ("You cannot do that...");
}
}
}
You have a semicolon after all your if-elseif-statements. So regardless of what the boolean is inside the if, the if block is empty. Just remove semicolons and you're good to go.
With this:
if(1 == 1);
{
alert('Nope');
}
the block after if-statement is always executed because of the semicolon ending the if.
if(1 == 1)
{
alert('Yup');
}
Works.
Java scrip don't consider single '=' it works with '=='
try
if (Turn == "Start");
Instead of
if (Turn = "Start");
Remove semicolons ; at the end of the if and else if loops
and also compare string by using ==, not =
Replace your code with this one
while (Room = 1) { //here Room is int variable
var Choice = prompt ("What will you do?");
if (Turn == "Start")
{
if (Choice =="F")
{
Turn = "1";
}
else if (Choice == "R")
{
alert ("You cannot do that...");
}
else if (Choice == "L")
{
alert ("You cannot do that...");
}
else if (Choice == "M")
{
alert ("1" + '\n' + "1" + '\n' + "221" + '\n' + "X");
}
else
{
alert ("You cannot do that...")
}
}
Also, besides using strict comparison I would strongly suggest writing left curly brace just after if(...) not in the new line:
Like:
if(...){
Instead of:
if(...)
{
Reason for that is JavaScript's built-in semi-colon insertion, so sometimes it can produce silent errors or unexpected behavior. In some other programming languages it doesn't matter, but in JavaScript it does.

Regex issue - unknown whitespace

Basically my problem is my program takes text input that is full of random spaces, tabs and other whitespace units (line breaks as well, but not as many).
I have successfully removed all tabs...
// Parse the input box into an array
var inputArr = document.getElementById("inputBox").value.split(/[\t]/);
Now the text looks something like this...
"Dummy Field for Hiding Groups , , , , , , ,*Role ,Go To , , , Collapse section Summary , , , ,Name ,Doe,John ,Details ,Customer ,John Doe Inc.
My problem: I have a switch...
switch(inputArr[i]) {
...that has several cases...
case ("Name" || "Name " || " Name" || " Name "):
if(inputArr[i - 1] == ("Summary" || "Summary " || " Summary" || " Summary ")) {
contNameBool = true;
break;
}
break;
case ("Details" || "Details " || " Details" || " Details "):
if(contNameBool == true) {
contNameBool = false;
break;
} else if(contNameBool == false && compNameBool == true) {
compNameBool = false;
break;
}
break;
case ("Customer" || "Customer " || " Customer" || " Customer "):
if(inputArr[i - 1] == "Details") {
contNameBool = false;
compNameBool = true;
break;
}
break;
case "Address":
if(inputArr[i - 1] == "Profile") {
compNameBool = false;
emailBool = true;
break;
}
break;
case ("VISA" || "MASTERCARD" || "AMERICAN" || "DISCOVER"):
emailBool = false;
break;
case "Show":
if(inputArr[i + 1] == "next" && inputArr[1 + 2] == "row") {
accountLinesArray.length = inputArr[i - 1];
for(j = 0; j < accountLinesArray.length; j++) {
accountLinesArray[j] = new account();
}
break;
}
break;
case "Order":
if(inputArr[i + 1] == "ID" && inputArr[i + 2] == "MRC") {
accountsBool = true;
break;
}
break;
As you can probably tell, I am trying to get my program to identify certain key words in the text and toggle some booleans accordingly. The switch statement doesn't seem to ever go into any of the cases, no matter how I configure the conditions. For example the case...
case ("Name" && "Name " && " Name" && " Name "):
Doesn't trigger, even if I use ||.
Before anyone posts it. I realize my code is sloppy at best. Any help would be greatly appreciated.
First, you're splitting on tabs only. To split on any sequence of whitespace chars, do this:
var inputArr = document.getElementById("inputBox").value.split(/\s+/);
This will reduce the number of cases you need to handle, so you won't need to check for "Name", "Name ", " Name", or " Name ", just "Name":
case "Name":
...
break;
Second, this doesn't do as you're expecting (see explanation below):
inputArr[i - 1] == ("Summary" || "Summary " || " Summary" || " Summary ")
but with the first change above, you can just compare against "Summary" anyway.
Third, for the cases where you do want to match against completely different values, you can do this:
case "VISA":
case "MASTERCARD":
case "AMERICAN":
case "DISCOVER":
emailBool = false;
break;
Finally, you really should rethink your whole approach, but without more specifics, it's hard to give you any meaningful advice about that...
Good luck!
EDIT (Why inputArr[i - 1] == ("Summary" || "Summary " || ... doesn't work):
In Javascript, non-null strings count as true and || and && can be used as short-circuit evaluations. For example, ("Name" || " Name") get's evaluated as "Name" because "Name" is true so the rest of the equation doesn't need to be evaluated. Likewise, ("Name" && " Name") would be equivalent to " Name", because "Name" is true so it moves on to the next one, " Name" which is also true and is the end of the statement. To do what you were attempting would need to be done something like:
(inputArr[i - 1] == "Summary") || (inputArr[i - 1] == "Summary ") || ...
or could be done more simply by using a regex:
!!inputArr[i - 1].match("Summary").length
// Be careful though, as this could also match something like "NotASummaryDude"
After applying Ray's suggestions, you might also want to remove the empty elements from the array:
for (var i=inputArr.length-1; i>=0; i--){
if (inputArr[i] == '' || !inputArr[i].match(/[^\s]/)) inputArr.splice(i,1)
}

Categories