Complex If statements; || not working as I hoped - javascript

I feel like this is a really dumb question but my brain is fried. Right now I'm working on a very complex set of if and else statements and I'm wondering if there is an easier way? I originally tried or statements but that didn't give me the desired result.
if(fields[0].value === '' && fields[1].value === '' && fields[2].value === '' && fields[3].value === '' ) {
clusterGroup.addLayer(layer);
} else if(fields[0].value === '' && fields[1].value === city && fields[2].value === '' && fields[3].value === '') {
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === '' && fields[2].value === '' && fields[3].value === '') {
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === city && fields[2].value === '' && fields[3].value === ''){
clusterGroup.addLayer(layer);
} else if(fields[0].value === '' && fields[1].value === '' && (fields[2].value <= sq && sq != null) && fields[3].value === '') {
clusterGroup.addLayer(layer);
} else if(fields[0].value === '' && fields[1].value === '' && fields[2].value === '' && (fields[3].value >= sq && sq != null)) {
clusterGroup.addLayer(layer);
} else if(fields[0].value === '' && fields[1].value === city && (fields[2].value <= sq && sq != null) && fields[3].value === ''){
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === '' && fields[2].value === '' && (fields[3].value >= sq && sq != null)){
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === city && (fields[2].value <= sq && sq != null) && fields[3].value === ''){
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === city && fields[2].value === '' && (fields[3].value >= sq && sq != null)){
clusterGroup.addLayer(layer);
} else if(fields[0].value === state && fields[1].value === city && (fields[2].value <= sq && sq != null) && (fields[3].value >= sq && sq != null)){
clusterGroup.addLayer(layer);
}
Thank you in advanced.

I don't know how did you use OR Statement (||) but you can use one if statement.
if(
(fields[0].value === '' && fields[1].value === '' && fields[2].value === '' && fields[3].value === '') ||
(fields[0].value === '' && fields[1].value === city && fields[2].value === '' && fields[3].value === '') ||
(fields[0].value === state && fields[1].value === '' && fields[2].value === '' && fields[3].value === '') ||
(fields[0].value === state && fields[1].value === city && fields[2].value === '' && fields[3].value === '') ||
(fields[0].value === '' && fields[1].value === '' && (fields[2].value <= sq && sq != null) && fields[3].value === '') ||
(fields[0].value === '' && fields[1].value === '' && fields[2].value === '' && (fields[3].value >= sq && sq != null)) ||
(fields[0].value === '' && fields[1].value === city && (fields[2].value <= sq && sq != null) && fields[3].value === '') ||
(fields[0].value === state && fields[1].value === '' && fields[2].value === '' && (fields[3].value >= sq && sq != null)) ||
(fields[0].value === state && fields[1].value === city && (fields[2].value <= sq && sq != null) && fields[3].value === '') ||
(fields[0].value === state && fields[1].value === city && fields[2].value === '' && (fields[3].value >= sq && sq != null)) ||
(fields[0].value === state && fields[1].value === city && (fields[2].value <= sq && sq != null) && (fields[3].value >= sq && sq != null))
){
clusterGroup.addLayer(layer);
}

Try restructuring it into something like this
if (sq != null) {
if (fields[3].value >= sq &&
fields[2].value <= sq &&
fields[0].value === state &&
field[1].value === city) {
clusterGroup.addLayer(layer);
} else if (fields[3].value >= sq) {
if ((fields[0].value === state) ||
(fields[0].value === state && field[1].value === city) ||
(fields[0].value === '' &&
field[1].value === '')) {
clusterGroup.addLayer(layer);
}
} else if (fields[2].value <= sq) {
if ((fields[1].value === city) ||
(fields[0].value === state && field[1].value === city) ||
(fields[0].value === '' && field[1].value === '')) {
clusterGroup.addLayer(layer);
}
}
} else if ((fields[1].value === '' && fields[0].value === state) ||
(fields[0].value === '' && fields[1].value === city) ||
(fields[0].value === state && fields[1].value === city)) {
clusterGroup.addLayer(layer);
}

Related

React component names and values filter

I want to filter React components by name and values.
this is the array i want to filter
let filteredArray: any[] = []
const filteredItems: any[] = eventList.filter(
(event) =>
event.props.children.props.printEvent.labels === null &&
event.props.children.props.printEvent.value === true &&
event.props.children.props.printEvent.notes === null &&
(event.props.children.props.printEvent && event.props.children.props.printEvent.name === 'control_fault') ||
(event.props.children.props.printEvent.name === 'running' && event.props.children.props.printEvent.value === false) ||
(event.props.children.props.printEvent.name === 'safety_chain' && event.props.children.props.printEvent.value === false) ||
(event.props.children.props.printEvent.name === 'torch_collision' && event.props.children.props.printEvent.value === true) ||
(event.props.children.props.printEvent.name === 'motion_sup' && event.props.children.props.printEvent.value === true) ||
(event.props.children.props.printEvent.name === 'e_stop' && event.props.children.props.printEvent.value === true)
)
if (filteredItems) {
filteredArray.push([...filteredItems])
}
ui.setUnlabeledCount(filteredItems.length)
console.log(eventList, filteredArray, filteredItems, ui.unlabeledCount)
is there another way or to write this? dont want to be using props.children all the time
You should have a look at destructuring object in ES6 so that you don't have to re-write props.children all the time like above
Here is the reference: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
const filteredItems: any[] = eventList.filter(
({ props: {children: {props: {printEvent}}}}) =>
printEvent.labels === null &&
printEvent.value === true &&
printEvent.notes === null &&
(printEvent && printEvent.name === 'control_fault') ||
(printEvent.name === 'running' && printEvent.value === false) ||
(printEvent.name === 'safety_chain' && printEvent.value === false) ||
(printEvent.name === 'torch_collision' && printEvent.value === true) ||
(printEvent.name === 'motion_sup' && printEvent.value === true) ||
(printEvent.name === 'e_stop' && printEvent.value === true)
)

How to generate all possible outcome for if statement?

So I have this if statement and I want to make all the possible outcomes.
if (cuisine == '' && area == '' && city == '' && minprice == '' && maxprice == ''){}
if (cuisine != '' && area == '' && city == '' && minprice == '' && maxprice == ''){}
if (cuisine != '' && area != '' && city == '' && minprice == '' && maxprice == ''){}
if (cuisine != '' && area != '' && city != '' && minprice == '' && maxprice == ''){}
if (cuisine != '' && area != '' && city != '' && minprice != '' && maxprice == ''){}
if (cuisine != '' && area != '' && city != '' && minprice != '' && maxprice != ''){}
etc... etc...
Here is a coding version of the truth table
const conditions = {
"cuisine": '',
"area": '',
"city": '',
"minprice": '',
"maxprice": ''
}
const arr = Object.keys(conditions),
n = arr.length,
m = 1 << n,
table = Array.from({length: m}).map((_,i) => {
let s = i.toString(2); // convert to binary
let len = n + 1 - s.length
s = Array.from({length:len}).join('0') + s; // pad with zeroes
return `if (${s.split('').map((bit,j) => `${arr[j]}${bit==="1"?' == ':' != '}''`).join(' && ')}) {...}`;
})
document.querySelector('pre').innerHTML = ` ${table.sort().join('\nelse ')}`
<pre></pre>
These are the all the possible outcomes
if(cuisine == '' && area == '' && city == '' && minprice == '' && maxprice == ''){}
else if (cuisine == '' && area == '' && city == '' && minprice == '' && maxprice !== ''){}
else if (cuisine == '' && area == '' && city == '' && minprice !== '' && maxprice == ''){}
else if (cuisine == '' && area == '' && city == '' && minprice !== '' && maxprice !== ''){}
else if (cuisine == '' && area == '' && city !== '' && minprice == '' && maxprice == ''){}
else if (cuisine == '' && area == '' && city !== '' && minprice == '' && maxprice !== ''){}
else if (cuisine == '' && area == '' && city !== '' && minprice !== '' && maxprice == ''){}
else if (cuisine == '' && area == '' && city !== '' && minprice !== '' && maxprice !== ''){}
else if (cuisine == '' && area !== '' && city == '' && minprice == '' && maxprice == ''){}
else if (cuisine == '' && area !== '' && city == '' && minprice == '' && maxprice !== ''){}
else if (cuisine == '' && area !== '' && city == '' && minprice !== '' && maxprice == ''){}
else if (cuisine == '' && area !== '' && city == '' && minprice !== '' && maxprice !== ''){}
else if (cuisine == '' && area !== '' && city !== '' && minprice == '' && maxprice == ''){}
else if (cuisine == '' && area !== '' && city !== '' && minprice == '' && maxprice !== ''){}
else if (cuisine == '' && area !== '' && city !== '' && minprice !== '' && maxprice == ''){}
else if (cuisine == '' && area !== '' && city !== '' && minprice !== '' && maxprice !== ''){}
else if (cuisine !== '' && area == '' && city == '' && minprice == '' && maxprice == ''){}
else if (cuisine !== '' && area == '' && city == '' && minprice == '' && maxprice !== ''){}
else if (cuisine !== '' && area == '' && city == '' && minprice !== '' && maxprice == ''){}
else if (cuisine !== '' && area == '' && city == '' && minprice !== '' && maxprice !== ''){}
else if (cuisine !== '' && area == '' && city !== '' && minprice == '' && maxprice == ''){}
else if (cuisine !== '' && area == '' && city !== '' && minprice == '' && maxprice !== ''){}
else if (cuisine !== '' && area == '' && city !== '' && minprice !== '' && maxprice == ''){}
else if (cuisine !== '' && area == '' && city !== '' && minprice !== '' && maxprice !== ''){}
else if (cuisine !== '' && area !== '' && city == '' && minprice == '' && maxprice == ''){}
else if (cuisine !== '' && area !== '' && city == '' && minprice == '' && maxprice !== ''){}
else if (cuisine !== '' && area !== '' && city == '' && minprice !== '' && maxprice == ''){}
else if (cuisine !== '' && area !== '' && city == '' && minprice !== '' && maxprice !== ''){}
else if (cuisine !== '' && area !== '' && city !== '' && minprice == '' && maxprice == ''){}
else if (cuisine !== '' && area !== '' && city !== '' && minprice == '' && maxprice !== ''){}
else if (cuisine !== '' && area !== '' && city !== '' && minprice !== '' && maxprice == ''){}
else if (cuisine !== '' && area !== '' && city !== '' && minprice !== '' && maxprice !== ''){}
There are 5 varing things that have two possible outcomes(empty or not empty)
Therefore there are 2x2x2x2x2 possibilities.

tic tac toe game not working (javascript) [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 4 years ago.
Improve this question
I am working on a tic tac toe game, and I am at the point where the game decides who wins the game. I wrote the logic and all possible winner solutions, but when I play the game, the game announces a winner even when there is no winning combination. What did I do wrong? This is the code pen:
https://codepen.io/xshirl/pen/dmzeMd
Here is my code:
let player = true;
$(document).ready(function () {
const square = $('.square');
function display() {
if (player === true) {
square.on('click', first);
} else if (player === false) {
square.on('click', function () {
$(this).addClass('second');
});
}
}
display();
function first() {
$(this).addClass('first');
player = !player;
if (player === true) {
$(this).addClass('second');
alert("Player 2 has made a move.")
} else {
alert("Player 1 has made a move.")
}
if (($(".one").hasClass('first') && $(".two").hasClass('first') && $(".three").hasClass('first')) || ($(".four").hasClass('first') && $(".five").hasClass('first') && $(".six").hasClass('first')) || ($(".seven").hasClass('first') && $(".eight").hasClass('first') && $(".nine").hasClass('first')) ||
($(".one").hasClass('first') && $(".four").hasClass('first') && $(".seven").hasClass('first')) || ($(".two").hasClass('first') && $(".five").hasClass('first') && $(".eight").hasClass('first')) || ($(".three").hasClass('first') && $(".six").hasClass('first') && $(".nine").hasClass('first')) ||
($(".one").hasClass('first') && $(".five").hasClass('first') && $(".nine").hasClass('first')) || ($(".three").hasClass('first') && $(".five").hasClass('first') && $(".seven").hasClass('first'))) {
alert("Player 1 has won the game!");
}
if ($(".one").hasClass('second') && $(".two").hasClass('second') && $(".three").hasClass('second') || $(".four").hasClass('second') && $(".five").hasClass('second') && $(".six").hasClass('second') || $(".seven").hasClass('second') && $(".eight").hasClass('second') && $(".nine").hasClass('second') ||
$(".one").hasClass('second') && $(".four").hasClass('second') && $(".seven").hasClass('second') || $(".two").hasClass('second') && $(".five").hasClass('second') && $(".eight").hasClass('second') || $(".three").hasClass('second') && $(".six").hasClass('second') && $(".nine").hasClass('second') ||
$(".one").hasClass('second') && $(".five").hasClass('second') && $(".nine").hasClass('second') || $(".three").hasClass('second') && $(".five").hasClass('second') && $(".seven").hasClass('second')) {
alert("Player 2 has won the game!");
}
}
});
In function first, move the line $(this).addClass('first'); to the else block. So the code will be:
function first() {
player = !player;
if (player === true) {
$(this).addClass('second');
alert("Player 2 has made a move.")
} else {
$(this).addClass('first');
alert("Player 1 has made a move.")
}
if (($(".one").hasClass('first') && $(".two").hasClass('first') && $(".three").hasClass('first')) || ($(".four").hasClass('first') && $(".five").hasClass('first') && $(".six").hasClass('first')) || ($(".seven").hasClass('first') && $(".eight").hasClass('first') && $(".nine").hasClass('first')) ||
($(".one").hasClass('first') && $(".four").hasClass('first') && $(".seven").hasClass('first')) || ($(".two").hasClass('first') && $(".five").hasClass('first') && $(".eight").hasClass('first')) || ($(".three").hasClass('first') && $(".six").hasClass('first') && $(".nine").hasClass('first')) ||
($(".one").hasClass('first') && $(".five").hasClass('first') && $(".nine").hasClass('first')) || ($(".three").hasClass('first') && $(".five").hasClass('first') && $(".seven").hasClass('first'))) {
alert("Player 1 has won the game!");
}
if ($(".one").hasClass('second') && $(".two").hasClass('second') && $(".three").hasClass('second') || $(".four").hasClass('second') && $(".five").hasClass('second') && $(".six").hasClass('second') || $(".seven").hasClass('second') && $(".eight").hasClass('second') && $(".nine").hasClass('second') ||
$(".one").hasClass('second') && $(".four").hasClass('second') && $(".seven").hasClass('second') || $(".two").hasClass('second') && $(".five").hasClass('second') && $(".eight").hasClass('second') || $(".three").hasClass('second') && $(".six").hasClass('second') && $(".nine").hasClass('second') ||
$(".one").hasClass('second') && $(".five").hasClass('second') && $(".nine").hasClass('second') || $(".three").hasClass('second') && $(".five").hasClass('second') && $(".seven").hasClass('second')) {
alert("Player 2 has won the game!");
}
}
});

Alternatives to IF statement with multiple OR

I have a HTML form with a file upload option where I do a quick validation of the file format on client side (in order to allow only certain file extensions).
The following code snippet works fine for me but I was wondering if there is a better or faster way to achieve the same, esp. if there are more extensions to be allowed in the future.
Note: This is only about the part with the multiple OR statements to check the file extension.
My code so far (working):
if( ( (fileNameShort.length <= 100) && (fileNameShort.indexOf('#') == -1) ) && ( (fileFormat == 'bmp') || (fileFormat == 'doc') || (fileFormat == 'docx') || (fileFormat == 'gif') || (fileFormat == 'jpeg') || (fileFormat == 'jpg') || (fileFormat == 'msg') || (fileFormat == 'png') || (fileFormat == 'pdf') ) )
Many thanks for any suggestions on this, Tim.
Use .indexOf()
and also use .toLowerCase() as checking for lowercase file formats
var arr=['bmp','doc','docx','gif','jpg','msg']; //create array filetypes
if(fileNameShort.length <= 100 && fileNameShort.indexOf('#') === -1 && arr.indexOf(fileFormat.toLowerCase()) !== -1)
You are using way too may parentheses.
if (
(
( fileNameShort.length <= 100 )
&& ( fileNameShort.indexOf('#') == -1 )
)
&&
(
(fileFormat == 'bmp') || (fileFormat == 'doc') || (fileFormat == 'docx') || (fileFormat == 'gif') || (fileFormat == 'jpeg') || (fileFormat == 'jpg') || (fileFormat == 'msg') || (fileFormat == 'png') || (fileFormat == 'pdf')
)
)
is equivalent to
if (
fileNameShort.length <= 100
&& fileNameShort.indexOf('#') == -1
&& (
fileFormat == 'bmp' || fileFormat == 'doc' || fileFormat == 'docx' || fileFormat == 'gif' || fileFormat == 'jpeg' || fileFormat == 'jpg' || fileFormat == 'msg' || fileFormat == 'png' || fileFormat == 'pdf'
)
)
is equivalent to
if (
fileNameShort.length <= 100
&& fileNameShort.indexOf('#') == -1
&& /^(bmp|docx?|gif|jpe?g|msg|png|pdf)$/i.test(fileFormat)
)

JavaScript conditions

If someone could point out what I'm doing wrong I'd be eternally grateful! I can't seem to get the right combination of parenthesis - how to I combine multiple conditions in one statement?? Obviously I don't expect anyone to modify the code below, I just want to show what I'm trying to achieve.
If someone can explain the logic to me that'd be great
Thanks
function ChangeButton()
{
if
((document.forms[0].IPR.value == "") && (document.forms[0].FNM1.value == "") && (document.forms[0].FNM1.value == "") && (document.forms[0].SURN.value == "") && (document.forms[0].GEND.value == "") && (document.forms[0].DOB.value == "") && (document.forms[0].CRIM.value == "") && (document.forms[0].ETHC.value == "") && (document.forms[0].DSBC.value == "") && (document.forms[0].MARK1.value == "") && (document.forms[0].NATC.value == "") && (document.forms[0].COBC.value == "") && (document.forms[0].COD.value == "") && (document.forms[0].FIVE.value == "") && (document.forms[0].PERM.value == "") && (document.forms[0].VISF.value == "") && (document.forms[0].USD.value == "") && (document.forms[0].HAD1.value == "") && (document.forms[0].HAD3.value == "") && (document.forms[0].HTEL.value == "") && (document.forms[0].HAEM.value == "") && (document.forms[0].FEES.value == "") && (document.forms[0].REF1TIT.value == "") && (document.forms[0].REF1ORG.value == "") && (document.forms[0].REF1POS.value == "") && (document.forms[0].REF1AL1.value == "") && (document.forms[0].REF1AL3.value == "") && (document.forms[0].REF1AL5.value == "") && (document.forms[0].REF1EMA.value == "") && (document.forms[0].DISC.value == ""))
&&
((document.forms[0].PERM.value == "") && (document.forms[0].FIVE.value == "N"))
&&
((document.forms[0].AGNT.value == "") && (document.forms[0].USD.value == "Y"))
&&
((document.forms[0].CSTRT.value == "") && (document.forms[0].USD.value == "N") && (document.forms[0].CENDD.value == "") && (document.forms[0].CAD1.value == "") && (document.forms[0].CAD3.value == "") && (document.forms[0].CAD4.value == "") && (document.forms[0].CAPC.value == "") && (document.forms[0].CTEL.value == ""))
&&
((document.forms[0].AWDB.value == "") && (document.forms[0].FEES.value == "") && (document.forms[0].FEES.value == "Private Funds Self or Family") && (document.forms[0].AWDS.value == ""))
&&
((document.forms[0].RESEARCH.value == "Y") && (document.forms[0].RESSRT.value == "") && (document.forms[0].RESMOA.value == "") && (document.forms[0].RESAR.value == "") && (document.forms[0].RESDIS.value == ""))
{
document.getElementById('submitbutton').className = 'enabled';
}
else {
document.getElementById('submitbutton').className = 'disabled';
}
}
I see
...&&... document.forms[0].FIVE.value == ""
...&&... document.forms[0].FIVE.value == "N"
This never be true
EDIT
I think you must change approach, try something like this:
function ChangeButton()
{
var frm = document.forms[0];
var neverEmpty = ['field1','field2','field3'];
var mustBe = {field3:'Y', field4:'N'};
var status = 'ok';
for(var i = 0; i<neverEmpty.length; i++) {
if(frm[neverEmpty[i]] == '') {
status = 'ko';
break;
}
}
for(myField in mustBe) {
if(frm[myfield] != mustBe[myField]) {
status = 'ko';
break;
}
}
document.getElementById('submitbutton').className = status=='ok'? 'enabled' : 'disabled';
}
you don't close the brackets
if (document.forms[0].IPR.value == "" && document.forms[0].FNM1.value == "" && ect...)
it's that simple
You need one more set of parentheses around the whole lot i.e. if (a == b) { .. }
As far as I can see, you don't need any parentheses here (except for those that are required by if syntax).
if(document.forms[0].IPR.value == "" && document.forms[0].FNM1.value == "" &&
document.forms[0].PERM.value == "" && document.forms[0].FIVE.value == "N" &&
...
) {
document.getElementById('submitbutton').className = 'enabled';
} else {
document.getElementById('submitbutton').className = 'disabled';
}
Give the input elements that must be non-empty a "class" attribute. Then find all those elements using that instead of writing that insanely ugly code.
You need 1 more paren before and before the first curly brace everything if ( ... ) { ... }
Here is the corrected code.
function ChangeButton()
{
if
((document.forms[0].IPR.value == "") && (document.forms[0].FNM1.value == "") && (document.forms[0].FNM1.value == "") && (document.forms[0].SURN.value == "") && (document.forms[0].GEND.value == "") && (document.forms[0].DOB.value == "") && (document.forms[0].CRIM.value == "") && (document.forms[0].ETHC.value == "") && (document.forms[0].DSBC.value == "") && (document.forms[0].MARK1.value == "") && (document.forms[0].NATC.value == "") && (document.forms[0].COBC.value == "") && (document.forms[0].COD.value == "") && (document.forms[0].FIVE.value == "") && (document.forms[0].PERM.value == "") && (document.forms[0].VISF.value == "") && (document.forms[0].USD.value == "") && (document.forms[0].HAD1.value == "") && (document.forms[0].HAD3.value == "") && (document.forms[0].HTEL.value == "") && (document.forms[0].HAEM.value == "") && (document.forms[0].FEES.value == "") && (document.forms[0].REF1TIT.value == "") && (document.forms[0].REF1ORG.value == "") && (document.forms[0].REF1POS.value == "") && (document.forms[0].REF1AL1.value == "") && (document.forms[0].REF1AL3.value == "") && (document.forms[0].REF1AL5.value == "") && (document.forms[0].REF1EMA.value == "") && (document.forms[0].DISC.value == "")
&&
((document.forms[0].PERM.value == "") && (document.forms[0].FIVE.value == "N"))
&&
((document.forms[0].AGNT.value == "") && (document.forms[0].USD.value == "Y"))
&&
((document.forms[0].CSTRT.value == "") && (document.forms[0].USD.value == "N") && (document.forms[0].CENDD.value == "") && (document.forms[0].CAD1.value == "") && (document.forms[0].CAD3.value == "") && (document.forms[0].CAD4.value == "") && (document.forms[0].CAPC.value == "") && (document.forms[0].CTEL.value == ""))
&&
((document.forms[0].AWDB.value == "") && (document.forms[0].FEES.value == "") && (document.forms[0].FEES.value == "Private Funds Self or Family") && (document.forms[0].AWDS.value == ""))
&&
((document.forms[0].RESEARCH.value == "Y") && (document.forms[0].RESSRT.value == "") && (document.forms[0].RESMOA.value == "") && (document.forms[0].RESAR.value == "") && (document.forms[0].RESDIS.value == "")))
{
document.getElementById('submitbutton').className = 'enabled';
}
else {
document.getElementById('submitbutton').className = 'disabled';
}
}
USE and IDE, it will make ur life simple.. Cheers to Eclipse IDE :)

Categories

Resources