How to get the elements of one array which are not present in another array using JavaScript? - GeeksforGeeks

12 Sep, 2019
The task is to get the elements of the one array which are not present in the another array. Here we are going to use JavaScript to achieve the goal. Here are few techniques discussed.Approach
Take the arrays in variables.
Use the .filter() method on the first array and check if the elements of first array are not present in the second array, Include those elements in the output.
Example 1: This example using the approach discussed above.
<!DOCTYPE HTML><html>  <head>    <title>        How to get the elements of one array which       are not present in another array using JavaScript?    </title></head>  <body style="text-align:center;" id="body">    <h1 id="h1" style="color:green;">              GeeksForGeeks          </h1>    <p id="GFG_UP"        style="font-size: 15px;               font-weight: bold;">    </p>    <button onclick="gfg_Run()">        Click here    </button>    <p id="GFG_DOWN"        style="font-size: 23px;              font-weight: bold;              color: green; ">    </p>    <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var ar1 = [1, 2, 3, 4];        var ar2 = [2, 4];        el_up.innerHTML =           "Click on the button to remove the element of "+          "second from the first array.<br><br> firstArray - " +           ar1 + "<br>secondArray - " + ar2;          function gfg_Run() {            var elmts = ar1.filter(                function(i) {                    return this.indexOf(i) < 0;                },                ar2            );            el_down.innerHTML = elmts;        }    </script></body>  </html>
Output:
Before clicking on the button:
After clicking on the button:
Example 2: This example using the same approach but different methods of javaScript.
<!DOCTYPE HTML><html>  <head>    <title>        How to get the elements of one array       which are not present in another array using JavaScript?    </title></head>  <body style="text-align:center;" id="body">    <h1 id="h1" style="color:green;">              GeeksForGeeks          </h1>    <p id="GFG_UP" style="font-size: 15px; font-weight: bold;">    </p>    <button onclick="gfg_Run()">        Click here    </button>    <p id="GFG_DOWN"        style="font-size: 23px;              font-weight: bold;              color: green; ">    </p>    <script>        var el_up = document.getElementById("GFG_UP");        var el_down = document.getElementById("GFG_DOWN");        var ar1 = [1, 2, 3, 4];        var ar2 = [2, 4];        el_up.innerHTML =           "Click on the button to remove the element of second"+          " from the first array.<br><br> firstArray - "         + ar1 + "<br>secondArray - " + ar2;          function gfg_Run() {            var elmts = ar1.filter(f => !ar2.includes(f));            el_down.innerHTML = elmts;        }    </script></body>  </html>
Output:
Before clicking on the button:
After clicking on the button:
JavaScript-Misc
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Remove elements from a JavaScript Array
Difference between var, let and const keywords in JavaScript
Difference Between PUT and PATCH Request
JavaScript | Promises
How to get character array from string in JavaScript?
Remove elements from a JavaScript Array
Installation of Node.js on Linux
How to fetch data from an API in ReactJS ?
How to insert spaces/tabs in text using HTML/CSS?
Difference between var, let and const keywords in JavaScript