javascript if state function doesn't read boolean - javascript

My code work with resize function boolean change with width,
but my function contain if statement doesn't read the boolean,
what is problem with my code?
I used = ==, but I don't know how to use them exactly
var footerMenu = ['#about', '#help']
var slideSwitch = false
function slideDown(){
footerMenu.forEach(function(list){
$(list+' p').click(function(){
$(list+' ul').slideToggle(300)
})
})
}
function slideClear(){
for( let i = 0; i < footerMenu.length; i++){
$(footerMenu[i]+' p').click(function(){
var choice = footerMenu[i]
footerMenu.splice(i, 1);
footerMenu.forEach(function(list){
$(list+' ul').slideUp(300)
})
footerMenu.splice(i, 0, choice);
})
}
}
function slideTotal(){
if(slideSwitch = true){
slideDown()
slideClear()
}
}
$(document).ready(function() {
checkWidth();
});
$(window).resize(function(){
checkWidth();
});
function checkWidth(){
$vWidth = $(window).width();
if($vWidth <576){
console.log("Width: Less than 576");
slideSwitch = true
}else{
console.log("Width: More than 576");
slideSwitch = false
}
}
slideTotal()
I hope correct my code, if I don't have any wrong please advice me how to solve it

= is the assignment operator. It changes the value of what is on the left hand side. It is usually not what you want in an if statement unless you really know what you are doing.
== and === are the comparison operators. The different between them is that == automatically converts the two arguments to the same type, whereas === does not. But that doesn't really matter, my advice is to always use === to compare variables in an if statement.
Also, comparing to true (x === true) is completely pointless because that is what an if statement already does; it is unnecessary.
(side note: you could do if (x === true === true === true), and that would be the same as if (x).)
The code you want is:
function slideTotal() {
if (slideSwitch) {
slideDown();
slideClear();
}
}

Well, to start:
function slideTotal(){
if(slideSwitch = true){
slideDown()
slideClear()
}
}
change: slideSwitch = true
to: slideSwitch == true

Related

Returning the correct item from the array

I am using code.org and I am trying to return the item from the array but receiving an error on line 34 that possibleFoods[selectedFood] is undefined. I cannot understand why, and is this what is stopping the food selections block from working? How should I correctly define selectedFood?
setScreen("BaseScreen");
onEvent("selectionbutton", "click", function( ) {
setScreen("food_decision_screen");
});
var selections = [true, true, true];
var possibleFoods = [
{name:"Raw pasta prima vera", info:{recipe:"", prepTime:{total:20,cook:0, prep:20}, image:""}},
{name:"Zucchini chips", info:{recipe:"", prepTime:{total:55,cook:30, prep:25}, image:""}}
];
var possibleFoods;
onEvent("preference_finished_button", "click", function( ) {
selections = [
getChecked("radio_buttonhot"),
getChecked("radio_buttonvege"),
getChecked("radio_button0-30")
];
if (selections[0] == false) {
if (selections[1] == false) {
if (selections[2] == true) {
selectedFood = 1;
}
}
}
setText("t_textOutputFoodInfo", "total time: " +
possibleFoods[selectedFood].info.prepTime.total);
setText("t_textOutput_foodSelectedName", "name: " +
possibleFoods[selectedFood].name);
});
selectedFood is undefined. Unsure how to define.
The selectedFood variable is not declared. Moreover, you are assigning it inside nested if conditions which might not be true always.
Try this:
Declare selectedFood outside with an initial value, right before the if statements.
var selectedFood = 0;
You have few problems here:
selectedFood is not being declared- e.g it has no "const", "var" or "let" before it.
If you do not know about scopes and the difference between var, const and let- read a bit here. Then you'll understand why its best to define selectedFood before the if blocks, and only fill up the value inside, like this:
let selectedFood;
if (selections[0] == false) {
if (selections[1] == false) {
if (selections[2] == true) {
selectedFood = 1;
}
}
}
selectedFood is undefined simply because it's not declared, in addition this line is never reached in your case: selectedFood = 1;.
Depending on what you're trying to achieve, build your conditions using Logical Operators.
replace this:
if (selections[0] == false) {
if (selections[1] == false) {
if (selections[2] == true) {
selectedFood = 1;
}
}
}
With this:
let selectedFood = 0; // Set by default to 0
if (!selections[0] && !selections[1] && selections[2]) {
selectedFood = 1;
}
Hope this helps!
EDIT: I might be able to give a more straight forward answer if you could link me to the challenge you're trying to solve.

If statement returns false when it should be true

I have a javascript function to get a property from a style attribute.
I am then checking if the attribute is equal to a specific point.
However, when I console.log() the value of the attribute, it is as expected but when I test the attribute value, it returns as false?
here is my code and screenshots:
var $paywhirlWidget = $(".payment-signup-section .container .row .col-xs-12:first-child iframe#paywhirl_frame"),
$widgetRow = $(".payment-signup-section .container .row .col-xs-12:first-child");
$.fn.inlineStyle = function (prop) {
var styles = this.attr("style"),
value;
styles && styles.split(";").forEach(function (e) {
var style = e.split(":");
if ($.trim(style[0]) === prop) {
value = style[1];
}
});
return value;
};
function checkForChanges() {
if ($(window).width() < 998) {
console.log(Boolean($paywhirlWidget.inlineStyle("height").toLowerCase() == "620px"));
console.log($paywhirlWidget.inlineStyle("height").toLowerCase());
if ($paywhirlWidget.inlineStyle("height").toLowerCase() == "620px") {
console.log("im here!!");
$widgetRow.css("display", "none");
}
} else {
if ($paywhirlWidget.inlineStyle("height") == "300px") {
console.warn("im here too!!");
$widgetRow.css("display", "none");
}
}
}
setInterval(checkForChanges, 500);
As an example, here is the "620px" test, as you can see, the first console.log() returns false, even though the second one shows the value as being exactly what I am testing for!
This is really confusing as I cannot understand why a value that is clearly true is returned as false when Boolean tested.
It looks like your style attribute has a space at the start of the value. Try using trim:
$.trim( $paywhirlWidget.inlineStyle("height").toLowerCase() ) === "620px"
Or update your inlineStyle plugin so that it does the trimming:
value = $.trim( style[1] );
Simpler to just use jQuery height() which returns number representing pixels
if ($paywhirlWidget.height() == 620)

If clause with multiple conditions

I seem to be lost or just seem to be confused.
To simplify the problem: I want to check whether each in an array holds true and if and only if all are true it should return a specific value.
var trueArray=[true,true,true,true];
As in my code, the array can have length up to 100 elements, I can't simply check for every element but need a for loop.
for(var i=0;i<trueArray.length;i++){
if(trueArray[i]===true)
{
//do something
}
}
However, the above code does something on each step of the loop but I only want it to do something once every condition held true and not in between. Can't think of the solution at the moment?
Use Array.prototype.every
if (trueArray.every(function(x) { return x; })) {
//do something
}
If it's guaranteed to be a boolean you can check if any of them are false instead of if they're all true with Array.prototype.indexOf
if(trueArray.indexOf(false) === -1) {
// none are false, so do stuff
}
You wouldn't need to use a loop or create a function.
Declare a check variable who is already true and set it to false if one of your array values is false. After that, check if it's true and do something.
Example:
var trueArray=[true,true,true,true];
var bCheckArrayVal = true;
for(var i=0;i<trueArray.length;i++){
if(trueArray[i]===false){
bCheckArrayVal = false;
}
if (bCheckArrayVal) {
// do something if true
} else {
// do something if false
}
}
Try the following code:
var currentValue = true;
for(var i=0;i<trueArray.length;i++){
if(trueArray[i]===false){
currentValue = false;
}
}
if(currentValue === true){
//do something
}
You should short circuit the logic as soon as you get a false value, must answers are not getting your question because of the misleading logic you put inside the for even though you only want it done once if all values are true.
You need something like
var flag=true;
for(var i =0;i
if (flag) { do something}
You can do it like this...
var trueArray=[true, true, true, true];
var allTrue=false;
for(var i=0;i<trueArray.length;i++){
if(trueArray[i]===false){
allTrue=false;
break;
}
else
{
allTrue=true;
}
}
if(allTrue==true)
{
// do something if all values are true
}
You must break the loop if the false value is detected.

Javascript variable comparison

I have javascript with global variable declared:
var IsUserAllowed = false;
And I have a function:
function setSelectedIdsInput(inputLogicalId) {
if (IsUserAllowed) {
This does not work, I assume the value of IsUserAllowed is in string.
So i did:
var isUserAllowedStr = IsUserAllowed.toString().toLowerCase();
if (isUserAllowedStr == "true") {
This works, Since im new to java script i wanted to know if its ok to compare strings like this.
This due to fact that doing:
if (isUserAllowedStr.localeCompare("true")) {
Did not work either !
Thanks!
Update - i suspect the global var was string and not Boolean. this why the if failed. when i did alert(IsUserAllowed) the output was "False"
var IsUserAllowed = false;
then
function setSelectedIdsInput(inputLogicalId) {
if (IsUserAllowed) {
// something true
} else {
// something false
}
or
if(IsUserAllowed === true)
but it is useless.
Try:
if (isUserAllowed === true) {
}
isUserAllowed is a boolean (true / false):
You can check it by simply doing
if (isUserAllowed) { }
Or
if (isUserAllowed === true) { }
Your example should work as expected.
You can play around in this JSFiddle to test for yourself: http://jsfiddle.net/bT8hV/
var IsUserAllowed = false;
function setSelectedIdsInput() {
if (IsUserAllowed) {
alert('TRUE');
}
else {
alert('FALSE');
}
};
setSelectedIdsInput();

Javascript if clause won't work

I'm having trouble with a javascript function that needs to take a global variable into account.
It's kind of a control mechanism I would like to implement, but I can't seem to get it right.
Here's the relevant code
<script type="text/javascript">
var active = 0;
function SetEndTime(lngOpenPersonID,lngToDoID){
if(active = 0){
alert('Time has been stopped');
}
else{
var strURL = 'blabla';
CallAJAXURL(strURL);
}
active = 0;
}
function SetStartTime(lngToDoID,lngToDoItemID,bitCountsForTotal){
if(active = 1){
alert('Time has been started');
}
else{
var strURL = 'blabla';
CallAJAXURL(strURL);
}
active = 1;
}
When I call SetStartTime without doing anything else, I always get the alert. Is there something wrong with my syntax?
if (active == 0) {
You need 2 "=" characters to make a comparison operator. There's also === which performs an equality comparison without type promotion.
Your code is syntactically correct because an assignment operation is a valid expression. The first if statement you had:
if (active = 0) {
will never be true, because the value of the expression is always zero. The second one:
if (active = 1) {
conversely is always true because the value is always one.
its not (alert = 1) .. its ( alert == 1 ).. your condition says its always true -- your assigning alert to 1

Categories

Resources