如何选择获取请求中收到的所有数据并检查每个项目

Question

我将登录名和密码数据作为对象 [ { “id”：“1”， “登录”：“管理员”， “密码”：“管理员” }, { “id”：“2”， “登录”：“abc”， “密码”：“nmp”， }, { “id”：“3”， “登录”：“hjjk”， “密码”：“sddr”， } ] 现在我只检查第一个对象

async function authWithLoginAndPassword() {
    const response = await fetch('');
    const data = await response.json();
    const logUser = data[0].login;
    const passwordUser = data[0].password;
    return { logUser, passwordUser }
}
submit.addEventListener('click', async ()=> {
    try {
        ...
        let register = await authWithLoginAndPassword();
        if(loginUser !== register.logUser) {
           ...
        } 
        if(loginUser === register.logUser) {
           ...
        }
        if(password !== register.passwordUser) {
            ...
        } 
        if(password === register.passwordUser) {
            ...
        }
        if(loginUser === register.logUser && password === register.passwordUser) {
            ...
        }
     } ...
})

如何在另一个函数中检查所有用户名和密码？以及如何编写带有错误的 if 语句，例如，如果登录名不匹配，则 div 会出现登录名不正确且边框变为红色的错误。和密码类似，但另一个 div 出现在那里。如果使用过滤器

Answer 1

你可以使用

data.forEach(row => {
  console.log(row); // do the matching here
})

或像这样过滤数组

const loggedUser = data.filter(value => { return value.login === loginUser && password === value.password})[0];

您可以更新 authWithLoginAndPassword

async function authWithLoginAndPassword() {
    const response = await fetch('');
    const data = await response.json();
    return data;
}

Answer 2

您可以使用数组过滤功能。 (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter)

async function getUsers() {
    const response = await fetch('');
    const users = await response.json();
    return users;
}  

submit.addEventListener('click', async ()=> {
    try {
        const users = await getUsers();
        const authenticatedUser = users.filter(user => {
          return user.login === loginUser && user.password === password;
        })[0]; // 0 index returns first found user with matching properties.

        if (authenticatedUser) {
         // authenticated 
        } else {
         // not authenticated
        }
    } catch(e) {

    }
});

现在，authenticatedUser 要么是匹配 loginUser 的登录名和密码属性的用户对象，要么是未定义的。