Su problema es que su ciclo for seguirá ejecutándose para todas las entradas en su matriz de data . Eso significa que incluso si se encuentra una coincidencia, el ciclo continúa ejecutándose, lo que hace que el texto interno se reemplace hasta el último elemento.

Hay una manera simple de hacer esto: todo lo que desea es verificar si la entrada del usuario coincide con algún valor en la clave s anidada en la matriz de objetos. Puede usar Array.prototype.findIndex para recuperar el índice que coincida con sus requisitos.

Si el índice es mayor que -1 , entonces sabrá que tiene una coincidencia. De lo contrario, puede devolver la declaración de reserva, por ejemplo:

 const foundIndex = data.findIndex(d => ds === input.value); if (foundIndex > -1) { recv.innerText = data[foundIndex].r; } else { recv.innerText = "I don't understand"; } document.body.appendChild(recv);

Para simplificar, puede condensar esto en una sola línea:

 const foundIndex = data.findIndex(d => ds === input.value); recv.innerText = foundIndex > -1 ? data[foundIndex].r : "I don't understand";

Por supuesto, esta solución solo funciona si s valores anidados son únicos en su matriz. De lo contrario, siempre obtendrá la primera instancia coincidente que ocurra.

Hay algunos consejos adicionales:

• No use enlaces JS en línea. Use addEventListener en su lugar
• Es posible que desee convertir input.value a minúsculas para que podamos realizar una coincidencia que no distinga entre mayúsculas y minúsculas
• Almacene sus data fuera de la función: es una constante y no tiene que volver a declararse cada vez que se invoca la función

Vea la prueba de concepto a continuación con consejos adicionales aplicados:

 const data = [{ "s": "hi", "r": "hello" }, { "s": "whats up", "r": "alright" }]; function senda() { const input = document.querySelector('input'); const send = document.createElement('p'); const recv = send.cloneNode(true); send.innerText = input.value; document.body.appendChild(send); const foundIndex = data.findIndex(d => dstoLowerCase() === input.value.toLowerCase()); recv.innerText = foundIndex > -1 ? data[foundIndex].r : "I don't understand"; document.body.appendChild(recv); } document.querySelector('button').addEventListener('click', senda);

 <input> <button>-></button>

Agregue un código de línea.

Cuando el valor de entrada es igual a data[i].s, agregue "i = data.length;"

 function senda() { var input = document.querySelector('input'), send = document.createElement('p'), recv = send.cloneNode(true), data = [{ "s": "hi", "r": "hello" }, { "s": "whats up", "r": "alright" }]; send.innerText = input.value; document.body.appendChild(send); for (var i = 0; i < data.length; i++) { if (input.value === data[i].s) { recv.innerText = data[i].r; document.body.appendChild(recv); i = data.length; } else { recv.innerText = "I don't understand"; document.body.appendChild(recv); } } }

 <input> <button onclick="senda()">-></button>

Su código está funcionando bien.

Pero no está funcionando como usted piensa.

los datos tienen 2 obejct : y el primer bucle

si es igual a hi e imprime hello no funciona otra declaración

y el segundo bucle no es igual a hi , por lo que esta vez funciona la else statement

por lo que debe romper si encuentra el mismo valor

como abajo

 function senda() { var input = document.querySelector('input'), send = document.createElement('p'), recv = send.cloneNode(true), data = [{ "s": "hi", "r": "hello" }, { "s": "whats up", "r": "alright" }]; send.innerText = input.value; document.body.appendChild(send); var isInputInData = false; for (var i = 0; i < data.length; i++) { if (input.value == data[i].s) { recv.innerText = data[i].r; isInputInData = true; break; } } if(!isInputInData) recv.innerText = "I don't understand"; document.body.appendChild(recv); }

 <input> <button onclick="senda()">-></button>