I Finished My First Project In JavaScript | Day 8

Rabee AmanRabee Aman
4 min read

With a quick brush-up on errors, I was ready to jump into making the game.

How I finished my game

Yesterday, I made functions for both my input and the computer’s input. The tasks I had left were:

  • Compare both choices and figure out who wins the round.

  • Keep track of the score (first to reach 5 points wins).

  • Add a way to restart the game after it’s over.

A simple function wasn’t enough to connect both the inputs. Then it dawned on me: I had to restart the inputs over and over.

So what repeats something over and over? A loop.

I used a while loop to repeat the turn until either me or the computer reached 5 points. Finally, a full game was complete.

All I then had to do was find a way for the player to restart the game. I simply used a method called recursion. It’s when you call a function within the same function. Basically, I defined a function for the whole game (rps()) and called it inside it.

The final code took quite a bit of fine-tuning and debugging to work. But I was able to get the job done:

function comp() {
    let play=Math.floor(Math.random()*3);
    if (play === 0) {
        let ans="rock";
        console.log(" ======== Computer played :",ans, "========");
        return ans

    } else if (play === 1) {
        let ans="paper";
        console.log(" ======== Computer played :",ans,"=========");
        return ans

    } else if (play === 2) {
        let ans="scissors";
        console.log(" ======== Computer played : ",ans,"=========");
        return ans

    }

}

function human() {
    var play=prompt("rock, paper or scissors?");
    console.log (" ======== You played :", play, "========");
    return play;

}

function outcome(com,hum) {
    if (com===hum) {
        return 0;
    } else if (com === "rock" && hum === "paper"|| hum === "scissors" && com === "paper" || hum === "rock" && com === "scissors") {
        return 1;
    } else {
        return 2;
    }
}

function rps() {
    console.log(" ==============ʀᴏᴄᴋ, ᴘᴀᴘᴇʀ, ꜱᴄɪꜱꜱᴏʀꜱ!================")
    var HS=0;
    var CS=0;
    while (HS!=5 && CS!=5) {

        let pro=human();
        let opp=comp();
        let result = outcome(opp,pro);
        if (result===1) {
            HS++;
        } else if (result===2) {
            CS++;
        } else if (result===0) {
            console.log("Tie");
        }
        console.log("You =",HS,"|| Computer =",CS)
    }
    if (HS===5) {
        console.log("==========Congratulations! You Win============");
    } else if (CS===5) {
        console.log("========You Lose. Better Luck Next Time!============");
    }
    let again=prompt("Do you wish to restart? yes/no?")
    if (again.toLowerCase()==="yes") {
        rps()
    } else if (again.toLowerCase()==="no") {
        alert("Thanks for playing!")
    }
}

rps()

Here’s what it does:

After my rock-paper-scissors game was complete, I uploaded it to GitHub — I’ve just finished my first project!

The next section on The Odin Project was about "clean code."

Presentation is half of the code.

Code is the core of any program, but if you or someone else needed to go back to inspect it, cluttered and messy code with random variables would look like a headache. Boring!

Really, though. No matter how good your logic is, you (and others on your project) will have a hard time deciphering and debugging the code.

So now, let’s learn some basic coding conventions.

Here are some practices followed by the JavaScript developer community in general:

  1. Name everything properly. Functions, variables, everything. It might be easy to just slap an "x" on a variable or function, but if you come back to the code later, you’ll be very sorry. And developers who look at your code will feel the same way.

  2. camelCase. Everything's named in a way that coders usually call camelCase. The first letter is lowercase, and subsequent words' first letters are uppercase. For instance, a function called "get a random number" would be "getRandomNumber".

  3. Name your "magic values." Numbers and data should be labelled with simple, searchable names.
    For example: 3600000 ms should be named one_hour.

  4. Indentation and line length. Choose a way to indent and stick to it. The exact way doesn't matter, consistency is what's important. Also, always cut long lines into smaller chunks.

  5. Spacing. Use spaces between variables, operators, etc. It makes your code more readable.

My Thoughts

Yeah, it's a lot of rules. Even now, I'm tempted to use a few easy letters to name variables. However, I now understand that writing code isn’t just about making something that works. It’s about making something that lasts, something others (and future me) can read without crying.

Learning more about the coding etiquette wrapped up my session. One thing I can truly say is that I'm so much more efficient today than I was a week ago. My confidence level? Still very high. Let's see what Day 9 has in store for me.

0
Subscribe to my newsletter

Read articles from Rabee Aman directly inside your inbox. Subscribe to the newsletter, and don't miss out.

Written by

Rabee Aman
Rabee Aman