DEV Community

Lucas Cruz
Lucas Cruz

Posted on

Verificando se item já existe em uma lista de objetos em JAVASCRIPT

obs: Para ver minha solução final vá ao fim do texto.

Olá, recentemente eu estava desenvolvendo um app em react-native e tive a necessidade da seguinte validação: verificar se item já existe em uma lista de objetos.

A principio você pode tentar simplesmente usar usar o método includes na lista

const newObject = {"name": "matematica",
 "startHour": "13:30",
 "endHour": "17:30"}


listObjects.includes(newObject)
Enter fullscreen mode Exit fullscreen mode

Porém dessa forma não vai funcionar devido a cada instancia de objeto ser uma instancia diferente, o que fará com que sempre retorne false.

Minha segunda solução foi:

let objectIsEqual = false
listSubject.forEach(item => {
  objectIsEqual = (item['name'] == subjectObject['name'] &&
            item['startHour'] == subjectObject['startHour'] &&
            item['endHour'] == subjectObject['endHour'])

  if(objectIsEqual){
    setError("disciplina já existe")
    return
  }
});
if(objectIsEqual) return
Enter fullscreen mode Exit fullscreen mode

Porém essa solução não funciona pois no javascript o forEach não é interrompido pelo return, o que faz com que isso só compare com o ultimo objeto da lista.

obs: Alias o Lucas Montano do canal Lucas Montano tem um vídeo interessante sobre isso: https://youtu.be/yLmoMBMDE4o?si=G2Q97C300NhnIqJZ

Então talvez uma solução seja usar o for simples:

const subjectObject = {
            "name":valueSubject,
            "startHour": startHour,
            "endHour": endHour
        }

for (let index = 0; index < listSubject.length; index++) {
            const item = listSubject[index]
            const objectIsEqual = (item['name'] == subjectObject['name'] &&
            item['startHour'] == subjectObject['startHour'] &&
            item['endHour'] == subjectObject['endHour'])

             if(objectIsEqual){
                setError("disciplina já existe")
                return
            }
        }
Enter fullscreen mode Exit fullscreen mode

Essa solução já funciona para essa validação porém pensando em diminuir o número de linhas de códigos e deixar essa solução mais concisa a solução final pode ser usando o método some:

obs: Para entender melhor como funciona o método some acesse: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Array/some

const subjectObject = {
            "name":valueSubject,
            "startHour": startHour,
            "endHour": endHour
        }
const objectIsEqual = listSubject.some(object => 
object['name'] == subjectObject['name'] &&
object['startHour'] == subjectObject['startHour'] &&
object['endHour'] == subjectObject['endHour'])

if(objectIsEqual){
      setError("disciplina já existe")
      return
}
Enter fullscreen mode Exit fullscreen mode

O resultado dessa validação no app:

Interface de app com inputs: nome da disciplina, hora de inicio e hora de fim. Botão de adicionar e abaixo do botão um erro dizendo "Disciplina já existe", abaixo uma lista de disciplinas

Ao tentar adicionar o mesmo item é exibido a mensagem de erro e o item não é adicionado.

Top comments (0)