Extract the element from one array that is not present in another array

I am attempting to extract the values from arrayOne that do not appear in both groups within arrayTwo. In the example below, I am looking to identify b and d for group1 and a and b for group2.

   arrayOne = ['a','b','c','d']
    
    arrayTwo = [{
        group1:[['a', 4],['c',8]],
        group2:[['c', 7],['d',11]]
    }]

I have experimented with various methods so far, but I am struggling to maintain the correct order. This is my current attempt:

arrayTwo[0].group1.forEach(e => {
        console.log(e)
        arrayOne.forEach(f => {
            if(e[0] != f) {
                console.log(e[0])
            }
        })
    })

Expected outcome

b
d

Answer №1

If you want to find the difference between two arrays in JavaScript, you can use the "difference" calculation method as explained in this Stack Overflow thread.

Here's an example to demonstrate this:

const firstArray = ['a','b','c','d']
    
const secondArray = [{
    group1:[['a', 4],['c',8]],
    group2:[['c', 7],['d',11]]
}]

const differenceForGroup1 = firstArray.filter(item => !secondArray[0].group1.map(pair => pair[0]).includes(item))

document.write(differenceForGroup1)

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using the integrated pipeline mode in IIS is necessary for this operation to be

My aspx page has an ajax call which looks like this: $.ajax({ url: "/SiteAdmin3/UpsIntegration.aspx/addUpdatePackageData", data: JSON.stringify({ '_OrderNumber': $("#txtOrderNumber ...

Is it true that Vue 3 + Inertia automatically removes event listeners upon component unmounting?

There is an event listener set up within the script setup block: <script setup> import {ref} from 'vue' const elementRef = ref(null) window.addEventListener('click', (event) => { if (!elementRef.value.contains(event.t ...

Tips for showing images with the full path URL retrieved from JSON using AngularJS

I am currently working on a project that involves displaying images from a JSON file. The URLs of these images are stored in the JSON file. Currently, my code is only outputting the URLs themselves, which is expected. However, I am looking for a way to act ...

The combination of Heroku (Cedar) with Node, Express, and Jade is causing issues with the client-side javascript files in a subdirectory. While they work fine locally with foreman and

As a newcomer to node and Heroku, I am facing what seems like a simple permission issue. Despite my efforts, I am unable to pinpoint the exact source of the problem. In a sub-directory located one level beneath my root directory where the web.js file is s ...

Is it possible to specify the timing for executing Typescript decorators?

One issue I've encountered is that when I define a parameterized decorator for a method, the decorator runs before the method itself. Ideally, I'd like the decorator to run after the method has been called. function fooDecorator(value: boolean) ...

Quoting Properties in Javascript Objects

If we have the object below: var ObjectName = { propertyOne: 1, propertyTwo: 2 } Do we need to include quotes around the object properties like this? var ObjectName = { 'propertyOne': 1, 'propertyTwo': 2 } Is the sol ...

Turning a string array into a basic array can be achieved through a few simple steps

While I am aware that this question has been posed multiple times, my scenario is slightly unique. Despite exhausting numerous methods, I have yet to discover a suitable workaround. $array = ["9","8","7","6","5"]; //result of javascript JSON.stringify() ...

React element failing to appear on webpage

I'm having trouble loading the snippetInfo.js file in the HTML, and I can't seem to figure out why. I've searched online extensively for solutions, but none of them have worked for me. Whenever I try adding type='text/javascript' t ...

Issue with package: Unable to locate the module specified as './artifacts/index.win32-ia32-msvc.node'

I am encountering an issue while using Parcel for the first time. When I execute npx parcel .\app\index.html, I receive the following error: Error: Module not found './artifacts/index.win32-ia32-msvc.node' Require stack: - C:\Users ...

React does not play well with Bootstrap's JavaScript and may cause it to not function or load properly

Initially, I set up a simple react application by running the command: npx create-react-app appnamehere Following that, I proceeded to install Bootstrap (trying both versions 4 and 5) with the command: npm install bootstrap After this, I included them in ...

Automatic closing of multile- vel dropdowns in Bootstrap is not enabled by default

I have successfully implemented bootstrap multilevel dropdowns. However, I am facing an issue where only one child is displayed at a time. <div class="container"> <div class="dropdown"> <button class="btn btn-default dropdown-to ...

Issue with activation of onClick event in case/switch statement

Currently working on a JavaScript project to recreate the Fallout terminal game, with one of the main aspects being comparing words selected by the user to those chosen by the computer. The concept of this hacking game is reminiscent of the board game Mas ...

The built-in functions of Wordpress are not able to be identified in the ajax PHP file

As a newcomer to Wordpress development, I am facing challenges with implementing ajax on my WordPress site. I am currently working on a plugin that requires the use of ajax. However, my php file (xxxecommerce.ajax.php) is not recognizing the built-in Word ...

Update the page with AJAX-loaded content

I am currently utilizing a .load() script to update the content on a webpage in order to navigate through the site. This is resulting in URLs such as: www.123.com/front/#index www.123.com/front/#about www.123.com/front/#contact However, I am encountering ...

Is there a way to access and parse a CSV file from a URL within a Next.js project?

Currently working on a Next.js application available here. The task at hand requires reading a CSV file from a specific URL within the same repository in multiple instances. Unfortunately, I am encountering difficulties retrieving this data. You can locate ...

Ways to implement variable face sizes in three.js meshes

Recently, I dove into the world of three.js and started playing around with it. I've been pondering whether there's a way to add some randomness to the size of the faces in a mesh created from their existing geometries. While three.js is fantast ...

Preventing AngularJS from Ignoring HTML Elements

Is there a way to calculate HTML content within an AngularJS object (such as {{names}}) that includes an '<a>' element? When I try to display it, the result looks like this: <a href="http://www.example.com">link text</a> I&ap ...

Creating a unique Voronoi Diagram wrap

I am currently working on the creation of a fantasy-style map that is procedurally generated using the cells of a Voronoi diagram to determine different terrains. While working on the tectonic plate generation, I came to the realization that having wrappi ...

How to automatically choose the first option in a v-for loop in Vue.js

I have a loop that creates a dropdown menu from an array: <select class="form-control" v-model="compare_version" > <option v-for="(version, index) in allVersions" v-bind:value="index" v-bind: ...

The conflict arises when importing between baseUrl and node_modules

I am currently working on a TypeScript project with a specific configuration setup. The partial contents of my tsconfig.json file are as follows: { "compilerOptions": { "module": "commonjs", "baseUrl": &quo ...