If condition checking for two TextFields Value - javascript

if(a.value === undefined || a.value.length>37 ||
b.value === undefined || b.value.length > 256) {
If the first one is undefined or greater than a length of 37. I get a error, but it does not check for the second field at all.

use parenthesis. It checks from left to right and stops once it hits a fail the way you have it set up.
Try
if((a.value === undefined || a.value.length>37) ||
(b.value === undefined || b.value.length > 256)) {

Conditional evaluation is lazy, i.e. it stops as soon as the result has been determined. That is, if (A && B) will not evaluate B if A is false, because the conjunction will have to be false already, and similarly if (A || B) will not evaluate B if A is true because the disjunction is already true.

You're forgetting what an OR in logic means. It only going to check until it finds one true statement.
Try regrouping:
((a.value === undefined || a.value.length>37)
||
(b.value === undefined || b.value.length > 256))
Just about elevating the condition a bit, and bringing a more broad result back instead of chasing the first true response.

Related

Correctness of !args.value || args.value.length?

I'm reviewing this line of code. It has an expression that looks like this:
!args.value || args.value.length
For example suppose we do this:
let v = {};
console.log(!v.value); //logs true
console.log(v.value); //logs undefined
console.log(v.value.length); //Script wont run - cannot read property length of undefined
So even though value is undefined, we are proceeding to check that args.value.length (or undefined> is less than the constraint? So effectively we could be checking something like this ( IIUC ):
true throws
!undefined || undefined.length < 4
So I thought the purpose of the first check in the statement was to make sure that the undefined is actually defined?
So in other words it should be args.value && args.value.length? Or stated differently:
if args.value exists, then check the length of it?
Here's the entire snippet in context just for completeness:
if (isMinLength && (!args.value || args.value.length < args.constraints[0])) {
return eachPrefix + "$property must be longer than or equal to $constraint1 characters";
The < has higher precedence than ||:
if (isMinLength && (!args.value || (args.value.length < args.constraints[0]))) {
// ^ ^
So the condition matches if either args.value doesn't exist, or when its .length is too small.
At first its actually
!args.value || (args.value.length < args.constraints[0])
But you are right, the only difference to
args.value && args.value.length < args.constraints[0]
Is that the first always returns false while the second returns undefined if args.value is not defined. As you use that in an if statement, the outcome doesnt really matter.

OR in ternary operator, using &&

Using the traditional if statement I can do this:
if(a===0 || b===0) {console.log('aloha amigo')};
But when I try to do something the same thing with a ternary operator, like this:
a===0 || b===0 && console.log('aloha amigo')
I just get errors about unexpected ||.
According to this answer: Precedence: Logical or vs. Ternary operator, we can do it using
condition1 || condition2 ? do if true : do if false
(Sorry I'm not sure how to call the ? : symbols in this case), but I'm not sure how to get it running using && (It means only run the code if returned true).
I created a codepen to test it easily. Here's the whole code:
var a = 0;
var b = 1;
a===0 || b===0 ? console.log('Works here') : console.log('And here');
a===0 || b===0 && console.log('Doesn\'t work here');
a===0 && console.log('The && works for a single test');
Here's the link
Just take parenthesis to prevent operator precedence of && over ||
(a === 0 || b === 0) && console.log('aloha amigo')
Without parenthesis, you get (now with to show the precedence) a different result.
a === 0 || (b === 0 && console.log('aloha amigo'))
^^^^^^^ first evaluation
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ second evaluation

JavaScript && Operator used for returns

I am working understanding a JavaScript library and I came across this statement:
const assetsManifest = process.env.webpackAssets && JSON.parse(process.env.webpackAssets)
Then later on in the library, it uses the assetsMannifest like an object e.g.
assetsManifest['/vendor.js']
I thought the && operator was only used to return boolean values in logical checks. Can someone explain to me what is going on here?
Many thanks,
Clement
This operator doesn't always return true or false. It doesn't work like in some other programming languages. In JavaScript && operator returns the first value if it's falsy or the second one if not.
Examples:
null && 5 returns null because null is falsy.
"yeah yeah" && 0 returns 0 because every string is truthy.
Not so obvious :-)
Further reading:
Why don't logical operators (&& and ||) always return a boolean result?
&& returns first value converting to false or last value converting to true. It's because no need to calculate full logical condition with && if first value is falsy
console.log(55 && 66);
console.log(0 && 77);
console.log(88 && 0);
Also you can use && or || as if operator:
if (itsSunny) takeSunglasses();
equals to
itsSunny && takeSunglasses();
in that context it is checking if process.env.webpackAssets is a truthy value. If it is it will evaluate and return the next part. in this case JSON.parse(process.env.webpackAssets)
The logic is essentially
if (process.env.webpackAssets) {
return JSON.parse(process.env.webpackAssets)
}
else {
return process.env.webpackAssets // (null | undefined | 0 | '' | false)
}
Both && and || are evaluting there arguments in lazy mode and return the last value, after witch the result is known.
123 && (0 || '' && 78) || 7 && 8 || [] && {} || 90 || 77 && 13
###_^^ both results are possible 123 && ???
#_^^ first part is falsy, resume 0 || ??
#####_^^ can't be true, return ''
^^_########## 0 || '' return ''
^^_################ return ''
#######################_^^ resume
#_^^ resume
^^_# return 8
^^_###### return 8
^^_########################## drop
And the result is 8.

OR operator with real numbers

Why is the mid number result of this statement?
(0 || 0.571428571428571 || 1) == 0.571428571428571
How the comparsion works?
Well. Looks like stupid question. For those who works in php where this statement has a different result could be helpfull to know that JS will return number instead bool.
|| is a short-circuiting operator. It evaluates its left-hand operand, and returns that if it's truthy, otherwise it evaluates and returns its right-hand operator. When you have a sequence of || operators, it performs this left-to-right, returning the first truthy value (or the last value if none are truthy).
In your example, 0 is falsey, so 0.571428571428571 is the first truthy value, and it's returned.
Your expression is interpreted as
((0 || 0.571428571428571) || 1)
The result of the first || is truthy, so that's the result of the overall expression. That's how || works: the result is the left-hand operand if it's truthy, or else the right-hand operand.
The answer to this lies in the fact that 0 is considered a false value while non-zero numbers are considered true.
Since || and && will short circuit and return as soon as it knows the outcome. For OR expressions this means that the first truthy value will be returned. For AND expressions it means the first false value is returned:
(true && true && 0 && true) === 0
(false && false && 1) === 1
(false || false || 1 || false) === 1
(false || false || 0) === 0
Since the first value in your expression is a falsey value, it is not returned but the floating point is a truthy value, so it is returned.

if(xxx || xxx), what am I doing wrong?

Can someone explain to me what am I doing wrong?
function navMenuIntervalCheck() {
if (currentSiteUrl != "subsites/players.php" || currentSiteUrl != "subsites/itemshop.php") {
$.ajax({
url: currentSiteUrl,
cache: false,
success: function (dataForContainer) {
$('#container').html(dataForContainer);
}
});
}
screenControlCheck();
};
setInterval(function () {
navMenuIntervalCheck()
}, 5000);
When I run my website it refreshes even when currentSiteUrl==subsites/players.php
As x!='a' || x!='b' is always true, I guess you wanted && instead of ||.
Read || as OR and && as AND.
More details in the MDN on logical operators.
currentSiteUrl can only have one value, so it will always be that at least one of the values you're testing will not equal currentSiteUrl, making the if condition always true.
I think you meant to use && or you meant to do == with ||.
Your code says this :
Refresh when currentSiteUrl is different than subsites/players.php or different than subsites/itemshop.php.
So subsites/players.php is indeed different than subsites/itemshop.php
Use && instead of ||
Look at your if statement:
if (a != foo || a != bar)
Lets look at the possibilities:
a = foo. This will evaluate as true, because a != bar
a = bar. This will evaluate as true, because a != foo
a = anything else. This will evaluate as true, because a != foo
Your if statement always evaluates to true.
As others have already said, you want to replace your || with &&.
Let me throw a logical rule at you, called DeMorgan's Law. It's really useful when learning how to set up a good if statement.
!(a || b) === !a && !b
also
!(a && b) === !a || !b
What that says is: "Not (one event or another)" is the same thing as "Not one event and not another", and "Not (one event and another)" is the same thing as "Not one event or not the other".
I know this has been answered but thought it might help to add some additional information using your own code.
As said, switching logical operator from || to && will work:
if (currentSiteUrl != "subsites/players.php" && currentSiteUrl != "subsites/itemshop.php")
But why is that?
Using ||
The || logical operator returns true if either the first or second expression is true and only if both are false will it return false.
Hence:
if currentSiteUrl != "subsites/players.php" is true you end up in the if block
if currentSiteUrl != "subsites/players.php" is false and currentSiteUrl != "subsites/itemshop.php" is true you end up in the if block
There will never be another scenario as your variable currentSiteUrl can only hold a single value and as such one of the expressions will always be true causing you to always end up in the if block.
Using &&
Using the && logical operator on the other hand though returns false if either the first or second expression is false and only if both are true will it return true.
Hence:
if currentSiteUrl != "subsites/players.php" is true and currentSiteUrl != "subsites/itemshop.php" is true you end up in the if block
if currentSiteUrl != "subsites/players.php" is true and currentSiteUrl != "subsites/itemshop.php" is false you don't end up in the if block
if currentSiteUrl != "subsites/players.php" is false you don't end up in the if block
There will never be another scenario, because only if both expression are true will you end up in the if block and as soon as either expression is false will you not.
How are you getting the currentSiteUrl. A url is followed by protocol:://domain
Try using the follwoing property to get URL and then match it
window.location.href
This url will also include the http or https and domain name

Categories

Resources