Sorted Union - JavaScript Solution & Walkthrough

10/21 Sorted Union

Write a function that takes two or more arrays and returns a new array of unique values in the order of the original provided arrays.

In other words, all values present from all arrays should be included in their original order, but with no duplicates in the final array.

The unique numbers should be sorted by their original order, but the final array should not be sorted in numerical order.

Check the assertion tests for examples.

Assertion Tests

uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]) should return [1, 3, 2, 5, 4].

uniteUnique([1, 2, 3], [5, 2, 1]) should return [1, 2, 3, 5]

uniteUnique([1, 3, 2], [5, 4], [5, 6]) should return [1, 3, 2, 5, 4, 6]

function uniteUnique(arr) {

  return arr;
}

uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]);

Credit: FreeCodeCamp.org

Understanding the Challenge

Let's breakdown this Sorted Union challenge. The function we will be working on takes two or more arrays as arguments. Each of these arrays contain some numbers. The challenge is to complete the function such that it returns just one finalArray containing all the numbers in the arguments arrays. However, this finalArray has two features we need to take note of.

The first feature is that the numbers in finalArray should appear in the same order as they appear in the arguments arrays.

And the second feature is that there should be no duplicates. In other words, no number should appear more than once in finalArray.

We are encouraged to check the tests for examples to get a better understanding. For example, if the first test case, our function as the following arrays as arguments

([1, 3, 2] [5, 2, 1, 4] [2, 1])

From these arguments, the function returns

[1, 3, 2, 5, 4].

Note how the appearance of the numbers in finalArray is in the same order as that of the arguments. There's 1, followed by 3, 2, 5. The next numbers 2 and 1 are not included because there's already an instance of both 1 and 2 in the finalArray. Therefore, we skip them and move to 4.

Okay, now let's write some pseudocode.

Pseudocode

Given a numbers arrays,
  Collate all the given arrays in one big array
  Now, we have one big array, with given arrays as sub-arrays
  Create a variable finalArray with initial value as empty array
  Loop through the sub-arrays in the big array
  For each iteration 
  check if number is present in finalArray
    if number is not already present
    push number into the finalArray
Return finalArray after at the end of the loop

Solving the Challenge

First, let's get all the arrays given as arguments. To do that, we'll use the arguments object. Let's call them originalArrays.

let originalArrays = Object.values(arguments);

Next, Let's declare a variable finalArray. We would set the initial value as an empty array.

let finalArray = [];

Now, we will apply the .forEach() method on our originalArray. That way, we can get access to each of the sub-arrays. And then we will aslo apply the .forEach() method on each of the sub-arrays. This will help us get access to numbers contained in each array.

originalArrays.forEach(subArray => {
  subArray.forEach(number => {
    if (!finalArray.includes(number)) {
      finalArray.push(number);
    }
  });
});

Once, we have access to the numbers, then for each number, we will check if that number is already included in the finalArray. If it is not included, then we push it into finalArray. This means that if a number is already included in finalArray, it will not be pushed. This is what will help us ensure that there no duplicate numbers.

Now, all that's left to be done is to return finalArray.

return finalArray

Our function is now complete!

Final Solution

function uniteUnique(arr) {
  const originalArrays = Object.values(arguments);

  let finalArray = [];

  originalArrays.forEach(subArray => {
    subArray.forEach(number => {
      if (!finalArray.includes(number)) {
        finalArray.push(number);
      }
    });
  });

  return finalArray; 
}

uniteUnique([1, 3, 2], [5, 2, 1, 4], [2, 1]);
// [ 1, 3, 2, 5, 4 ]

Congratulations!

You just cracked the tenth challenge in this series.

Cheers and happy coding!