¿Encuentra los elementos comunes de más de dos arrays de JavaScript?

Dado un documento HTML que tiene varias arrays con algunos elementos, la tarea es obtener los elementos comunes de las arrays con la ayuda de JavaScript. Hay dos enfoques que se analizan a continuación.

Enfoque 1: primero obtenga las arrays en formato bidimensional, luego tome la primera array con el método shift() y luego filtre los elementos de la primera array que son comunes en todos utilizando el método filter() . Los elementos que son comunes en todas las arrays se pueden verificar con el método every() y si el elemento de la primera array coincide con todos los elementos, se devuelve ese elemento.

Ejemplo:

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Finding matches between more than
        2 JavaScript arrays
    </title>
    <style>
        body {
            text-align:center;
        }
        h1 {
            color: green;
        }
        #geeks {
            font-size: 16px; 
            font-weight: bold;
        }
          
        #gfg {
            color: green; 
            font-size: 18px; 
            font-weight: bold;
        }
    </style>
</head>
  
<body style="">
    <h1 > 
            GeeksforGeeks 
        </h1>
    <p id="geeks">
    </p>
    <button onClick="GFG_Fun()">
        click here
    </button>
    <p id="gfg" >
    </p>
    <script>
        var up = document.getElementById('geeks');
        var down = document.getElementById('gfg');
        var arr1 = [1, 3, 5, 7, 9];
        var arr2 = [1, 2, 4, 5, 7];
        var arr3 = [1, 2, 5, 7, 8];
        var arr = [arr1, arr2, arr3];
        up.innerHTML =
            "Click on button to get the common elements from these"+
            " array<br>Array1 - [" + arr1 + "]<br>Array2 -"+
            " [" + arr2 + "]<br>Array3 - [" + arr3 + "]";
  
        function GFG_Fun() {
            arr4 = arr.slice();
            down.innerHTML = arr4.shift().filter(function(v) {
                return arr4.every(function(a) {
                    return a.indexOf(v) !== -1;
                });
            });
        }
    </script>
</body>
  
</html>

Producción:

Enfoque 2: primero obtenga las arrays en formato bidimensional y luego use el método reduce() para obtener acceso a todas las arrays una por una. variable(p) contiene cada arreglo uno por uno y devuelve solo los elementos del arreglo que están en el arreglo variable(c) usando el método filter() . Al final, la variable (c) contiene la array de elementos comunes.

Ejemplo:

<!DOCTYPE HTML>
<html>
  
<head>
    <title>
        Finding matches between more than
        2 JavaScript arrays
    </title>
    <style>
        body {
            text-align:center;
        }
        h1 {
            color: green;
        }
        #geeks {
            font-size: 16px; 
            font-weight: bold;
        }
          
        #gfg {
            color: green; 
            font-size: 18px; 
            font-weight: bold;
        }
    </style>
</head>
  
<body style="">
    <h1 > 
     GeeksforGeeks 
    </h1>
    <p id="geeks">
    </p>
    <button onClick="GFG_Fun()">
        click here
    </button>
    <p id="gfg" >
    </p>
    <script>
        var up = document.getElementById('geeks');
        var down = document.getElementById('gfg');
        var arr1 = [1, 3, 5, 7, 9];
        var arr2 = [1, 2, 4, 5, 7];
        var arr3 = [1, 2, 5, 7, 8];
        var arr = [arr1, arr2, arr3];
        up.innerHTML =
            "Click on button to get the common elements from these"+
            " array<br>Array1 - [" + arr1 + "]<br>Array2 -"+
            " [" + arr2 + "]<br>Array3 - [" + arr3 + "]";
  
        function GFG_Fun() {
            down.innerHTML = arr.reduce((p, c) =>
            p.filter(e => c.includes(e)));
        }
    </script>
</body>
  
</html>

Producción:

Publicación traducida automáticamente

Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta Cancelar la respuesta