Start learning free

LESSON 151 OF 410 · LOOPING OVER ARRAY INDICES

Get Full Names in JavaScript (Time Complexity: O(n))

Practice Read the full explanation

Given two arrays of strings, the first names and the last names (given in this order, called firstNames and lastNames in the example), return an array containing the full names (separated by one space)

Example:

Input:   firstNames = ["John","Andy","Mary"]
         lastNames = ["Doe","Smith","Johnson"]

Output:  ["John Doe", "Andy Smith", "Mary Johnson"]
STEP 1 OF 5
    Ctrl + Enter to check

    JAVASCRIPT · LOOPING OVER ARRAY INDICES

    Get Full Names in JavaScript, explained

    Understanding the Problem

    The core challenge of this problem is to combine two arrays of strings into a single array of full names. This is a common task in data processing where you might have separate fields for first and last names and need to combine them for display or further processing.

    Potential pitfalls include ensuring that both arrays are of the same length and handling any empty strings or null values gracefully.

    Approach

    To solve this problem, we can use a simple loop to iterate through both arrays simultaneously and concatenate the corresponding elements. This approach ensures that we maintain the order of names and efficiently combine them.

    Let's discuss a naive solution and then an optimized one:

    Naive Solution

    A naive solution would involve iterating through the arrays using a for loop and concatenating the strings. This approach is straightforward but can be improved in terms of readability and efficiency.

    Optimized Solution

    An optimized solution would use the map function, which is more concise and leverages JavaScript's functional programming capabilities. The map function allows us to apply a function to each element of the array, making the code cleaner and more readable.

    Algorithm

    Here is a step-by-step breakdown of the optimized algorithm:

    1. Check if the lengths of firstNames and lastNames are the same. If not, return an error or handle it appropriately.
    2. Use the map function to iterate through the firstNames array.
    3. For each element in firstNames, concatenate it with the corresponding element in lastNames using a space.
    4. Return the resulting array of full names.

    Code Implementation

    // Function to get full names from first and last names arrays
    function getFullNames(firstNames, lastNames) {
        // Check if both arrays have the same length
        if (firstNames.length !== lastNames.length) {
            throw new Error("Both arrays must have the same length");
        }
    
        // Use map to combine first and last names
        return firstNames.map((firstName, index) => {
            return firstName + " " + lastNames[index];
        });
    }
    
    // Example usage
    const firstNames = ["John", "Andy", "Mary"];
    const lastNames = ["Doe", "Smith", "Johnson"];
    console.log(getFullNames(firstNames, lastNames)); // Output: ["John Doe", "Andy Smith", "Mary Johnson"]
    

    Complexity Analysis

    The time complexity of this solution is O(n), where n is the length of the arrays. This is because we are iterating through the arrays once. The space complexity is also O(n) due to the creation of a new array to store the full names.

    Edge Cases

    Potential edge cases include:

    • Arrays of different lengths: The function should handle this by throwing an error.
    • Empty strings: The function should still concatenate them correctly.
    • Null or undefined values: These should be handled gracefully, possibly by filtering them out or replacing them with a default value.

    Testing

    To test the solution comprehensively, consider the following test cases:

    • Standard case with matching arrays.
    • Arrays of different lengths (should throw an error).
    • Arrays with empty strings.
    • Arrays with null or undefined values.

    Using a testing framework like Jest can help automate these tests.

    Thinking and Problem-Solving Tips

    When approaching such problems, it's essential to:

    • Understand the problem requirements and constraints thoroughly.
    • Start with a simple solution and then optimize it.
    • Consider edge cases and how to handle them.
    • Write clean, readable code with comments explaining your logic.

    Conclusion

    In this blog post, we discussed how to combine two arrays of strings into a single array of full names. We explored both naive and optimized solutions, provided a detailed algorithm, and implemented the solution in JavaScript. Understanding and solving such problems is crucial for data processing tasks and helps improve problem-solving skills.

    Additional Resources

    For further reading and practice, consider the following resources:

    Keep going with JavaScriptAbout 340 step-by-step lessons, from your first line of code to coding interviews. Free to start.
    Start learning free