Flatten Error Constraints
Recursively flatten properties in an array of objects.
— By Yasin
So, last week I solved an easy problem yet a fascinating one in its own way. Uses of it applied in the world of frontend programming, and knowing how to solve such problems is quite valuable down the road when doing HTML Form validation and processing-related tasks.
The challenge statement is: given an array of error objects, we need to flatten its property constraints and transform them to a string array with the accurate property depth.
In a nutshell, this is what we need to solve: -
And transform the above errors to this: -
TypeScript to write our solution in the upcoming sections.
Well, it seems like a piece of cake, right? We can solve this quickly if we take a minute or two to understand its schematic structure correctly.
And if we transform this into more approachable static sorts we would get the following types.
Looking at the challenge statement example, we can see that not all Error objects contain
children property. Hence, we should understand that one or more depths will have zero
children to flatten. Therefore, we can safely ignore such results from
the transformed object.
We can break down the problem into multiple direction points to further simplify our approach. From my interpretation, we have four main tasks to focus on; and those are: -
- Extract the string values from the
- Concatenate the children's
propertypath along with depth.
- Go through all the
constraintsto the path (if there are any).
So how can we crack this?
We have to use either an iterative or a recursive to solve this problem. First, we can directly jump in and focus on the 1st direction point, extracting the values from the constraints object.
We can write a helper function that accepts a given
constraints object and return its
Then we can focus on 2nd direction point, concatenating the children's property path along with depth.
Then the 3rd direction, going through all the
children errors. But before that, we need another
top-level helper function to compose the algorithm.
I will name it
transformError with two parameters in place. The first parameter is an individual
error itself and the second is our transformation result object.
Then we should first see whether there are any
children available in this error object because
remember, it can be optional.
So now, if the error has children then we should go through its
children to recursively
extract all their
This is great! Now that we are only left with the 4th Direction, and we can
easily append the
extractConstaints at last .
We consolidate the last three points into a single function called
transformError because they are recurring
tasks. By doing this, we should be able to iterate through all the errors and recurse all
the children accurately.
And finally, putting it all together, we get this: -
formatErrors function is the starting point of our algorithm. We iterate through all the
errors we get as the input and calls the
transformError with the
result instance to hold the
The analysis of the time complexities of this algorithm is quite straightforward. Since we use a recursive approach we can directly apply the master theorem to get the asymptotic estimates.
Well, that's it folks! Thanks for reading.