如何通過輸入元素（原始js）實時檢查用戶是否存在於JavaScript對象中

Question

我是JS的新手，正在嘗試實時檢查JavaScript對象中是否存在用戶或任何值，目標是在Firebase中實現此目的，以防止在用戶名已被使用的情況下阻止用戶注冊，但是我首先要在本地進行操作，因為我正在學習。 到目前為止，這就是我所擁有的。

 let input = document.getElementById('input') let btn = document.getElementById('btn') btn.disabled = false let users = [ { uname: "mark" }, { uname: "sarah" }, { ...others uname } ] input.addEventListener('input', () => { input.value = input.value.replace(regex, "") check(input.value) }) function check(val) { users.forEach((item) => { let uname = item.uname if (uname.indexOf(val) > -1 && uname === val) { console.log('That user name has been taken') btn.disabled = true } else { console.log('Ok') btn.disabled = false } }) } 

問題是當我輸入輸入元素Im時，同時觸發了if和else，而while（val）匹配了一些鍵/值對，而其他鍵則不匹配，然后我可以使用輸入的用戶名Im我想要的是。

我該如何解決？ 謝謝。

Answer 1

您無需檢查是否已找到用戶名。

function isUsernameAvailable (val) {
    for (var i = 0; i < users.length; i++) {
        var uname = users[i].name;

        if (uname === val) {
            console.log('That user name has been taken')
            btn.disabled = true

            return false; // the username is taken, we can stop checking
        }
    }

    console.log('Ok')
    btn.disabled = false

    return true;
}

另外， forEach不允許您提早退出循環，並且您無需在找到匹配項后檢查每個用戶（如果找到匹配項）。