Comprobar si un elemento está dentro de un Array JavaScript

JavaScript

En artículos anteriores tuvimos la oportunidad de estudiar el manejo de Arrays o Listas en JavaScript, más sin embargo el uso de estos es muy amplio debido a que son estructuras que usamos muy frecuente en el desarrollo de aplicaciones Web.

Es por ello que en este artículo nos centraremos en como podemos comprobar si un elemento existe dentro de un Array de JavaScript.

¿Para que nos puede servir?

Para muchas cosas, todo depende de lo que estés realizando en tu proyecto, lo más común es validar si un elemento existe en un array para no incluirlo nuevamente.

Ejemplo de como comprobar si un elemento existe en un Array haciendo uso de JavaScript Nativo:

<script>
var frutas = ["Pera", "Manzana", "Uva", "Mango"];
 var valor = "Manzana";
 for (var i = 0; i < frutas.length; i++) {
 if(valor==frutas[i]){
 console.log('Si existe');
 break;
 }
 }
</script>

En el código anterior validamos todas las posiciones del array con el valor de nuestra variable y si encontramos una coincidencia entre cualquiera de sus posiciones y nuestra variable informamos con un mensaje y cerramos el ciclo.

Mejorando el código haciendo uso de una función:

<script>

var frutas = ["Pera", "Manzana", "Uva", "Mango"];
 
console.log(Validar_Array('Piña', frutas))
 
function Validar_Array(valor, arr) {
 var b=false;
 for (var i = 0; i < arr.length; i++) {
 if(valor==arr[i]){
 b = true;
 break;
 }
 }
 return b;
}
</script>

En el código anterior hacemos uso de una función que permite pasar el valor a validar y el array devolviendo true o false dependiendo el valor que pasemos, por lo cual sería re utilizable en todo nuestro código JavaScript.

Validar Haciendo uso de JQuery

Todos los que hemos tenido la oportunidad de usar JQuery sabemos las ventajas que esta librería tiene al momento de manipular los elementos de DOM y optimizar nuestro código JavaScript, veamos:

<script>
var frutas = ["Pera", "Manzana", "Uva", "Mango"];
console.log(Validar_Array('Uva', frutas))
function Validar_Array(valor, Arr) {
 var b=false;
 if($.inArray(valor, Arr)==-1){
 b=false;
 }else{
 b=true;
 }
 return b;
}
</script>

Si nos damos cuenta dejamos de usar el cilclo for y tan solo validamos con un condicional y el método $.inArray() de JQuery a nuestra función, sin duda mucho más cómodo y optimizado.

Este método devolverá -1 si no encuentra coincidencia con nuestro valor dentro del Array y en caso de encontrar un valor igual devolverá el index del mismo.

¡Suscríbete a mi canal, para acceder a más contenidos gratuitos!

2 comentarios

  1. Veronica Rodriguez Contestar

    Muchas gracias por el excelente ejemplo quisiera me puedas ayudar con el mío que va así:

    var estacionamiento = [“Rojo”, “Gris”, “Azul”, “Amarillo”, “Verde”];

    Escribe una función a la que se le pase como argumento un auto y que usando un ciclo revise la lista para ver si el carro está todavía en el estacionamiento.

    Usa el comando break; para detener el ciclo si ya fue encontrado.

    Define dos variables una que se llame encontrado para usarla como referencia y otra para almacenar la posición donde está el vehículo

    Imprime un mensaje de resultado de la búsqueda donde informemos si encontramos el auto, en qué posición está o si no lo encontramos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *