Adding elements to a multi-dimensional array that match elements from another array

Question

Adding elements to a multi-dimensional array that match elements from another array

I am working with two arrays:

a = [
  [a, b],
  [c, d],
  [e, f],
  [g, h]
]

b = [
  [a, 4],
  [1, 2],
  [e, 3]
]

My challenge lies in updating the elements of array a when they match corresponding elements in array b. Specifically, I need to add a new value to the matched element of a. For example, if a[0][1] matches b[0][1], then a[0][1] should be updated to [a,b,new_value].

If creating a new array with all values of a is necessary, that's acceptable. However, it's crucial that the original values and order of a remain unchanged.

Despite my attempts at utilizing various types of loops, I'm struggling to achieve the desired outcome. Any guidance or solutions provided would be greatly appreciated.

Thank you sincerely.

javascript arrays multidimensional-array matching

Answer 1

Answer №1

Using a map function along with the find method seems to work fairly well when dealing with arrays a and b. The goal is to iterate through each item in array a and check if there is a corresponding element in array b, then add a new value:

const a = [
  ["apple", "banana"],
  ["cat", "dog"],
  ["elephant", "fox"],
  ["goat", "horse"],
];

const b = [
  ["apple", 4],
  [1, 2],
  ["elephant", 3],
];

const mappedArray = a.map(item => {
  const matchingElement = b.find(element => element[0] === item[0]);
  if (matchingElement) return [...item, "new data"] // Update "new data" as needed
  return item;
});

console.log(mappedArray)

Answer 2

Using a map function along with the find method seems to work fairly well when dealing with arrays a and b. The goal is to iterate through each item in array a and check if there is a corresponding element in array b, then add a new value:

const a = [
  ["apple", "banana"],
  ["cat", "dog"],
  ["elephant", "fox"],
  ["goat", "horse"],
];

const b = [
  ["apple", 4],
  [1, 2],
  ["elephant", 3],
];

const mappedArray = a.map(item => {
  const matchingElement = b.find(element => element[0] === item[0]);
  if (matchingElement) return [...item, "new data"] // Update "new data" as needed
  return item;
});

console.log(mappedArray)

Answer 3

Answer №2

Loop through the first array using Array#map. Check if the first element of each sub-array matches the corresponding sub-array in the second array. If there is a match, append a value to the sub-array from the first array using concat and return it. Otherwise, return the sub-array as is.

Note: Using concat and map will create new arrays without modifying the original ones.

var arr1 = [["apple","banana"],["cat","dog"],["elephant","fox"],["giraffe","horse"]];

var arr2 = [["apple",4],[1,2],["elephant",3]];
     
var updatedArr = arr1.map(function(subArr, index) {
  return arr2[index] && subArr[0] === arr2[index][0] ? subArr.concat(arr2[index][1]) : subArr; // Replace arr2[index][1] with any desired value
});

console.log(updatedArr);

Answer 4

Loop through the first array using Array#map. Check if the first element of each sub-array matches the corresponding sub-array in the second array. If there is a match, append a value to the sub-array from the first array using concat and return it. Otherwise, return the sub-array as is.

Note: Using concat and map will create new arrays without modifying the original ones.

var arr1 = [["apple","banana"],["cat","dog"],["elephant","fox"],["giraffe","horse"]];

var arr2 = [["apple",4],[1,2],["elephant",3]];
     
var updatedArr = arr1.map(function(subArr, index) {
  return arr2[index] && subArr[0] === arr2[index][0] ? subArr.concat(arr2[index][1]) : subArr; // Replace arr2[index][1] with any desired value
});

console.log(updatedArr);

Answer 5

Answer №3

To handle arrays of different lengths, one approach is to use a default value when mapping the result of the comparison.

var array1 = [['x', 'y'], ['m', 'n'], ['o', 'p'], ['q', 'r']],
    array2 = [['x', 4], [5, 6], ['o', 3]],
    result = array1.map((arr, index) => arr.concat(arr[0] === (array2[index] || [])[0] ? array2[index][1] : []));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Answer 6

To handle arrays of different lengths, one approach is to use a default value when mapping the result of the comparison.

var array1 = [['x', 'y'], ['m', 'n'], ['o', 'p'], ['q', 'r']],
    array2 = [['x', 4], [5, 6], ['o', 3]],
    result = array1.map((arr, index) => arr.concat(arr[0] === (array2[index] || [])[0] ? array2[index][1] : []));
    
console.log(result);

.as-console-wrapper { max-height: 100% !important; top: 0; }

Adding elements to a multi-dimensional array that match elements from another array

Answer №1

Answer №2

Answer №3

Similar questions

Transform objects into arrays

Implementing conditional rendering using custom division return functions with onClick attribute on a submit button in React: A step-by-step guide

What could be the reason for jQuery not functioning properly as needed?

Troubleshooting: Issues with jQuery Dropdown Menu

Troubleshooting issue with Onchange in select HTML element within Django

Unbounded AngularJS 1.x looping of Ag-grid's server-side row model for retrieving infinite rows

Why is my array.sort statement in ReactJS not functioning properly?

Retrieve the values of the recently selected options in a multiple selection

Messy code appeared when sending an AJAX post to JBoss EAP 7 without using encodeURIComponent

"Embracing AngularJs with the power of SocketIo

What is the best way to alter the header in Django when a user is authenticated?

Animate CSS Grid to dynamically fill the viewport on top of current grid elements

What is the best way to arrange an array of words expressing numerical values?

What is the best way to iterate over each character in a string and trigger a function in JavaScript?

Obtaining a complete element from an array that includes a distinct value

Developing a Javascript object using Typescript

What's the most effective method for looping through a substantial array in order to save data into SQLite using Node.js?

What is the process for displaying HTML page code received from an AJAX response?

I am facing difficulties with deploying my Next.js App on Vercel. Whenever I try to deploy, I encounter an error stating that the Command "npm run build" exited with 1

Error: Invalid parameter detected for Shopify script-tag