Почему эта проверка JavaScript всегда терпит неудачу

Question

У меня есть классическая проверка ввода для электронной почты и пароля, но по какой-то причине моя логика не работает, и я не могу понять, в какой части она не работает.Это код, который я реорганизовал от кого-то другого, и теперь он вызывает много проблем

function Validation() {
  this.regex = {
    email: new RegExp(/[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9]+\.[a-zA-Z0-9-]+/),
    password: new RegExp(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{6,13}/),
  },
  this.email = function () {
    let valElement = document.getElementById("mail");
    console.log(valElement);
    let valueR = valElement.value.toString();
    console.log(valueR);
    let erorrEl = document.getElementById("error");

    let validate_mail = valueR.length == 0 && this.regex.email.test(valueR);
    console.log(validate_mail);
    console.log(this.regex.email);
    if(!validate_mail){
      valElement.className = "invalid";
      erorrEl.innerHTML = "Please enter a correct email";
      erorrEl.className = "error active"
      console.log("not validated email");
      event.preventDefault();
    }else{

      valElement.className = "valid";
      erorrEl.innerHTML = "";
      erorrEl.className = "error"
      console.log("validated email");
    }
  }
  this.password = function () {
    let valElement = document.getElementById("pass");
    let valueR = valElement.value;
    let erorrEl = document.getElementById("error2");
    let validate_pass = valueR.length == 0 && this.regex.password.test(valueR);
    if(!validate_pass){
      valElement.className = "invalid";
      erorrEl.innerHTML = "Please enter a correct password";
      erorrEl.className = "error active"
      console.log("not validated password");
      event.preventDefault();
    }else{
      valElement.className = "valid";
      erorrEl.innerHTML = "";
      erorrEl.className = "error"
      console.log("validated password");
    }
  }
  this.form = function(){
    if(this.password && this.email){

    }else{

    }
  }
}

var Valdator = new Validation();
        Valdator.email();
        Valdator.password();

Обычно я вызываю эти функции электронной почты и пароля Valdator в другом файле, где это запрос от API,но идея здесь та же, я не думаю, что это могло бы иметь значение

Answer 1

Ваш RegEx никогда не выполняется, потому что valueR.length == 0 оценивается как false, что приводит к короткому замыканию вашего &&, прежде чем он сможет выполнить вторую часть.Помните, что если вы используете два оператора AND и первое утверждение оценивается как false, нет необходимости оценивать второе утверждение, поскольку оба значения false && true и false && false оцениваются как false.

При этом нет смысла проверять valueR.length == 0 в качестве предварительного условия для оценки RegEx на valueR - зачем нам запускать RegEx для строки 0 длины?Вы должны перевернуть эту логику на !==.

И, пожалуйста, всегда используйте === или !== в будущем, так как == запутается в преобразовании типов.

let validate_pass = valueR.length !== 0 && this.regex.password.test(valueR);