Input Validator

We will explore for loops vs. while loops in this project. We will also learn how to debug three different types of errors.

Fork this replit project to begin: https://replit.com/@buckldav/InputValidatorStarter.

Syntax Errors

Our Input Validator must meet the following requirements:

• Check that the password is 8 letters or longer.
• Continually reprompt until that condition is met.

Syntax Errors occur when there is a spelling or grammar error in the code. Consider the code you’ve started with:

let input = ""

function setup() {
  for (let i = 0; i < 3; i++) {
    input = prompt("Enter a password")
if (input.length < 8) {
alert("Too Short") }
  alert("Valid password!")
}

Console output:

SyntaxError: Unexpected end of input
    at /script.js:9:2

This error message indicates that there is something wrong around line 9. The “end of input” indicates that we are likely missing a {} or a ().

One thing that can help us debug this is indenting code blocks (making sure each {} lines up). Select lines of code and use Tab to indent to the right and Shift+Tab to unindent to the left.

Code after tabbing:

let input = ""

function setup() {
  for (let i = 0; i < 3; i++) {
    input = prompt("Enter a password")
    if (input.length < 8) {
      alert("Too Short") 
    }
    alert("Valid password!")
}

We are missing one }. We only want the "Valid password!" message to appear after the loop. Let’s make sure that we add the } before the validity message.

let input = ""

function setup() {
  for (let i = 0; i < 3; i++) {
    input = prompt("Enter a password")
    if (input.length < 8) {
      alert("Too Short") 
    }
  }
  alert("Valid password!")
}

Logic Errors

Logic Errors occur when the program runs fine but gives an undesired output. Currently the program correctly checks for the length of the password but asks the user for a password 3 times no matter what. We need to modify our code so the loop continues until the password is valid and then stops.

While Loops

As opposed to for loops which execute for a certain number of times, while loops execute while a condition is true.

while (condition is true) {
  // execute this
}

We can modify our code to have a loop where the user is prompted for a password until they get it right. Replace the for loop with a while loop.

let input = ""

function setup() {
  while (input.length < 8) {
    input = prompt("Enter a password")
    if (input.length < 8) {
      alert("Too Short") 
    } 
  }
  alert("Valid password!")
}

Runtime Errors

Runtime Errors occur while the program is running; usually the user does something which causes the program to crash. To demonstrate, we can crash the program if the user types in something too short. Add the line throw "SHORT" in your if statement to throw an error to the console and crash the program.

let input = ""

function setup() {
  while (input.length < 8) {
    input = prompt("Enter a password")
    if (input.length < 8) {
      alert("Too Short") 
      // Throws an error with the message "SHORT"
      // Crashes the program if unhandled
      throw "SHORT"
    } 
  }
  alert("Valid password!")
}

Console output (for short input):

Uncaught (in promise) SHORT

Notice how the program crashed when the password was too short? You can now get rid of the throw "SHORT" line.

Final Code:

https://replit.com/@buckldav/InputValidator

let input = ""

function setup() {
  while (input.length < 8) {
    input = prompt("Enter a password")
    if (input.length < 8) {
      alert("Too Short") 
    } 
  }
  alert("Valid password!") 
}