프론트엔드 페어프로그래밍 인터뷰에 많은 도움이 될 영상, 스킵함
www.youtube.com/watch?v=Xn7dxVehX-M
hey guys this is Lucas from better coding Academy I'm bringing back a pair programming session today this one's a little bit interesting I'm going to show you how I would do things from the point of view of more of an Assessor more of someone who's looking at a project and just reviewing performance maybe within a tech interview scenario so I've got one of my students here with me and we are going to be going over a project starting from the very beginning so do you want to start us off we're starting off here with a basic index.html file completely blank and what we're going to do today is we're going to do a project and completely from scratch using plain vanilla JavaScript so no libraries nothing fancy just to test your JavaScript ability so this is what we're going to be doing today we will be building a to-do list in terms of the to-do list the styles it doesn't have to be very impressive in terms of the functionality you need to be able to add in items like what you want to do you need to be able to mark those items as complete you need to be able to edit those items and you need to be able to delete so maybe what we'll first is will first look at adding in items into a to-do list so do you want to start us off on that and maybe just run me through how you would start doing something like that okay yeah yeah first of all I chose to create html5 right and to you probably just close that thing on the side hey so here okay yeah and to cuz way I create a to-do list yeah so I may be creating some at least here and give it ID such an eye care to-do list yeah and so we also need a [ __ ] you talking okay the ID includes to do buuut the tag closes itself so you don't okay yeah yeah yeah oh yes so as if I were the interviewer or the Assessor I wouldn't mention that I'll probably just let you continue but just from the point of view as as an instructor I mentor you you don't put the ending input tag okay yep script so what's the script tag here 404 the JavaScript is how we manipulate dawn and I will put a function here right yep but what are we trying to manipulate right now like what's what's the point of having the script tag there because we first we put behind we put behind it behind every every Dom because we need the document already and the the dorm is existed there so we can manipulate the function Cal can make sense all we just are waiting for the Dom load yeah I know but like what I'm saying is what's the purpose of what are you going to put it in the script tag like what are you trying to do with the inline yes we're going to pitch a server function inside maybe we can say and and list item okay and then you this function if we receive the search like here we can um key press we just around this function I'm gonna stop you there um a couple things number one if I were the interviewer what I'd pick up here on what you did is that you didn't Aquila explain what you're trying to do so you you put in an HTML document which is fine well Helen created a ul which you you explained you were like what do we have to do so we're going to put in ul we're going to put in the input because we need to add something and then you just added a script tag and then I asked you what the script tag is for and all you said is this is for
JavaScript like I know it's for JavaScript right what I was trying to get at is why are you putting a script tag on your page right because there are two possibilities you can put it on your page or you can create as an external file now which why are you choosing to put it in line and if you are putting an in line what are you looking what functionality does this script side provide you know are you putting jQuery in there are you trying to create a helper function are you trying to initialize and do bindings what are you trying to do right you didn't really explain what the script tag was for you just told me this is for JavaScript I'm going to put in the functions but like you need to as from from the interviewers perspective they're interested to see your thought process now I understood your thought process for the euro that was great for the immigrants or that as well but then when it came to the script tag you started typing without explaining what you're trying to do okay so you can explain that more more clearly and in terms of your code or what you're doing right now I would I would highly suggest that you don't do this two reasons number one key press isn't technically standard you're not meant to use on key press like I nearly if you want to if you want to do like I don't know I think you're trying to do like press ENTER right is like trying to detect a servant well yes yes then you'd use on key down and even if you were to use on key down you wouldn't specify it directly in line you see because now now if you do something like on key down it goes ad list item yes then all of a sudden and like I don't know like event or whatever then all of a sudden this becomes tied to that whereas like basically your HTML then starts referencing your script tags yeah and you have just a whole bunch of functions in your script tag we just don't do anything but the it should be the other way around where like your script tags enable your HTML to work okay you see then in if you're doing this then what's the point of having an ID right the whole point is that like you have all of your templates on the page like this is kind of like your template right like your imports annuals and all that and then when your page loads and you have all of that available in the Dom yeah then what you do is you hook into those right like the IDS are the hooks so you're hooking into the to do list you hook into input to do and all that kind of stuff you don't hold or the other way around okay okay so I probably like if I were to do this I'd probably think about like for add list item and all that I probably first think about event handling right because whenever you do something that involves Dom manipulation like for example in this case you're working with event handlers for light pressing enter and adding allies into your UL this is a lot manipulation and the key part of Dom manipulation is event handling now okay so step number one in your javascript is to do the event handling so how about we start from there let's just say you created the script tag in line show me how you would do event handling before for the purposes here okay
I will because I won't indistinct acts and I I don't know I just my first idea is that it's just on the cup on the key down and about there a function here such a like a we call it and this Titan and two ways receive a event and here we we create this function and they made to you haven't that's what I'm saying is like you're binding it the wrong way yeah but I do this in react right because in react it's different because and react to a templates much more closely tied to your HTML but what you're doing here is if someone were to look at your JavaScript or make no sense because you have an add list item function that is not being used within your JavaScript okay you see what I mean like you have everything here on one page which is fine but in most cases if this were to be a little bit bigger it wouldn't be on the same page okay most likely you wouldn't have that available yeah so I create an external no no you can and I mean that's fine I probably would have gone external which is fine but what I'm saying is you're binding at the wrong way you're meant to select input to do and you're meant to add an event listener to that because the way your binding in is is you're you're doing Anki down on the input like this but you're meant to do it the other way have you ever used this before yeah good idea but I would do it are you just for any event no okay imagine okay imagine let's just let's separate this out now okay so you've got index.html and let's just say we created a file called spawn mange is or whatever yes let's just say for the sake of argument that screw the script script tag it's gone okay and we want it inside of inside of this file here now forget we had this line as well if I go into here and I do let's just go here function add a list item okay yeah how do I know where this is being used all right so it should band always even handle it now you see what I mean like it's not clear if if and where this is being used it could be used anywhere but from what I can see it's not being used anywhere at all right you're assuming that this is a global function and that your HTML can access it but that's the wrong assumption to make right like okay so now you have a main dot j/s and you connect it into this page and it works what if tomorrow I decide to change the name of this function or change the way it works so that we don't have one function called add list item we have two functions which somehow take part of the functionality each then then how many index our HTML files would you have to change right because you're binding it the wrong way you're binding your JavaScript to your HTML your HTML is is like the the source of truth here it's the king but instead it should be that the JavaScript is the source of truth so if you have say freeze and this item here and I'll fix the spelling if you had something like this right you should do document.getelementbyid an input to do add eventlistener key down purple and this item so you see what happens now is it's pretty clear okay so a de list item is being used by something with an ID of input to do Oh what I mean well who is he no previous example if this one here then it's like what's using this is nothing using it can I just remove it all of those questions are unclear right okay and also like if you were to use something like say parcel or web pack or whatever if you were to use something like that then what would happen is this function would probably even though it's now in the global scope when you when you do like web pack on it all your password it suddenly isn't in the global scope anymore right because then it gets wrapped into a function or whatever so then what happens is you can't access it and you can't do this within HTML so either way all I'm saying is you should specify the event listeners specifically within your JavaScript okay oh that make sense okay so let's let's forget about this never ever do this like does don't do it all terms of this file okay better so explain to me what the purpose of the meta tags here is why did you choose to keep in these meta tags what's the move okay the 949 like why do you choose to keep those inside of your code Oh tonight okay the first one is the how the how they decoded the item how they decoded at this file because they use YouTube I need utf-8 and the second one is this a the viewpoint is pantry's for though it's it's sometimes sometimes it's a photo print or you sometimes there's a full user folder display on the devices so it specified this kind of thing and to the second my point here uh-huh is I can ask you right now as the interviewer okay so this one here specifically what it's for is even if you explain it correctly I like this one here is so that it appears at a similar scaling on the mobile devices okay so mobile by my support and then my first question to you is why are you adding above support are you planning to support mobile devices and then the whole question becomes as you are developing your app how are you showing me that you're using mobile support oh you're causing yourself problems like you're including this you're including that you're including this you're causing yourself problems right you should only include specifically what you need if you go above and beyond in any way you have to explain it like this line here this line says it it basically triggers the latest rendering engine on Internet Explorer right so this allows us to to capture that information but then the question becomes the interview will instantly ask or they might ask are you planning to support Internet Explorer how are you going to do that can you show that within the time frame chances are you can okay and
the reason is because you're not given very long to do it you might be given 30 minutes one hour sitting down pair programming you don't have the time to do this kind of stuff okay yeah so when you create the document from the very beginning just go BAM fine right okay just just get rid of it if you um if the interviewer asks you why you get rid of it you can just say you can just say like like if you know what this is and you probably should at least you know memorize it or know about it oh you know you're like oh yeah this stuff here so the way I would do it is like is um if I were being interviewed I'd say yes so the first line is for into internationalization support but this stage here we're only really looking at English so that's an assumption I'm making for this project so the assumption is that way only using English ASCII characters and we don't need to support utf-8 alright then right and this one this one is for specifically supporting devices and allowing it surrender but at this stage were not because of the constraints time constraints that are set in place by the by the coding interview or or by the by the pair programming session I don't have the time to implement that so I'm going to remove rid of it right oh this one this one specifically for ie generally my approach for ie is that I don't specifically design for it unless it is necessary unnecessary requirement or like or there is obvious evidence that you know a decent percentage of our user base is ie or we should support it and also given the time constraints I've decided to remove it alright see ok so now that you don't have those lines they can't ask you questions on those lines and they can't trip you up oh so language equals English that's fine you should have alright that's um that's accessibility it tells you the language of the page and you're like well my pages in English this is fine right for the title usually a good idea to change it if you leave it like this is what I'm saying right they pick up on things about sloppiness really quickly right they want to see that you actually care about your code if you leave things behind your kind of misspelling words putting a lowercase where there should be capital all that kind of stuff they see that as sloppiness I see that a sloppiness you know and you don't want to come off as sloppy alright so make sense there so for example this one here when you start off just name a to-do list right and you can be like I'm just gonna call it - to-do list for now we can change it later that's fine but if you just leave it as document you can choose to leave it as document if you explain yourself like we'll probably pick a better name later on but it's generally good that everything that you do well everything that you don't do you need to explain or you know a lot need to be prepared to explain ok so in this case I think something like this won't cause you too many problems so we just have Euro and input for now here's a question that might come up say for example in this case here uh-huh why did you choose to to put in our euro and an input okay because your is the least and we just a create a to-do list or so we need a place to padding oh I tagged in to induce somewhere so we need to create ul yeah and the input is the solves come from so we need tie pain so we just got what we got what we type in so this is the since we need yeah what about anything else like why did you not choose to include for example a button for example form what's your rationale for that yet if if we choose yes we can add a button and we also can bundle the unclick and the riser events and then to handle this handle everything but it's option the the inputs if we if we handle the the on key hunky down so it's enough for me to to handle all the inputs so yeah and if we use a form for me something like to you generate a post HTTP request so it's not suitable for here so okay so let me just reflect on what you said there um you said something about a button unclick all about like you can do it but you're choosing not to for the form technically it is right to use a form because whenever you have an import you generally want to have like a form around it even if you're not submitting into another page because technically well no page should work without JavaScript enabled right like technically like assuming we had a perfect website and we could design it for everything then the this the solution is that if we had an input tag and we pressed enter like we submitted and we tried to add it then we could do it with JavaScript if JavaScript was enabled but if JavaScript was not enabled then we could use old-school HTTP GET or post or whatever and we could still carry out the actions right well that is Theon so like for example on Google like assuming you go to Google now and you disable JavaScript you could still search the search wouldn't be as great but you could still press enter and it will manually refresh it and it will do the whole search thing right so the kind of the idea here is that you want to when it whenever they ask you you know why didn't you do this why didn't you do that the general best reply in the case of a coding like one-on-one session is to just simply say you know this is the bare minimum I need to implement the functionality well they're like okay so why didn't you use a table for the to-do list why didn't you use div or whatever uh-huh the general answer is just you know we're trying to you know obviously I understand that this is I understand that those are possible options but this is a time to pair programming session or pen a times coding interview so in this case I've chosen to go with a minimalist approach specifically in order to meet time constraints so like so then that instantly answers why didn't you use a phone why didn't you use a button why didn't you know any of those kinds of questions it's like yes I understand that I can and I understand that that is better but in the interest of time I've chosen not to yeah all right all right okay now let's continue enough talking can you continue building out the hour please show me how you do it yes you this function I go into because we need a event here I just need to catch the one the user press the key Enter key and I capture it and that means we need to take action and now we just need get that get all the contents in the input button input and the cutting input get everything in the input and then we needed a value of being value inside and then we just go in and we also need fetch we also need to get the element of least content that is the UL yep and away just and make everything ready and then the we just ending appending a children okay we create another one something like in list item and this is though and we how we create create a inner HTML page what's the function name this is just to use document or create element yeah create non created element we just type in some HTML HTML string and it can can check can be converted to yeah it's probably not the best idea oh no I just have forgot that function I but I just at I paint some sing like that I just forgot that I'm gonna go search nice you know yeah you know HTML it but it is I dunno if that function is the input input string and then it can convert to a HTML ooh Alamo if you needed search you can feel free search like you can search during the interview just a stone search you know try not to serve simple things and also try not to search anything that is like that that takes too long you know like if you're going to do a quick search it's probably not a problem but make sure you can ensure that you're efficient even when you're searching yeah it's down there convert HTML string to Dom element oh where is it go handle it down okay yeah maybe so something like nice I think you're talking about in HTML what huh sorry I think you're talking about you know HTML like this yeah yes or is it this one oh because I think there's a clean way I've never ever heard of there being a clean way to do that really Wow okay hike wait I just yeah you don't want to do this during interview true interview you generally want to just stick with what you're comfortable with if you have to search something up well chances are you probably going out of your comfort zone which might not be a good idea yeah [Music] and we just oppose the value inside the hour the the children element and then now we are going to appending this children into into the into into this the container Oh can you see why no no I don't know what where are you including this file oh yes [Music] Oh it's ending Godstow value is not scary there is some problems with welding yes so show me how you would in this situation if you come across a code error that you can't fix mm-hm show me how not other you can fix but you come across an error in your your solution show me how you would debug the problem so and explain it to me okay I go into first of all I just a double check double check I actually have I actually cut the value and 39th days yeah the value is here because the jaw is here and the series maybe I got wet already maybe this is a problem with days oh this line 19 on line 11 yeah so I go into check yes why can't I be a problem with line 6 for example my sakes okay it's maybe now I'm asking you it like as what someone who doesn't know anything why con it why did you jump straight to line 9 and 10 like why can't the problem be in line 6 the possibility of getting an element by ID who did not the the arrows if you if you just type this the the ID is correct if they always work the possibility of this line cuts cat hair row is maybe the possibility is much smaller than life so the actual reason is because for this section code here if document.getelementbyid if I can't find the true list it will return null oh yes then let's container be null and if you try to run a pen chart of null then you'll get error you'll say cannot run property or method a pen child of null so Divya Hara secondly you're getting an Li yes yes that's the reason yeah so um so it's important to I guess understand how exactly that works here but go on yeah yeah and maybe there is some problem with the create new element yeah or maybe you haven't approached the value ye yeah you create and you you already create correct the children element because there is a thoughts on the screen yeah yeah so that's the element is there the problem is that the elements haven't got the values you fetched a friendly input yeah okay yeah so the lighten is that is that is the problem makes that so can you fix it yeah yeah I just check okay it's not the value cuz ii do not have value see that was but yeah so generally you don't want to use innerhtml yes how you can do stuff like even like even like this is bad right like yes so ideally applying tack it's okay so so let's let's go view a code now um number one thing is probably you need to spend a lot of time working on your understanding of HTML like Dom Dom manipulation cuz your Dom manipulation abilities are pretty weak okay so what we need to do is is like let's just go through like your what the issues you've shown today and I'm going to show you how you can improve them okay so the number one issue was with onkeydown so specifically just don't do that the other way around okay so always do findings like this at event listener reference I like that okay and then do add list item that's fine in terms of key code before pretty simple mistake using lower case for the see no yes pretty much it's pretty much always like key and then code like camel case yeah but you're also firstly that w causes bad never ever ever use double equals ever okay I'm always triple equals yeah can you comment using key code anymore so key code is out of date if you go to key code MDM and you have a look it is deprecated so you're not meant to use that we want to use instead is you're meant to do event key and like the only way you can ever know this is through experience in practice okay so this is definitely an area you need to spend more time on but it's you right I like that okay okay so this will if let's have a look now make sure it's sort of the same thing does the same thing okay well in terms of your code inside of here this is this part here is that okay there are two reasons it's bad well I guess one reason it's bad is that you're doing every time you do document Jelena by 80 it's it's computationally expensive so to speak you know well I can't do that on the page every time you know it definitely can add up obviously if we're to do this the effects are negligible but it can become quite a big deal okay so what we always do for things like this oh yeah thank you yeah okay just a Fed won't exactly exactly so you always do it at the very top um for things that are going to be present on the page right and the naming here is really bad like the lists contain no means nothing here's my suggestion if it's hard to come up with the name for these kinds of things you've already got a decent name inside of your IDs just use that same name but use camel case obviously so this one here becomes to your list like that right so you kind of have a mirror of the name so you don't have to think much about it okay and then for the value what I would suggest here is firstly one thing you forgot as well is event or prevent default Oh in this case it didn't affect anything because pressing enter on an input field doesn't do anything but assuming you had a form around it assuming that it was a text area or whatever this could cause problems okay so you want to make sure that you do event I'll prevent default and then so for the value I mean yeah like if you can do like constantly it comes to import to do a lot value it's a little bit you know especially if you're only using it like firstly the name kind of is bad reason it's bad is because the value is like value is like an attribute of the element right but it doesn't explain the data it doesn't explain what's going on here what it actually is is it's the to do or at the to do description okay alright there's a big difference here because if you if you say like value you're saying it's it's a generic value mm-hmm but if it's the to do now you're giving it meaning you know it's that extra level of meaning it's like for example you know you can say that your car is it's just it's just a car or it's just an object or it's just steel or it's a physical thing you know yeah but each word is true but it adds different levels of meaning so what you want to do is you want to figure out the right meaning that you've got here right like you might even call this one like to do text cuz to do could potentially be an object type thing you know I'm just saying like if I were thinking this is my full process is I'd probably call it two new texts or something like that as for this contained we obviously don't need this anymore because we have this bit up here oh this item this is fine you really can't do much about that in a text is the one to use um for changing text yep if you yeah you generally just don't want to use in HTML especially with user input so like if the user can type into it or like affect its value generally not a good idea okay and it is a lot safer this is fine this is fine okay so then instead of list containing we'd use to-do lists and then instead of value we do to do text like that okay yeah yep so now you'll notice that like that okay so works fine that's what I'd probably say about the code one question yeah why wish why why should we go to the event prevent prevent default to between this life for in a lie lying fine okay move it up there right now so press all yeah okay say there try and you'll see why do you refresh okay can you take on yeah okay yeah cuz key down is now prevented well anyone that's what you only want to prevent enter all right okay yeah make sense yes any other questions on the code no no so I guess to wrap up this video a few general notes on on your performance uh-huh so there's a lot of things that we need to work on in terms of like there are a lot of things you need to work on in terms of your coding ability with regards to front-end JavaScript well the only real way to do that is to to do projects to build things using front-end vanilla JavaScript so this is this is good exercise this type of stuff but the other thing as well is on a different note is I felt like if I were your interviewer I feel like you were really nervous there was a lot of stuttering there was a lot of uh you know just generally not very confident on um on what you were doing basically right so my suggestion for that is to is to like I mean it's easier said than done right but like you need to be able to stay confident in the interview and um and show that like even if you're struggling with the problem that you're still able to work through it right because you need to understand that when you go into a company there are going to be times when you don't understand things well that's totally fine like the whole idea of a company is is they want you to be to improve in the company to understand the company and the only way you can understand them is since you don't know them yet or like what they do to a full extent is there were going to be times when you don't understand things well so what they want to see is they don't want to see the like okay um he knows everything I want to see how does this person adapt to learning new things over time well like if they don't know something what is their approach for research if they don't know something what is their approach for figuring out if they're unsure about things what is their approach and what is their reasoning behind the logic that's what they want to see you know model so it's or in in interviews and I know this is much much easier said than done it's very very important to stay calm and stay collected alright so like you imagined you were coding by yourself at home no pressure no work anything well if you can take that level of coding confidence to your workplace and and showcase that in front of in front of your your boss your employer the interview or whatever all who you 100% will do much much better oh no it's about the confidence right it's about like it's like it's being okay to not know things being okay with wanting to improve being okay with generally just needing to get better and being willing to to accept the fact that it's a process okay all right cool so I want to do is um is I'll finish it up now in terms of what we've got here today obviously it's not a lot of code but I think we made good progress in terms of in terms of like ideas dealing with pair programming and dealing with these kinds of coding interviews guys thank you so much for tuning along I hope you have enjoyed this pair programming session and I look into what we do for interview preparation here at better coding Academy this has been Lucas from data coding Academy and see you guys later
인터뷰이가 너무 헤메서 별로임, 스킵함
www.youtube.com/watch?v=jma9hFQSCDk
oh hello oh you're hurting me yeah I can hear you carry me yeah I'm doing all right wait how are you pretty good I'm pretty
good I actually just found out that as a video interview so yeah okay it's okay is this your first time using this platform no I'm just before but from - three months ago so recent here okay I've used I've used other ones but this is my first time using this particular okay yeah okay are you ready software engineer over is looking for a new opportunity I'm looking for a new opportunity yeah yeah what about you I'm working recently in in Bloomberg London office okay yeah well okay yeah I'm in Bay Area California okay yeah okay cool thank you so it's about that I will start asking you first okay so as you see you want some time to read the question first yeah so it's a BST successor search yeah okay
okay so in a binary search tree and inorder successor of the node is defined as the node with the smallest key greater than the key of the input node given a node yeah binary search tree you're asked to write a function find inorder successor that returns the inorder successor of input node if it but that has no inorder successor return nor yes so what what you need to make given I know you have to get the smallest node which have a smallest body withers and the given one it exists if it doesn't agree it just return on okay
and in the existing code you have the struct for the node which you would code in Java yeah I'm gonna code in Java okay so in you have a class for node that contains the key and lift Android and you have access to the parent itself and the constructor takes a value for the key and for the MS which you need to file which is fine in order successors take same but node and return your node which is a target one and knowledge if it doesn't exist and you have to you have some logic for to insert but you don't need to take care about that okay
I'm sorry can you say that last part again you don't need to care about the logic for the insert method okay the insert method yeah it doesn't matter for you okay even not you will not need something like that so all you need just
editing right you could here in this part or problem okay
and then so the input isn't the necessary of the route it could be any yeah it could be and you know something like the three example on the list okay
yeah if I give a new something like knowing okay so I'm searching for the node which contains the element greater than nine and the same time is the smallest one so it will be eleven right okay so am I expecting when I give you nine as an input you got me the note which is eleven this one something the front if I got if I gave you fourteen you need to return the root which is twenty okay because if the first node greater than 14 I see okay so if I do have a nine I want to return eleven yes if I have a twelve I want to return fourteen yes right okay and I do have access to the parent nodes exactly how about to the way up there okay so just yeah going over a couple examples say you give me yeah then the in order would be twelve right exactly okay [Music]
so I'm just kind of think of the different cases that we can have here
okay
so yeah let's just say it use 12 as an example it would be four so so if so if we're using 12 and we're going down the tree it has to be on the right side okay
but think about it if I give you nine and there's no 14 there yeah it looks good yeah if you give me 12 and there's no 14 then the answer would be 20 right if I could be 12 yeah if you give me 12 and there's no 14 yeah it's that didn't exist then I would have to go up exactly yeah
I would have to go up and then I would have to go I would have to check which side I'm coming from yes and if I'm coming yet from the right side then I would have to go up again yes and then that would be the answer okay it just seems like there's like a lot of different cases that we could have I think I think we have two cases right and you said you said it correctly first case which if I can give you nine I'm expecting you to turn 11 which seems that I will go down right right but in the other case if I give you 12 without having 14 I need to turn 20 which I need to go up right so think about it when I need to go down and when I need to go yeah I'll need to go down case one and then other cases I'll need to go up exactly so let's start with going down yeah when I need to go down okay yeah if you need to go down then you want to always go you want to check if there is a right node check if no dot right exists okay if it does exist then yeah you want to go down and then go all the way to the left if it exists right so think about it if I give you 12 without having 14 this is the same right I give you a note which doesn't have a right child so you need to go up not down not down right right right oh if you don't have a right note if you need to switch to the second case
which is I will I will need to go up
so maybe I will do so so the first case will be if right now it exists go down yes to the room to the right
okay now let us think about something else if I gave you nine right yeah and you have a
right node which is 12 which node you need to return you need to return 11
right yeah so you go down to the right and then at this point check if left exists and if it does I believe then you just want
to go all the way you want to keep going to the left until you get to an old node
okay and if it doesn't exist if it doesn't exist which mean if I give you nine yeah to turn 12 without having eleven right right right
yeah so if it does so because basically you're just going you are still you're going to the right and then you are still going to the left until nothing exists so yeah if there's no 11 then you would just if you had like a loop it would just stop there
exactly okay so if it if it exists go all the way left until no and I think
that's and then you should be done at that point for this choice so I think once you do that then you're done yeah this yes I think yeah in this case yeah okay so then the other case when you need to go up yeah
so let's think about if I give you 12 yeah without having 14
yeah then you have to go up yeah tell what you have to to go up and then you have to go up again right you have to go up and then you have to go up again until you get to 20 yes so when you're going up I think you want you need to check which side you're coming up from so if you're at nine once you go up you'll say if nine dot right equals the node that we're on then you go up again mm-hmm but let's say we're on a 114 yeah I agree with you I give you 14 there you will check you will check that you don't have a right right child so even so I will go up so you will start with 12 and you are coming from the right so it seems that you need to continue right yeah you need to continue we will continue then tell 9 right and you you're coming from 12 which is from the right right I would seem that you need also to continue right right up to 20 and you are coming from left this time then so it stopped and you need to return funny right right right so okay so in this case if you're coming from 11 you're again you see there's no right node yes sir then you go up to 12 yeah you check that you've came from the left so you know you're done exactly mmm okay let me write that down okay so if you yeah so if you're not coming from the right then you want to go to parent check which side you came from exactly so if you came from left side you want to return the parent okay if you came from right side go up again okay and then you always have the case where if you if you are out of say you're at the root and there is no parent okay then this will be covered right because if I give it one e first shake well well check if I have a right child which is a 25 so I will return it right but if I don't have 25 I would go to the second check which is I will try to get my parent yeah I would find that I don't have any theorem so I can return 20 directly right right yeah yeah sorry you have to do some kind of check to check your pair I think it will be included it will be included in the check a check which is you will do it here right because this part you will add you will do this part in while loop right and every time you check the parent if the parent is null so you need to stop right now right right let's do some coding okay so we have a given input node will say if so if input node yeah it does not equal null then maybe we'll do a recursive call where again we're just calling this on you will solve it in the recursive okay yeah I mean we could use pointers as well and have them go up and down yeah you can just let fit but okay if you prefer recursive just go ahead yeah
okay so yeah so if like we said if right exists actually it might be easier to do it let's just yeah okay do this so input right is not equal no we want to call them
you can you can't you can't recursive on the same mess up because if if the note to the right is exist right you need to use some different logic which is you need to get the most left node right so you need to write a separate method which can give an a note get the most left one right so I think I think you need you need to go here right here and just type a method which is get most left right and you can give it a node which is call it X anything okay and it's not responsible for getting the most left child right right so yeah
you're just right if X dot last is not simply yeah it goes no then you'll just return X otherwise get most left X dot left but this way this check should be like that X and well here now even you can't do that because if you don't exit okay let's assume that you will start with I gave you I gave you nine okay so you will you will pass to this node the node twelve right and you will start rating so the first time you check is twelve dot left equal equal not know because they call eleven right so you would go here and at rate again R is eleven so and when you get you go to 1111 that left equally Cornelia okay cool it's hard it's working yeah cool so we will done with this method right yeah so here we need to do come to light up right right okay yeah that make sense cuz you're gonna go to the right and then you're gonna keep going to the left and he didn't return that right right okay so I think that covers the first case yeah the second well okay so yeah so we said we need to go up now so we'll say maybe we'll have another pointer Tara fronts okay a parent so so I guess so right now we're kind of doing it the iterative way yeah okay so yeah let's just do it like that then since okay okay so if we have if right does Michael know we'll just go to the right and then go all the way to the left yeah I think I think we can call it in a more make sense so we have parent right and we have here some node we can call it coil which is the currents node right right is the input node right now so we have child and we have parent what we need to do we need we are sure now we need to go up right right so we need to do with a creative way which is we need to do some while loop or something like that but by which condition you need to stop right rating right yeah what is all so this condition is if parent left equals child then you want to return parent then you want to return the a parent so what we need to do now we need to reverse this condition and put it inside while loop right yeah yeah because if the parent yeah because if this isn't true then I need I need to go up right we need to go up again exactly so if we change this one to be while and we do something like that right just right reversing what you said then you know if I'm not going from the lift so I need to go up right or parent because so we can we can just remove this part and instead of lift who can do it right exactly yeah well equals right then parent equals parent dot and exactly and for the child you need to set it first right then right child equals parent exactly and you need to just cover one extra check which you mention oh yeah before yeah because if it doesn't exist yeah right so we'll say let me think where we need to put it for a sec okay yeah I think we could just put it here if parent dot parent equals null then we're just returning null think think about the petition for the condition again if I give you let us make some debug debugging okay if I give you nine so here's a parent will be when you write the pair will be twenty yeah and the charge will be nine I will check with the parent to try it which is twelve sorry which is twenty to try it on if a little child know so I will I will go inside this four loop parent to parent equal equal null try it because that wainy the parent for twenty is not right so yeah well parents are right yes wait so parent Detroit equal equal child so parent is twenty yeah parent are right a doesn't equal child yeah okay let's make sense right so so well parent rate equals child sorry someone's at the door I think so yeah so so yeah so input so parents 20 child is not yeah so okay we can't we can't we can't make the plug in for this one let me do it again if it change no in Wis 14 and the parents name is 12 okay so we'll start from here with parent to try it which is 12 to try it equal equal 14 excuse me actually can you give me one second someone's at the door sorry about that okay all right sorry about okay no so the parent now is 12 okay and that the child is 14 okay why is it 400 yeah it's child 14 parents yeah and the parents Valley so I'm expecting from you to return 20 for me okay mm-hmm I'm expecting so we will start debugging the parent Detroit which is 12 Detroit equal equal child equal 14 years a true true so I will I will come here if Aaron to parent equal equal null no because it's equal to nine continued the child will be 12 for and now the parent will be nine right right I would continue again if no in Detroit equal equal child here's the true so I will come here if parent Oh Taryn which is 20 equal equal null no so I will continue the child will be knowing exactly and the parent will be 20 very funny yeah and I will come back if the parent Detroit which is 25 equal equal child which is 9 no so I will come here and I will turn parent right right so just working but I think there is some case it can be not work it let me think how we can how we can't break that so you see it do you see a particular case that won't work yeah I see a 1 if I give you the input node it's already null okay okay which I gave you already and I'll input not invalid input okay what do you mean like him like a no that's not a tree no no does I know this love itself is not it's not an invalid input nor it yeah so if you will do it here which is not Detroit it would be so an exception right yeah could we just do a check yeah so at the beginning we need to check if the input node not equal null or equal equal null you just returned anything right this will burn all right exactly and I'm thinking about the front case what if I think they're all the cases yeah yeah I think a smoking point yeah mmm but let me think about if we can break it okay yeah let me think you know I think it's will work okay what is the time complexity for this code so the time complexity [Music]
I think it should be log of n okay why you love a plan well just from looking at it I know when we're going up the tree we're only looking at the nodes that are on that particular path and okay like if we want to trace it the other way around we know that we're only checking half of the tree each time and what is the height of the tree hmm well I guess if the height of the tree is and say we have say we just have like one say it just goes one way and everyone only has like a right or a left then yes oh yeah so in in the best case scenario the height for the point in search tree is log n right because it's a binary search tree but in the worst case scenario which is we only have known in a only one way which is only right only left we can have a chain which is called a chain problem and it would be a linear ID right so the time complexity in the worst case scenario would be order n but in amortized long time or the average running time it will be order log and as you mentioned and what base complexity the space complexity will be since we're not calling it recursively which it should just be constant space yeah I could you yeah you're done man well actually when we're doing get most left yeah then if we have like you said only if everything is to the left then yeah but in the worst case scenario you are not at rating through all of the nodes because you will to get this point you have you need to have at least one right node right yeah so yeah one right exactly exactly so it would be I minus one you know interviewer fossils are valid but I think for me constant ill will be a satisfied answer and this is what I have in my in my motherland and because we could write get most left the iterative approach where we just use a pointer and then it would be a no space but you can do that because if you want to do that you need you need extra space you need because you need to keep track with the most left node right yeah I mean you'd have the extra you'd have the pointer so oh yeah yeah just just just you need you need extra memory inside each node because you want H no two points the most lives node in same path but you can't do that man because you will prick another thing if you want to keep a pointer inside the node itself which can pull into the most left node inside the same path every time you insert a new node in the point a search tree you need to cope with the for test and update all of them again right so let me think if we back to the same question here in in in 12 well I'm just thinking in line 70 on this this function here can we just have a pointer that just goes all the way to the left until we hit node yeah that's a problem because if you insert a new node which will change the some order for some of the node you need to reorder the same right you need to really order this pointer in all the node right and which that will break the condition that we can insert in the binary search tree in log time right so it will violate another another conditions but okay okay cool all right sorry we can run it or are we just gonna I think I can on it it's running now okay you have some missing winter 1877 let me check that 77 Wow okay so if we just get rid of the house yeah or we can just go yeah okay an attorney and so you have expecting a line seventy-three what we have
[Music]
they're not a statement I said he was he had not found it yeah I don't know maybe let's try it again maybe we were both typing and maybe got messed up okay yeah it's running now I'm twerking okay cool cool
www.youtube.com/watch?v=o0g2FjLF-ik
everyone this is James Shore with another test-driven development video today I have a very special guest Frog Myers I'm really happy to be able to do some pair programming on these videos for a change Rob is an old friend of mine I've known him for years he is principal consultant at agile Institute which is agile Institute calm he also ago is on Twitter as agile coach and he has been programming XP doing agile training teams consulting for about 12 years about 12 years a good long time so say hi Rob hello all right so we are going to pair program so all that complaining I've been doing on the videos about not having a clue rob is here to tell us all about it and you know exactly how much of the clue I have to so let me show you what we're doing Lori well as I mentioned before we started I'm doing a retouch and after a place for my retirement planning spreadsheet and this is a really simplified version and what we're working on right now is the stock market year class which is sort of the fundamental domain object in the system we don't have a ton of classes yet because I've only been working on this for I don't know okay a few hours maybe eight hours now with 35 videos I'm not sure 15 minutes of video anyway we have dollars which is a value object year which is a value object interest rate which is value tax rate which is a value object stock market year is really where all the action is this is one year in the stock market stock market accumulate season to multiple years and in the spreadsheet a smart stock market year corresponds to one of these rows okay now the problem is is that the work I had done in the program doesn't match the spreadsheet I'm using the spreadsheet to check my work so I need it to match so when we left off in the last video I had was trying to get these tests to work so I'm gonna go and run this now I know with our physical setup here you may not be able to do much driving but if you feel like driving just let me know and I'll okay ask the keyboard over so I actually you can you can make fun of me for this but I then just trying to solve the capital gains tax problem that's what doesn't match okay and the capital gains tax that there's an abstraction especially I don't want to spend too much time on this any more time than you need because I've been explaining to the people on the video today we don't want to bore them right well they're still watching so obviously they have a high threshold but even though we have commented code in it hey I know you're gonna bug me about that so the problem is is that there's an abstraction you I don't know how much you know about the waste talk taxes work it's such an exciting subject you've probably studied thoroughly but well I've done some work with finances but right so they're always a wait there it works is you buy some stock you sell it later on you pay debt tax on the difference that's a capital gains tax well for this for this spreadsheet we're just abstracting the years we're not modeling purchases or sales or anything like that okay so the way the spreadsheet works is it just just keeps track of how many tax taxable gains you've had and every sale is a sale of something that was taxable so if I sell $900 worth of stock it taxes $900 so it's a very pessimistic model okay but we need to match it so the problem is that this software was assuming that every sale was out of principle so it was doing zero taxes until we paid off up until we sold all the purchases and then it was taxing all the gains we tax the gains first and then pay no tax on the purchases ah clear clear as mud right there's mud yeah well what can I say but you're pretty sure that the spreadsheet is right no the spreadsheets wrong - they're both bad abstractions the spreadsheets more pessimistic which means it's more less likely to put me in the poorhouse gotcha which is why I want to use the spreadsheets abstraction plus how you want to use it to test my work and I'm not gonna redo the spreadsheet right because the reason I'm writing a software because I think the spreadsheet is too buggy and slow it takes like five seconds just to change a value now I put too much stuff in it okay anyway capital gains withdraw in here in stock market year calculates the capital gains that's been withdrawn over the course of the year and we want it to be the minimum of two thousands and I made a big mistake last time and I said maximum of two values so so should we mmm let's let's let's fix that let's just get let's quit throwing up I'm gonna get back to a green bar okay rid of this test which means that I've got to get this code back to what's working that's why all the comments are here my little license because I do fifteen minute videos and things were all taken apart and there we go last video so there we are back and what I did was I wrote the wrong I wrote max of two values instead of min of T values so what did the test actually test for it the test that I just commented out is the correct test but what I did is over in dollars I wrote a little this is my value I think I wrote a little method called max of two values and I was supposed to write mimic two values so this should be a 23-20 see with me I know I'm sort of just dumping this on you sure for all of you out there I didn't really explain anything to Rob except that I was doing this and I said hey come record a video with me and Rob said sure yeah so we'll see what happens yeah so we'll see what happens I'll pick it up as we go yeah so there we go so there it's family okay do you want to try to make this pass that way you can look foolish on camera - no okay then I'm gonna rename this to min of two values here and and then I've got to just change this to use math dot min oh okay so there I just wanted - there we go and of two values anyway you think of a better name than men of two values I've got two dollar objects and I want to return the lesser of the two oh when you're comparing one dollar object to another yeah just minimum be minimum okay with me all right or minimum compared to I'll see that's not a whole lot better than men of T values right yeah so that's my problem with this yeah it's kind of a funny
it's a funny little concept I'm trying I mean genres is a good concept I like it as a value object how about at least of Oh least oh okay let's try that least so for
all of you listening one of the big advantages of working with a pairing partner is that you get a different perspective on your work and you'll often come up with better names and just write code that's easier to understand because you're not just all in your own head where you are always great but other people look at you funny well I'm having a little bit of a trouble with this until I see the test because it's gonna be a dollar value at least of another dollar value so it's still gonna be a little bit we so value one least owed value to two least a value one this sounds kind of boolean ish no I don't like it as much but we could just do men I don't know I feel like we're starting to overthink this honestly it could be I'm gonna put back two men of two values and we'll leave it for now yeah all right so anyway the reason I commented out this test is because changing the way the stock market so we're done with that now okay
the reason I commented out this test earlier is because changing the calculation here for capital gauge withdrawn of course breaks everything because all the assumptions are that this code works in a certain way and I'm okay with that once we get this working I figure we can sort of work our way out unless you have another idea about how to do it and also I think we're just about done I think this code is pretty much done okay I'm still you're still not quite caught yeah well in this this capital gains tax thing is funny it's definitely not I mean it did it never seems like it ought to be hard to code but I always struggle with it for whatever reason so let's go ahead and put this test back and fingers crossed I'm hoping this will work no no my life oh no of course I have to right just this one test and that was that was passing do you want to so what okay does this test speak clearly to you cattle gains tax is paid first mm-hmm starting balance - starting principal okay your withdraw new dollar 500 so some degree yeah so what I'm trying to say and I actually haven't updated that this here I'm trying to say we're withdrawing 500 dollars then we're gonna pay tax on entire withdrawal and there's our 167 and thence once we withdraw all the tax that's where we're paying tax on all withdrawals until the capital gains tax is withdrawn so basically what we're trying to do is treat all withdrawals as capital gains tax as subject to capital gains tax okay until all capital gains have been sold okay that's what's going on here we're selling off the capital gains yeah we're selling off all the capital gains first that's not really possible which is why it's kind of hard to wrap your brain around but it's easier to calculate it's easier to calculate and it matches the spread shulte Epiphany okay good all right better to be hip if dawn than a $50 that's what I say got it or no whatever okay audience I brought brings out the worst of me particularly my puns so just just so you know yeah I've never made a pun like that on this video before so it is all your fault naughty fun yes oh man I can't believe we're going to upload this so now we've got if we're happy with the fact the way that works now we've just changed everything else what we basically need to do is change our expectations in the test hmm probably should double-check them as well as I'm looking at this though I see that our tests are nicely encapsulated in that only only in stock market year is failing so that's good let's take a look at capital gains tax this is withdrawing 4,000 capital games yeah so capital gains tax includes tax on withdrawals couple cap so this is the interesting things if our capital gains tax Oh reboot the computer we have to wait for it if our capital gains tax is 25 percent and we pay $250 on a thousand dollar withdrawal mm-hmm that $250 comes from somewhere right I'm assuming we sell more stock in order to get that $250 which means they pay capital gains tax on that to all to cover yeah oh you know more about this than I do that's an interesting that's the main term I've never heard before so you obviously know more about this than I do that's great I mean you dredged up from my yeah yeah so so that formulas 40,000 my divided by 0.75 minus 4,000 which means we should be paying 1333 one 333 and then the total with drawings can include that so that should work but but and it did actually remember we had multiple tests failing okay interest earners got the same issue how did you get yourself in this mess anyway do you not like the tests maybe we should go do my first intestine so here we have multiple tests breaking which is always creepy it is creepy but they're all in the same class and we did change something pretty fundamental okay I don't have the test testing just one method because I found them really hard to read so I reworked them fairly early on to try to tell a better story mm-hmm so you know yeah that's fine yeah so with Ross I like to test the test behavior or not methods yeah and that's what we've got here I'm sort of I'm actually kind of torn on that the nice thing about tests that just test methods is that they only break if you change the method they're testing they don't break for other reasons so I'll go back and forth in this case I wanted to test the behavior just because it was so hard to communicate otherwise so here interest earned withdrawals don't earn interest well the problem was that we withdrew and we pay capital gains on this so I think we might want to make a new stock market year that doesn't have any capital gains on it so the new year will be a like 2010 starting balance be ten thousand capital starting principal gonna be ten thousand and what else do we have interest rate and tax rate we're almost out of time here the clock is ticking yeah let's see if I can get this one in the last second thank you very much to rob for being my partner on this Rob Myers the agile Institute that said on miracles yeah wish you could have performed miracles to I don't know what's wrong here we'll have to fix it next time yeah thanks for watching we will see you next time file
오늘 배운점..
Okay를 계속 해야하는구나..