Leveraging TypeScript to sort and extract specific elements from two arrays

Question

Leveraging TypeScript to sort and extract specific elements from two arrays

Given two arrays, I am looking to identify the elements in array2 that match elements in array1 based on a specific property.

The arrays are structured as follows:

var array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];


var array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];

I aim to extract the objects from array1 that have matching myId values in array2.

The expected output should be an array like this:

var result = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"}];

I have experimented with filter and include methods but have not been able to achieve the desired outcome yet.

javascript arrays typescript ecmascript-6 filter

Answer 1

Answer №1

If you want to extract all the myId values from array2, and then use those values to filter out elements in array1, you can follow this approach:

const array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];


const array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
const ids = new Set(array2.map(item => item.myId));
const filteredArray1 = array1.filter(item => ids.has(item.myId));
console.log(filteredArray1);

Answer 2

If you want to extract all the myId values from array2, and then use those values to filter out elements in array1, you can follow this approach:

const array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];


const array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
const ids = new Set(array2.map(item => item.myId));
const filteredArray1 = array1.filter(item => ids.has(item.myId));
console.log(filteredArray1);

Answer 3

Answer №2

If you're looking for a way to filter arrays based on certain criteria, there are two approaches you can take depending on your needs.

var array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 2, "text": "c2"}, // not an exact match
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}
 ];


var array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    

let result = array1.filter(a => array2.some(b => a.myId == b.myId))

console.log(result)

If you require an exact match instead:

var array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 2, "text": "c2"}, // exact match
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];


var array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
function filterForId(arr1, arr2) { 
  let filtered = []
  return arr1.filter(a => {
    let found = arr2.find(b => !filtered.includes(b) && a.myId == b.myId);
    if (found) { filtered.push(found); return true; }
    return false;
  });
}

let result = filterForId(array1, array2);

console.log(result)

Answer 4

If you're looking for a way to filter arrays based on certain criteria, there are two approaches you can take depending on your needs.

var array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 2, "text": "c2"}, // not an exact match
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}
 ];


var array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    

let result = array1.filter(a => array2.some(b => a.myId == b.myId))

console.log(result)

If you require an exact match instead:

var array1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 2, "text": "c2"}, // exact match
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];


var array2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
function filterForId(arr1, arr2) { 
  let filtered = []
  return arr1.filter(a => {
    let found = arr2.find(b => !filtered.includes(b) && a.myId == b.myId);
    if (found) { filtered.push(found); return true; }
    return false;
  });
}

let result = filterForId(array1, array2);

console.log(result)

Answer 5

Answer №3

Could this work, even though the performance could potentially be poor?

array1.filter((item) => array2.some((el) => item.myId === el.myId))

Answer 6

Could this work, even though the performance could potentially be poor?

array1.filter((item) => array2.some((el) => item.myId === el.myId))

Answer 7

Answer №4

let data1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];

let data2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
const results = [];

for (const el of data1) {
  const idExistsInData2 = data2.find(a => a.myId === el.myId);
  if (idExistsInData2) {
    results.push(el);
  }
}

console.log(results)

Answer 8

let data1 = [
    {"myId": 1, "text": "a"},
    {"myId": 1, "text": "b"},
    {"myId": 2, "text": "c"},
    {"myId": 3, "text": "d"},
    {"myId": 4, "text": "e"},
    {"myId": 5, "text": "f"}];

let data2 = [
    {"myId": 1, "value": "1x1"},
    {"myId": 1, "value": "2x2"},
    {"myId": 2, "value": "3x3"},
    {"myId": 6, "value": "4x4"},
    {"myId": 7, "value": "5x5"}];
    
const results = [];

for (const el of data1) {
  const idExistsInData2 = data2.find(a => a.myId === el.myId);
  if (idExistsInData2) {
    results.push(el);
  }
}

console.log(results)

Leveraging TypeScript to sort and extract specific elements from two arrays

Answer №1

Answer №2

Answer №3

Answer №4

Similar questions

HTML experiences confusion as JSON tosses undefined data

I'm looking to center the column content vertically - any tips on how to do this using Bootstrap?

The Angular controller failed to return a defined value

Problem with clicking on items in Slick Slider Variable width menu once they reach the end

Transmit information from a bean to JavaScript using JSON in JavaServer Faces

Challenge with Transferring Data to be Displayed

After performing the `ng build --prod` command in Angular 4, deep linking functionality may not

Enhancing a node.js application with express()

Switching between different elements in an array using React

What is the best way to use a button to hide specific divs upon clicking?

NodeJS is constantly refreshing the data in the database table

Jquery is not working as expected

Calculate the total occurrences of events within a Python array

JavaScript enables logging on Android Emulator

Issues with rendering AngularJS onto an HTML page are currently being experienced

The issue arises when Jest fails to align with a custom error type while utilizing dynamic imports

tips for obtaining the highest value among multiple keys within an array

I'm having trouble making a Javascript ajax request to my Web API controller page. It seems like I just can't figure out the correct URL

The term 'sequelize' is missing its definition - it involves Sequelize and consign

Uploading multiple strings to an Amazon S3 bucket using Node.js by piping a string