Returning a boolean value in a JavaScript function

Question

I am doing a client side form validation to check if passwords match. But the validation function always returns undefined.

function validatePassword(errorMessage)
{
   var password = document.getElementById("password");
   var confirm_password = document.getElementById("password_confirm");

   if(password.value)
   {
      // Check if confirm_password matches
      if(password.value != confirm_password.value)
      {
         return false;
      }
   }
   else
   {
      // If password is empty but confirm password is not
      if(confirm_password.value)
      {
         return false;
      }
   }
   return true;
}

Please note that the validatePassword is called from a member function of the Form object.

function Form(validation_fn)
{
   // Do other stuff
   this.submit_btn = document.getElementById("submit");
   this.validation_fn = validation_fn;
}

Form.prototype.submit = funciton()
{
   var result;
   if(this.validation_fn)
   {
      result = this.validation_fn();
   }

   //result is always undefined
   if(result)
   {
       //do other stuff
   }
}

Answer 1

You could simplify this a lot:

• Check whether one is not empty
• Check whether they are equal

This will result in this, which will always return a boolean. Your function also should always return a boolean, but you can see it does a little better if you simplify your code:

function validatePassword()
{
   var password = document.getElementById("password");
   var confirm_password = document.getElementById("password_confirm");

   return password.value !== "" && password.value === confirm_password.value;
       //       not empty       and              equal
}

Answer 2

You could wrap your return value in the Boolean function

Boolean([return value])

That'll ensure all falsey values are false and truthy statements are true.

Answer 3

An old thread, sure, but a popular one apparently. It's 2020 now and none of these answers have addressed the issue of unreadable code. @pimvdb's answer takes up less lines, but it's also pretty complicated to follow. For easier debugging and better readability, I should suggest refactoring the OP's code to something like this, and adopting an early return pattern, as this is likely the main reason you were unsure of why the were getting undefined:

function validatePassword() {
   const password = document.getElementById("password");
   const confirm_password = document.getElementById("password_confirm");

   if (password.value.length === 0) {
      return false;
   }

   if (password.value !== confirm_password.value) {
      return false;
   }
  
   return true;
}