通過數組的循環（for）迭代

Question

我做了一個簡單的程序，用作電話簿。 當用戶在輸入字段中輸入姓名時，程序會搜索包含姓名和號碼的對象數組，如果找到姓名，則輸出姓名和電話號碼。 如果找不到該名稱，它會讓用戶知道。 但是，當我鍵入名稱時，即使數組包含給定名稱，結果仍然是“未找到名稱”。 這是代碼

const phonebook = [
 {name : `Adam`, number : `001`},
 {name : `Anna`, number : `002`},
]

const input = document.querySelector('input');
const btn = document.querySelector('button');
const para = document.querySelector('p');

btn.addEventListener ('click', function () {
 let searchName = input.value.toLowerCase();
 input.value = '';
 input.focus();

 for (let i = 0; i < phonebook.length; i++) {
     if (searchName === phonebook[i].name) {
         para.textContent = `${phonebook[i].name's number is ${phonebook[i].number}.`;
         break;
     } else {
         para.textContent = `Name not found in phonebook';
     }
}
});

Answer 1

para.textContent = ${phonebook[i].name} (<- missing closing bracket) 's number is ${phonebook[i].number}. ;

• 你在那里錯過了一個丟失的花括號。
• 您正在將輸入轉換為小寫，但您的數據源包含大寫字母。 然后將兩者都轉換為更低。

如果不是需要循環和 onClick 事件的特定情況，我建議：

• 使用 keydown 事件監聽器
• 使用過濾器

    btn.addEventListener(keydown, function {
            phonebook.filter((x) => x.name === input.value)
             if (phonebook.length === 1) {para.textContent = `${phonebook[0].name}'s number is ${phonebook[0].number}`}
            else if (phonebook.length === 0) {para.textContent = "not found"};
            })

或類似的東西。 因此，您的代碼在向用戶提供反饋方面更具響應性。