Creating a If function to create messages

JavaScript
1

Hi Everyone,

I’m new to Javascript and have a course Assignment to create messages using the IF function.
We are learning Logical Operators that we need to use in this assignment. (|| &&)
Would GREATLY appreciate help, feedback, suggestions!

Assignment:
Create a set of if functions that will replace the content in the “message” paragraph with a specific message according to the following criteria:
a. If the student achieved a score of 10, the paragraph should read “Congratulations on your perfect score!”
b. If the student achieved a score of 8 or 9, the paragraph should read “You did very well! Keep learning.”
c. If the student achieved a score of 5, 6 or 7, the paragraph should read “You passed, but there is some room for improvement”
d. If the student achieved a score lower than 5, the paragraph should read “Sorry, you did not achieve a passing grade. Keep working at it!”

My Assignment Result:

var message = document.getElementById("message");
var score$1 = 10;
var score$2 = 9;
var score$3 = 8;
var score$4 = 7;
var score$5 = 6;
var score$6 = 5;
var score$7 = 4;

//If the student achieved a score of 10, the paragraph should read "Congratulations on your perfect score!"  
if (score$1 == 10) {
    message.innerHTML = "Congratulation on your perfect score!";
}

 //If the student achieved a score of 8 or 9, the paragraph should read "You did very well! Keep learning."
if ((score$3 == 8) || (score$2 == 9)) {
  message.innerHTML = "You did very well! Keep learning.";
}
  
//If the student achieved a score of 5, 6 or 7, the paragraph should read "You passed, but there is some room for improvement."
if ((score$6 == 5) || (score$5 == 6) || (score$4 == 7)) {
  message.innerHTML = "You passed, but there is some room for improvement.";
}

 //If the student achieved a score lower than 5, the paragraph should read "Sorry, you did not achieve a passing grade. Keep working at it!"
if (score$7 < 5) {
   message.innerHTML = "Sorry, you did not achieve a passing grade. Keep working at it!"
}
2

It looks like the score should be input? If so, then you should only have one input variable.

So you’d have something more like.

const message = document.getElementById(“message”);
const score = document.getElementById(“score”);

//If the student achieved a score of 10, the paragraph should read “Congratulations on your perfect score!”
if (score == 10) {
    message.innerHTML = “Congratulation on your perfect score!”;
}

//If the student achieved a score of 8 or 9, the paragraph should read “You did very well! Keep learning.”
if ((score == 8) || (score == 9)) {
    message.innerHTML = “You did very well! Keep learning.”;
}

//If the student achieved a score of 5, 6 or 7, the paragraph should read “You passed, but there is some room for improvement.”
if ((score == 5) || (score == 6) || (score == 7)) {
    message.innerHTML = “You passed, but there is some room for improvement.”;
}

//If the student achieved a score lower than 5, the paragraph should read “Sorry, you did not achieve a passing grade. Keep working at it!”
if (score < 5) {
   message.innerHTML = “Sorry, you did not achieve a passing grade. Keep working at it!”
}

Though this should be refactored using else if and you should probably use <= or >= instead of == || == || ==

1 Like
3

Thank YOU! That’s great information and I understand your comment about the score.

Now I took your suggestion and added > and else if statements. Is the below correct?

 //If the student achieved a score of 10, the paragraph should read "Congratulations on your perfect score!"
if (score$1 >= 10) {
  message.innerHTML = "Congratulation on your perfect score!";
} else if 

//If the student achieved a score of 8 or 9, the paragraph should read "You did very well! Keep learning."
(score$3 >= 8 || score$2 >= 9) {
  message.innerHTML = "You did very well! Keep learning.";
} else if

//If the student achieved a score of 5, 6 or 7, the paragraph should read "You passed, but there is some room for improvement."
(score$6 >= 5 || score$5 >= 6 || score$4 >= 7) {
  message.innerHTML = "You passed, but there is some room for improvement.";
} 

else
//If the student achieved a score lower than 5, the paragraph should read "Sorry, you did not achieve a passing grade. Keep working at it!"
  
(score$7 < 5) 
    message.innerHTML = "Sorry, you did not achieve a passing grade. Keep working at it!";
}
4

else will not have a test on it; it will simply catch anything that did not match the previous conditions.

Also if you’re doing with a single score, you’ll need to change the variables in that code to all be the new score variable.

2 Likes
5

Hi @Loranne,

I’ve formatted the code in your previous posts.

You can do this yourself quite easily. Just select the block of text in the text editor and click on the </> in the horizontal menu at the top of the textbox and it will format it into a code block :slight_smile:

4 Likes
6

Closer but not quite. Like m_hutley says, all of the score$ whatever should just be score. And the last else won’t work because you can’t have a condition without an if in that pattern (just remove the condition altogether).

Also the >= is being overused in your changes. ALL of them should remain == EXCEPT this one.

(score$6 >= 5 || score$5 >= 6 || score$4 >= 7) {

instead of having three checks, there should just be two, and it should use the && (and) instead of the || (or). So you should have something like this.

(score >= 5 && score <= 7) {

That line now says if score is greater than or equal to 5 AND less than or equal to 7 (meaning 5,6 or 7), then execute the code inside.

Might I also suggest you move the comments INSIDE the brackets. It will improve the code readability immensely. So instead of

else if 

//If the student achieved a score of 8 or 9, the paragraph should read "You did very well! Keep learning."
(score$3 >= 8 || score$2 >= 9) {
  message.innerHTML = "You did very well! Keep learning.";
}

You have

else if (score == 8 || score == 9) {
  //  If the student achieved a score of 8 or 9, the paragraph should read "You did very well! Keep learning."
  message.innerHTML = "You did very well! Keep learning.";
}
2 Likes
7

YES!! You are Amazing! This all makes sense! I’m correcting my work and adding this valuable information to my Java Troubleshoot notebook.

THANK YOU! :slight_smile:

1 Like