Interviewing for Front-End Engineers

Removing Duplicate Strings Solution

Jem Young

Jem Young

Interviewing for Front-End Engineers

Check out a free preview of the full Interviewing for Front-End Engineers course

The "Removing Duplicate Strings Solution" Lesson is part of the full, Interviewing for Front-End Engineers course featured in this preview video. Here's what you'd learn in this lesson:

Jem live codes the solution to the removing duplicate strings exercise while walking through some other possible avenues.


Transcript from the "Removing Duplicate Strings Solution" Lesson

>> Removing duplicate from a string is the functional equivalent of moving duplicate from an array. Because we learned in the previous example, how we can convert anything into the array. So I'm gonna start with, I need a function that takes a string so called removeDuplicates (str) and it take string here and it takes a string, and it's going to return some new string.

One approach this problem would be to take the string, convert it into an array, create a new array. And then every time you run into something that you haven't run into before, you just push that new array. So if we're gonna walk through this mentally, I mean this, I haven't seen this because my array is empty at this point.

I'm gonna push this to the new array and I'm gonna say every single time on that loop, I'm just iterating over this array, I can say does the new array.includes or indexOf? I know, it's thinking like how can I iterate over the array? If you did it kind of with a double four loop as in keeping the array, that's fine, it's a solution.

It's not optimal but it's a solution and when you think about array.includes is technically sort of doing the same thing. It's just doing it behind the scenes but it's much faster so that's one solution and that would work. The same thing would work for number strings or anything, I'm gonna take advantage of modern JavaScripts and use a different data structure.

And this was kind of I won't say a trick because any other solution will work iterating use the four loop, this way is a little bit more efficient. So first thing I'm gonna do is I'm gonna create an array for my string, so I'm gonna say, string.splits. So I'm going to get a new array of every string, I'm gonna say, doing this long hand.

I'm gonna use a set rule, what does a set do in JavaScript? Yes.
>> It's like an array but cannot have duplicate.
>> Yes, set is a data structure in JavaScript that can not have duplicate items so I can say new set And then, I'm gonna pass in my array.

I think you could actually pass in a string into a set, it might decide actually work, I haven't tried that yet. But just to be safe, we have a set and then, I'm gonna take the set, and I'm gonna call create a new string. So I'm gonna say newString is, I need to convert my set back into an array so I can use an array.from or I'm gonna use a spread operator because it's fancier.

So that's gonna take that set which now has all duplicates removed, converted back to array. Now I need to convert it back into a string so I'm gonna say string.join. Thank you VS code for helping me there. And there you have a function that takes an array and removes all the duplicates.

So if you use the four loop and use the additional array, that's fine too, that is a perfectly good solution. The set is a little bit fancier, I could actually probably do this all in one line if I really wanted to, but I I'm not doing it for the sake of being too complicated.

So that wasn't too bad and hopefully now we're building up to I can convert anything into Ray and then do whatever I want once it's converted to a different data structure. This is also good question for if you know your data structures, it will help you don't have to, you don't have to memorize what maps and sets and weak maps are and things like that.

But it's helpful for questions like these. But a general gem tip, if there's something saying unique values use a set, it does all the work for you.

Learn Straight from the Experts Who Shape the Modern Web

  • In-depth Courses
  • Industry Leading Experts
  • Learning Paths
  • Live Interactive Workshops
Get Unlimited Access Now