Operators & Expressions in JavaScript: A Simple Grading System

So, today I dove into the world of operators and expressions in JavaScript, and I thought it’d be a great chance to build something simple which happens to be a grading system. This helped me really understand how powerful these basic concepts can be when it comes to evaluating conditions and making decisions in my code.
Let me walk you through how I approached it.
What Are Operators and Expressions?
Before jumping into the code, I want to quickly clarify what operators and expressions mean because they’re the core of what I’m going to show you.
Operators: These are symbols that tell JavaScript to perform some operation on variables or values. For example,
>=
checks if a number is greater than or equal to another, and===
checks if two things are exactly equal.Expressions: These are just pieces of code that evaluate to a value. For instance,
2 + 3
is an expression that evaluates to5
. So basically, everything that gives you a result is an expression.
With that said, let’s get into the fun part!
The Code: Creating the Grading System
I wanted to build a simple grading system where you input a score, and based on that score, the program would determine the grade and provide a motivational comment. Here’s the code I came up with:
let score = 63;
let grade = score >= 90 ? "A"
: score >= 80 ? "B"
: score >= 70 ? "C"
: score >= 60 ? "D"
: "F";
let comment = grade === "A" ? "Excellent"
: grade === "B" ? "Great job"
: grade === "C" ? "Good effort"
: grade === "D" ? "Keep pushing"
: "Needs improvement.";
console.log("Score:", score);
console.log("Grade:", grade);
console.log("Comment:", comment);
Breaking It Down: How It Works
Setting the Score:
I start by defining thescore
variable. You can play around with this value to test different results. I initially set it to63
, but you can change it to see how the grading changes.let score = 63;
The Ternary Operators for Grading:
The grading logic is where I used ternary operators which are basically a shorthand forif...else
. Instead of writing out multipleif
statements, I used a single line to check the score and assign the corresponding grade:let grade = score >= 90 ? "A" : score >= 80 ? "B" : score >= 70 ? "C" : score >= 60 ? "D" : "F";
Here’s how it works:
If the score is
90
or above, the grade is"A"
.If the score is between
80
and89
, the grade is"B"
, and so on.If the score is less than
60
, the grade is"F"
.
The format looks like this:
condition ? value_if_true : value_if_false
The Comment Based on the Grade:
Once I’ve got the grade, I used another set of ternary operators to print a motivational comment depending on the grade:let comment = grade === "A" ? "Excellent" : grade === "B" ? "Great job" : grade === "C" ? "Good effort" : grade === "D" ? "Keep pushing" : "Needs improvement. 💡";
This part checks if the grade is
"A"
,"B"
,"C"
, or"D"
and assigns a different comment based on the grade. For example, if the grade is"A"
, it will print"Excellent"
, and if it's"D"
, it will say"Keep pushing"
.Displaying the Result:
Finally, I useconsole.log()
to display the result in the terminal:console.log("Score:", score); console.log("Grade:", grade); console.log("Comment:", comment);
This outputs the score, grade, and the corresponding comment.
Example Output
Here’s what happens when I run the code with a score of 63
:
Score: 63
Grade: D
Comment: Keep pushing
But if I change the score to 92
, I get:
Score: 92
Grade: A
Comment: Excellent
Pretty neat, right? The grading system automatically adjusts based on the score, and the comment changes accordingly.
Why Is This Useful?
What’s great about this approach is that I was able to build a fully functional grading system using just operators and expressions. It’s compact, and using ternary operators made it easy to write clean and readable code without the need for multiple if
statements.
For those of you who are new to JavaScript, getting comfortable with operators and expressions is crucial. You’ll use them all the time in your code to evaluate conditions, make decisions, and control the flow of your program.
Give It a Go!
I recommend trying this out yourself. Modify the score and see how the grade and comment change. You could also add more conditions, like handling decimal scores or adding more grades if you want to expand it.
Final Thoughts
Operators and expressions are the backbone of decision-making in JavaScript, and today’s project showed me how much you can do with just a few lines of code. By understanding how to use ternary operators, comparison operators, and logical expressions, I’m more confident in my ability to write clean, effective JavaScript.
How do you like to use operators in your projects? Feel free to share your thoughts or questions in the comments below!
Subscribe to my newsletter
Read articles from Ayokomi directly inside your inbox. Subscribe to the newsletter, and don't miss out.
Written by
