Login system that checks out if the user already has an account. If they have one then they get to l-CodePudding

My overall problem is actually finding the values of the variables ''loginEmail'' and ''loginPass'' inside my ''arrayRegistros''. It only becomes TRUE when I write the email and password inside includes manually, however, it always ends up turning into FALSE when I use the variables themselves. I tried converting the variables into strings, then used document.getElementById alongside a few other ideas but until now, none of them completed the login system I had planned. The help I need is how one can find a certain variable's value/object, inside a certain array.

            this.arrayRegistros;
            var loginEmail = document.getElementById('userEmail'); 
            var loginPass =  document.getElementById('userPass');

            var contaEmail = this.arrayRegistros.some((loginEmail) => {
                return loginEmail.emailRegistro.includes(loginEmail)
            })
            var contaPass = this.arrayRegistros.some((loginPass) => {
                return loginPass.passRegistro.includes(loginPass)
            })
            
            console.log(contaEmail)
            console.log(contaPass)
            
        }

CodePudding user response：

you should get values from inputs like this:

const data = [
   {
     user : 'jhon',
     password : 'asdf123'
   },
    {
     user : 'bob',
     password : 'asdf124'
   }
 ]
const userName = document.getElementById('userEmail').value;
const passWord= document.getElementById('userPassword').value;
const findUser = data.filter( item => item.user === userName && item.password === passWord);
if(findUser.length > 0){
  //user found
 }

CodePudding user response：

The first problem is that you are naming the parameter on the Array.prototype.some function the same as the variable you want to check outside of the predicate scope.

Second, suposing that this.arrayRegistros is a array with objects with the keys emailRegistro and passRegistro containing strings, DOM Elements CANNOT match with strings, but a element.value can.

Another thing you should have in mind is that includes is not an equality operator, 'a-very-strong-password'.includes('a'); will return true.

And, last, you should never validate login and password on the browser, because the user can edit the JavaScript code on-the-fly and get to login without any real credential.

With that in mind, I think the solution would be something like that (ignoring the browser validation problem):

const $userField = document.getElementById('userEmail');
const $passField = document.getElementById('userPass');

const registros = [
  {
    email: '[email protected]',
    password: 'a-very-strong-password'
  },
  ...anotherUsers
]; 

function login(registro) {
  const { value: user } = $userField;
  const { value: pass } = $passField;
  
  // You can use `Array.prototype.some` to just know if the specific user credentials exist, or use `Array.prototype.find` to know if exist AND grab the user, to further utilization
  const item = registros.find(item => item.email === user && item.password === pass);

  if (item) {
    // User found
  } else {
    // User not found
  }
}