How To Implement Linked Lists With Test Driven Development In JavaScript

Подписаться 1,6 млн

Просмотров 67 тыс.

50% 1

Linked lists are one of the most popular data structures interviewers ask about in technical interviews. You will probably never have to implement one in a real day to day job, but knowing how to write a linked list and understanding how they work is crucial to passing a technical interview.
On top of covering linked lists in this video, I will also be covering how you can use test driven development to make writing code easier. We will be designing the entirety of the linked list with test driven development to show you how to write better tests.
📚 Materials/References:
GitHub Code: github.com/WebDevSimplified/L...
Jest Tutorial: • Introduction To Testin...
🧠 Concepts Covered:
- How to do test driven development
- What a linked list is
- How to create a linked list
- How to write proper tests
🌎 Find Me Here:
My Blog: blog.webdevsimplified.com
My Courses: courses.webdevsimplified.com
Patreon: / webdevsimplified
Twitter: / devsimplified
Discord: / discord
GitHub: github.com/WebDevSimplified
CodePen: codepen.io/WebDevSimplified
#LinkedList #WDS #JavaScript

Опубликовано:

21 авг 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 133

@jenso413 2 года назад

you have a real gift man, it's crazy how you're able to make something as boring as test driven development and linked lists actually somewhat interesting and easy to follow

@IshanKesharwani 3 года назад

Liked the video first because KYLE does an amazing job everytime.

@____prajwal____ 3 года назад

Please make an entire playlist on javascript data structures.

@mattoattacko 3 года назад

I agree with Captain Parjwal! I'll give you my firstborn in exchange for DS&A whiteboarding in JS

@kevinfriedman6766 3 года назад

Agreed!!

@RyanJohnson 3 года назад

"Seconded" - Scruffy

@ayabc4320 3 года назад

@gustavokeegan961 3 года назад

@Hassan Roland yea, have been watching on flixzone} for months myself :)

@kristiannn 2 года назад

0:43 - start 2:12 - Doubly Linked List 3:12 - why would we use a linked list? 4:48 - implementing a linked list. 4:56 - installing dependencies 6:25 - starting to code 6:29 - linkedlist class 7:34 - node 8:30 - insertAtHead method 8:26 - creating the first method that will allow to add elements/nodes to the linkedlist 10:05 - instantiating a new linkedlist 12:11 - writing first test

@DannySingerMusic 3 года назад

You're so consistently thorough and generous with the information you share in each of your videos. Thank you so much.

@devchamber6000 3 года назад

Great tutorial! One hint to take small step further and make it complete: Coverage report says that lines 49-55 are not covered. This is the print method. We can simply return the output and test if it contains an inserted value. For example expect(output).toContain('10');. Then we will have 100% green as what uncle Bob recommends ;).

@carlthegnarl 3 года назад

I really dig these fundamental programming tutorials! Your removeHead function does not account for cases of an empty LinkedList. A case that you also missed in your test which again shows how important it is to think of any possible case.

@nsharma4981 3 года назад

You never disappoint! Thank you for clearly explaining so much in 40 mins. It helped me revise linked lists and more importantly I learned so much about test driven development.

@romanazeem3098 3 года назад

After simplifying all the web for us without any cost now you are helping us with interviews.. hats off💓

@NoBrainerLanguages 3 года назад

Great explanation. I remember creating linked lists in the ol' good C++, but that was my biggest struggle. My approach to the concept was trying to compare it to the SQL database where you can remove values without losing the slot it was once stored (the line in the database for that matter). I've never really known whether SQL used empty indexes in disguise, but I don't think so.

@k-universe0022 4 месяца назад

you are best teacher everrrrr , as a beginner programmer this channel really helped me thanks ✨

@saddamshah5964 3 года назад

Great Work Man, Special the Node class I really like the way you created node class, just by adding the next value in the second parameter, it eventually reduce the code for another methods. Thank You so much.

@honeypot11 2 года назад

so happy i finally get to see test driven development in action! thanks for this

@AranFatih 2 года назад

same, tho I still don't understand why just not console.log lol

@OMorningStar 3 года назад

13s into the video: excited. Thank you. 😊

@akshaynair3787 3 года назад

Real nice video man, Thanks for simplifying linked list ....

@nicbongo 3 года назад

Fantastic video Kyle. It was great to see test drive development with this, very intuitive. I'll be doing that exercise myself! Need those reps 👍 Only feedback I'd suggest is to mention how data in LL are stored in memory vs arrays, even just a link to a resource could be useful. Fantastic demo though, thanks!

@amrit2057 Год назад

I watched several videos on linked list and this is the best of all. this video really helped understand linked list and well explained. Good job man keep it up.

@mlntdtechbae Год назад

This is great. You explain these concepts very well, thank you!!

@cmdv42 Год назад

Awesome! Would love to see more videos related to data structures/algorithms💯💯💯 I'm loving your JavaScript Simplified course! Another one for solving code problems, recognizing patterns, etc would be amazing to learn from your teaching style. 🙌💻🙏🚀

@myiOSCareer 3 года назад

Awesome video! You make it super easy to understand.

@jiandeng8595 3 года назад

thanks, kyle, test driving did save my time

@rachada2532 3 года назад

This is really good. Thank you so much!

@piotrzielinski146 3 года назад

Hi Kyle! Interesting video like always. One thing, I've noticed is the line `LinkedList.js#44` (`prev.next = prev.next.next`). You expect the `prev.next` (node at the current index) to always exist. The reason, why the particular test passes is the line `LinkedList.test.js#116`, where You forgot to change the argument of `ll.removeAtIndex(-1)` to, for instance "2".

@WebDevSimplified 3 года назад

Good catch!

@av03 3 года назад

Another helpful content, thanks Kyle.

@biliyonnet 3 года назад

Tip! You can create another shadow list or array for mapping index numbers and reference original list items to them and you can use that map to avoid loops against the list.

@PardoLiat Год назад

Great video and great explanations! Thank you.

@AnkitVerma-yn3ku 3 года назад

Very nice please make a series of interview based problems on JavaScript loved this one!

@PrimephotoStudio 3 года назад

Thank you for sharing this video with us, very helpful.

@degitalweb 2 года назад

Thank you kyle for making algorithms videos thats what we want.

@user-nl8wi2cg9x 5 месяцев назад

Wonderful stuff, thanks a lot.

@Rahul-ps9jw 2 года назад

You Are a Wonderful Trainer

@dinner4chiahao 2 года назад

Incredible tutorial.

@xRichhhx 3 года назад

Man some of these comments look like bots lol. Anyway, here is a genuine comment just passing through. I thank you a lot for explaining Linked Lists. I never did get why you would even use this over array methods and thought it was a strange question for job interviews. I'm still not sure how often this will be used in a day to day job for a Jr. Web Dev role but atleast I understand some of it!

@WebDevSimplified 3 года назад

It isn't really something you will use often if at all, but in many languages the default implementation for lists is a linked list.

@elton-react-dev Год назад

Amazing video!!! 👏🏼🙏🏼

@sarahmayfield5135 3 года назад

There is a concept I don't understand. So we don't use insertAtHead in the get by index test because you don't want to use other methods from the same class in that test. Then we make the fromValues function that uses the InsertAtHead function inside of it. Why is that different? I love the video by the way!

@WebDevSimplified 3 года назад

I realizes after I recorded that I did that and there really is no difference. It isn't ideal but in general it isn't a problem for this example

@sarahmayfield5135 3 года назад

@@WebDevSimplified OK No Worries. I thought maybe there was something I was missing.

@TheDopoqob 3 года назад

17:50 If the point of the helperfunction was to test method#getByIndex without relying on the method#insertAtHead working then why does the helper-function USE the method#insertAtHead?

@sohanpaliyal813 Год назад

hello from india , we need more videos on dsa and btw great job 😉

@adicide9070 3 года назад

Also worth mentioning, perhaps, is the fact that the 'get by index' method returns not a value in the list, but the node. I think it should return the value, and the nodes themselves ought to be encapsulated in the list. But then it'd be harder to use 'get by index' in the other methods on the list, such as 'insert at index'. It'd be interesting to see how once could do that :)

@AleksandarIvanov69 3 года назад

I would've loved to see a couple of usecases for this linked list and vs array. Abstractions are great, but I am dumb and learn better through context.

@abhishekarora7239 2 года назад

Really nice coverage of test cases. Thanks it helped a lot. Also, I think we missed one test case here when list will be empty and removeAtHead will be called.

@bonaventureokoli7988 3 года назад

Thank you Kyle

@FahadAli-ot5kn 3 года назад

Please make part 2 i need this ...

@rudestewing 3 года назад

thank you so much

@sogggy 3 года назад

More data structure videos. thanks

@leoluo0414 3 года назад

Great content as always plus the most beautiful hair in tech industry

@hari9321 2 года назад

Please make more videos on data-structures

@random-nekato Год назад

Very good

@astrix8812 2 года назад

Pro af!

@DarylJewkes 3 года назад

Awesome vid

@sd5919 Год назад

Good tutorial. I avoid following tutorials 99% of the time but I make exceptions when it comes to stuff like this. Figuring this out on my own would be torture.

@adip9213 3 года назад

Please make some videos on event loop, javascript engine architecture etc.

@enyacat7 2 года назад

I just started coding a few month ago and came across a question on hacker rank on linked list...and started searching for videos...saw a familiar face and it is like OMG even Kyle had to make a 39 min video on it, this linked list business must be really hard😂.

@biharitravelgirl 3 года назад

Hi , Can you please drop any hint when you are coming with next video on dataStructure ? Eagerly waiting

@jloiterer 2 года назад

It's funny that at around 22:42 when you said the tests *should* pass you were looking very closely at the terminal. It's always like a *gulp* I hope every passes - at least when I'm writing the code.

@roast-salamander 2 года назад

20:45, Kyle just said list-linked

@janpawedwa4590 3 года назад

Kyle, I have bunch of data structure code files I wrote myself (so I can better understand the concepts), like linked lists, heaps, bst etc. Do you think I should add that to my github account that I attach to my junior dev job application? Or is that too basic for any employer to care about and I would make fool of myself? It is decent code, with like error handling and edge cases taken into consideration, but still.

@tannerbarcelos6880 3 года назад

Any content to help your resume is better than none. There’s no harm. However, employers want to see if a) you’re a computer science major or b) have projects to support your self teaching to see if you’re good enough for them to reach out That repo is good, but anyone can copy data structures from their textbook. It doesn’t prove you know anything more than potentially that. So I’d say , yes, add the link BUT start doing projects as well. That separates you from the pack. The project can be simple or a big complex or if you’re really good, very complex. You got this!

@janpawedwa4590 3 года назад

@@tannerbarcelos6880 Oh yea, sure. I already have a portfolio website, and I am in the middle of creating a MERN stack website. I know that project are essential for people without CS degree. Just wanted to know if I wasn't shooting myself in the knee by adding that link with a bunch of little snippets. Thanks for your input man, I really apreciate that!

@arashaadd 3 года назад

You are amazing bro, you've helped me and many other so much! I'd probably kiss u if I saw u 🤣

@hectorkaizenf.v.7224 3 года назад

Hello Kyle. Can you make a boilerplate video? Please.

@usama57926 3 года назад

Can you make a short tutorial on *docker*

@singamsettyrupeshkumar8746 3 года назад

Need one video on how to write test cases for classes in java much needed please make it Kyle 😌🤒

@amitthakur5880 3 года назад

First viewer of your videos always

@vossert 3 года назад

Kyle, thank you for all the effort and work you put into this! It already helped me a lot in becoming a better developer. I did code along with this tutorial and came across a failed test while yours were passing. For the removeAtIndex (as well as the insertAtIndex) for the case ''with index greater than list lengthprev.next = prev.next.next' because, of course , the previous node does exists it simply does not have a next. I was able to solve this, and include an extra test as well, but I did want to give you a heads up here.

@jiandeng8595 3 года назад

another way of implementing LinkedList is to construct a `tail` prop instead of `length`, change the ref of the `tail` is the optional way of tracking the length,

@29rohitkumar01 3 года назад

If you can make A whole series on ds using js, it would be great

@aninehartog3950 2 года назад

Great tutorial!

@CourtneyShane 3 года назад

I followed the entire time through twice and at about the halfway point both times, I could not get the tests to work; it seems to be mad at describe wrapped up in a describe. Says expected a string but received a function as my error. Could it be I now have an updated version of jest?

@TheGiantHog 3 года назад

Wouldn’t the “fromValues” test break if “insertAtHead” is broken? So I don’t know why writing it was beneficial. Also later using “getByIndex” in the “insertAtIndex” confused me for similar reasons

@joeblow8394 3 года назад

I believe if you are using methods that are already tested (aka above the one you are currently testing), its considered "ok". At least thats what we did in class

@BloodyScythe666 3 года назад

yeah I was a bit confused about that as well. since he said "using other methods in tests is bad" while a minute later he just extracted the bad behaviour in a separate helper method

@vuchke 3 года назад

What kind of sorcery is this???? And when it is used?

@BabarAli-yb1eg 3 года назад

In 14:00 when you declared LL as a const value , how were you able to update the constant value ? Please elaborate anyone

@Lokus122 3 года назад

Can't find nice words for that, but maybe will help... What const does is freezing object, so u cant overwrite, but what he is doing is only changing property of this object. Reference to this object is unchanged

@mauroneagoe488 3 года назад

Nowadays you can use spread syntax with arrays to easily add an element at the beginning without the need of doing eny extra work, e.g.: let arr = [3, 4, 5]; console.log(arr); // [3, 4, 5] console.log(arr[0]); // 3 // Now we add 2 at the beginnig of the array: arr = [2, ...arr]; console.log(arr); // [2, 3, 4, 5] console.log(arr[0]); // 2

@nsharma4981 3 года назад

But lots of computing power is still used, unlike in linked list. A completely new array is created in memory then assigned to the old variable, while in a linked list just a new node is added to memory. Spread looks easy but there's a lot going on in the background.

@adicide9070 3 года назад

Hey, so you say that in a test we should not use functions/methods we're testing elsewhere, since if they don't work, or stop working, or are otherwise not tested (they're being tested alongside the current one), they might falsify the results of the current test. But you do use such methods that way. But even in the 'from values' method you use 'insert at head' and then you use 'from values' in a bunch of tests. Not sure how we could go about not doing it. Thanks for the vid, tho!

@mjaathik 3 года назад

Please do a live session

@sichoi7718 3 года назад

Hi Kyle! I'm following along your codes. I'm learning a lot from it too, practicing Jest and implementing linked list.. So I wanted to ask you for a permission to write a TIL on my blog based on your codes and learning materials on this video. I'm not going to make any profit on this blog and I'll mention your link. Also, it's going to be written in Korean. So I think it could be a great opportunity for me to share your awesome channel to forks living in Korea

@xVinoz 2 года назад

u dont need to ask for permittion my g. Common lol

@SALMANKHAN-zz4gi 3 года назад

kyle on one side you make videos roasting coding interviews and on the other side you make this premium coding interview tutorial . Which side are you on ?

@janpawedwa4590 3 года назад

On the side of somebody who has to go to those interviews to find a job

@nsharma4981 3 года назад

I don't think it was actually roasting. He provided constructive criticism and suggestions, which was pretty unbiased in my view. As for linked list, it's common in interviews so this video is very helpful for many

@SALMANKHAN-zz4gi 3 года назад

@@janpawedwa4590 sad reality

@SALMANKHAN-zz4gi 3 года назад

@@nsharma4981 call it whatver you want to, roasting or constructive criticism its the same . He was against it , never suggested ways to make ds algo interviews better . Instead he suggested companies to conduct interviews on Real Working Projects . Coming to to your last point , i never said this is not a common interview question or not helpful to others . FYI i already mentioned premium coding tutorial meaning how great the content is actually .

@nsharma4981 3 года назад

@@SALMANKHAN-zz4gi Yeah I just meant there's no need to take any sides

@BloodyScythe666 3 года назад

35:09 you forgot to change ll.removeAtIndex(-1) to be an index greater than the list's length so this is an incorrect test. also i feel like around where you started writing the remove tests and logic, you started to rush which made you do some errors, but what's way more important for the video, it got harder to follow along. maybe try taking breaks in between or consistently remind you to slow down so the video becomes followable throughout.

@infinteuniverse 3 года назад

Maybe for removeHead() make it so that it won't try to access this.head.next of null. Perhaps adding a single line of if(this.length < 0) return;

@FlowerBot 3 года назад

by the way # is not known as the pound symbol outside of the US, the pound symbol is something else to the rest of us

@romuloalves9349 3 года назад

Ótimo vídeo parabéns 👏.

@connorbailey308 3 года назад

The only testing I've ever done is JUnit testing with Java, and this testing library seemed way more fun. JUnit testing is dry and boring. Although everything in JS is more 'fun' and 'pretty' than Java, I just figured that testing in general was boring. JS always surprises, especially with the huge swath of libraries available. With Java theirs only a few acceptable testing libraries and they are all ugly and complicated.

@fahadzakir6397 2 года назад

2nd problem on leet code led me to this

@8xnnr Год назад

I got a cake today at Walmart at 6 in the morning. It was about 35f but you know sometimes you have to get your cake. Oh I also saw some chicken out and I grabbed a chicken sandwich.

@helidrones 2 года назад

Linked Lists - This sounds to me like fragmented data is organized in RAM or on storage devices.

@malhaar707 3 года назад

wow, you got nice hair mate!

@armanmasangkay6513 Год назад

Why would you create the classes first without writing the tests first?

@chilly2171 3 года назад

failed to pass json error...

@DanielAlcudia 2 года назад

I love you

@abuzubaer3083 3 года назад

please make entire playlist about this

@restitodelacruz8827 3 года назад

I need to get the details and summary to be submitted to a server so that I can see what his/her order.

@edwinthatsnotmyname3670 3 года назад

Leaving comment early so I can edit with actual relevant question/statement after watching Edit: Ok, I don't have a question.

@FernandoBaldrich 3 года назад

Why

@JulienReszka 3 года назад

Don't forget to sleep Kyle!

@codehan 3 года назад

40 Minutes of Content ist up for 6 Minutes: Already a dislike.. Humans.. 💀

@alexandreduhaime8622 3 года назад

2 dislikes in 7 minutes

@alexandreduhaime8622 3 года назад

Maybe they disliked because it's a video about tests

@iulicush86 3 года назад

Maybe they disliked it for the discrepancy between thumbnail and video title. I was also thinking it would be about js interviews. It's a great video anyway.

@RunForPeace-hk1cu 2 года назад

Why not just use hash table ... built into javascript. Not need to use arrays. Javascript have no concept of "pointers" ...

@bedrockcoder5169 3 года назад

Yay I'm early

@kaido8225 2 года назад

You sound like NADEKING haha

@Luka-he5mr 3 года назад

Hello. I'm early

@SantiagoRojo 3 года назад

The title of this video is conceptually wrong. You're not doing TDD if you know the implementation beforehand.

@dean6046 3 года назад

Thank you k man! Can we do a collaboration video? I have several RU-vid channels if you get a chance send me a message or just respond to this comment.