Failure to complete conditional statements

1

Right after a Do While routine, I have the following. However, it seems to ignore this:

		if (coverOne = 1){
				context.fillRect(230, 370, 100, 50);
			}
			 else if (coverOne = 2) {
				context.fillRect(230, 390, 100, 50);
			}
			
			else if (coverOne = 3) {
				context.fillRect(230, 410, 100, 50);
			}
2

if (coverOne = 1){ should be if (coverOne == 1){ or if (coverOne === 1){
Notice that the one that is wrong only has one equal and the other two have 2 or 3.
One equal sign will assign a value to a variable, whilst == and === are used to comapare two values. When you assign a value to a variable that statement will return the value you assigned to the variable. So in if (coverOne = 1){ the coverOne=1 will assign 1 to coverOne and return 1 which is a true value and so if (coverOne = 1){ will always be true.
To compare values use == or ===. With two equal signs you get the um, forgot the correct term, but fuzzy comparison where things are converted to true, false values. So 1,“”,{}, etc are considered true, whereas 0, null, undefined, etc are considered false. Three equal signs wont convert anything before doing the comparison so 1 wouldnt equal {} like it would with 2 equal signs. When your just starting out its best to always use 3 to avoid problems with getting the conversion wrong, some people cant remember whats what and get unexpected results. Plus, 3 equal signs can be faster than two which has to do type conversion first, especially in Chrome.

Assignment (=)
Equality (==)
Strict equality (===)

1 Like
3

Thanks. I’ll give that a try. I was aware of == but didn’t think it would make a difference.

1 Like
4

Thanks, but that didn’t work. I added a draw rectangular box to see if it would get to that section and it still doesn’t. I tried to add the code here but it wouldn’t accept it, so here’s the link to where it can be found under the update link on this page.
Sagebrush Tidbits, geometry section - update link

1 Like
5

If you ran that in a browser and looked at the Console in the Web Developer Tools you would have seen an error like this…

Uncaught ReferenceError: context is not defined

If you checked the line number it gave you it would be this…

	        // Adding the below draw to see if it gets to this.
It was this line ->	context.fillRect(230, 370, 100, 50);
			// It doesn't complete this, so something is missing in the above script
			// The purpose of the below conditional statement is to cover over one of the three answers
			// with a rectangle.

So the execution of the script would have stopped there and never got to the lines with the comparisons. And if you removed that line then it will fail on the comparions as it will say coverOne is not defined. The reasons you are getting these errors is because you defined context and coverOne in the scope of the function assigned to windows.onload.
How and where a variable is defined will affect where else in the code that variable is available. To understand these concepts better look at MDN - Scope.
So to fix these problems all you have to do is move that code to inside the window.onload function.
Here is a working demo for you to look at… Demo