Mock Technical Interview - Javascript Developer Junior Level

Ғылым және технология

A mock technical interview featuring Gavin and myself where we go through some introductions, high level conceptual technical questions, as well as four coding questions together. This style of interview is similar to something you'd see at the Junior to Intermediate level when applying for software developer or web developer positions.
In this interview we are coding with Javascript as that is what Gavin has been studying and working with, however the structure and style should be similar for all types of technical interviews at this level.
Thank you Gavin for braving the recording with me and allowing others to learn from us!
Chapters:
00:00 Introductions
04:45 What is Javascript?
05:30 What is React?
07:31 What is a REST API?
09:54 What is a Database?
11:30 Login Process Explanation
20:45 String Palindrome (Easy)
33:05 Create Array Map (Easy)
42:16 Flatten an Array (Medium)
1:00:38 Create getElementById (Hard)
1:32:36 Recap and Feedback
1:38:55 Revisiting Palindrome
1:44:28 Wrap-up
💬 Come join us on Discord to chat with a like-minded community about tech and learning: / discord
🏅Support the channel and content through Super Thanks, Channel Memberships, or on Patreon: / techwithnader

Пікірлер: 56

  • @littlem1ss
    @littlem1ss4 ай бұрын

    As someone who is preparing to embark on my own technical interviews for the first time, this is an incredibly helpful resource. Watching this mock interview is easing my anxieties and helping me overcome my strong feeling of imposter syndrome. Thank you for sharing this!

  • @TheStrategist314
    @TheStrategist3146 ай бұрын

    This is probably my favorite mock. Very professional acting, knowledgeable of what he knows and doesn't but is able to express it without seeming like a bro.

  • @mr_arroz
    @mr_arroz8 ай бұрын

    For the first question: Primitive values like strings are automatically converted to objects (wrappers) when you access their properties or methods. In this case, when you call a method on a string literal, JavaScript temporarily converts the string to a String object, which is why you see [String: 'racecar']. At the end, you're comparing a string literal to a string object using ===. To make it work, you can just compare values (==), or do something like, 'this.toLowerCase()', which will act on the string literal of the string object and return true. Confusing...I know.

  • @outspan87

    @outspan87

    5 ай бұрын

    or this.valueOf() to access the value

  • @skadio90

    @skadio90

    5 ай бұрын

    Autoboxing 🤨

  • @lewistaylor4620
    @lewistaylor46209 ай бұрын

    Code question 1: The '===' operator checks for both equality and datatype. In this case, we are comparing and object string against a string, hence the equality will always return false. The fix: use '==' operator which will just check for equality.

  • @TechWithNader
    @TechWithNader11 ай бұрын

    Thanks to @zia on the Discord for looking in to the mystery of the String and this Object: Regarding this being an object but not a string literal, basically, when a function is executed, this is converted into an object if its not already. So string literal is converted into an an object which for string hello looks like {0: h, 1: e, 2: l, 3: l, 4: o, length: 5 } ECMAScript calls is string exotic object (just learned btw). TLDR: value of this keyword is always converted to an object. Conversion of this to an object: es5.github.io/#x10.4.3 String exotic objects: 262.ecma-international.org/14.0/#sec-string-exotic-objects

  • @ziaahmad8738

    @ziaahmad8738

    11 ай бұрын

    😇

  • @andrefig822

    @andrefig822

    8 ай бұрын

    More simpler than that, I can just say that one is an object `String`, other is a primitive `string`. An instance of a String ""class"" is not identical to a primitive, but can be loosely equal. If you just used '==', it would work, or 'this.toString() === reversed'. A primitive is not an instance of a class, but JS automatically turns it into it with auto-boxing. That's why also "typeof String('hello')" returned primitive stringing console, it's internally "(new String('hello')).toString()". To check it in the prototype context: "typeof new String('hello')" => "object". And in the long run, that is makes confuses devs...

  • @user-ef8yz9fu5i
    @user-ef8yz9fu5i11 ай бұрын

    I like these. Really having a good time watching and good imagining my future interview in this area

  • @randerins
    @randerins11 ай бұрын

    These are extremely useful. Thanks a lot, Nader! I'd like to suggest a video that would advice on how to get recruiters' attention, to land the interview. Seems like a real struggle.

  • @djjordis
    @djjordis6 ай бұрын

    I stopped the video in each question for find the response by myself, and the tecnifiqué part i resolved the problems by myself too and then I continued with the video. Was very interesting!

  • @sereyvathanakkhorn760
    @sereyvathanakkhorn76010 ай бұрын

    I never actually had a proper JavaScript interview, but your video demonstrates an accurate level of interview would be liked. It definitely nudged me into thinking more of a typical questions to why am I doing things in JavaScript, especially in the earlier stage of the interview questions about React, API, etc. The follow up coding interviews were very interesting. For example, if someone where to ask me about the MAP function, I should be doing ok, but coding it.... is another question.

  • @yuliasereda5671
    @yuliasereda56713 ай бұрын

    It looks like a real interview. The guy are nervous but answers are good. The interviewer keeps calm and a very kind. I had the same experience)

  • @antoinenijhuis450
    @antoinenijhuis4503 ай бұрын

    I don't see how a self-taught beginner programmer has knowledge of things such as restAPI, strict comparisons, backend processes, recursion, depth first search implementations as well as a pretty decent high level overview of the language, after only a year. Very impressive!

  • @Kamil-rf5qn

    @Kamil-rf5qn

    2 ай бұрын

    The amount of hours required to go from zero to junior level job-ready is around 1,200h. That can be done in a few months to a year depending on the amount of time you put in. I'm at 300 hours mark right now (1.5 month in) as self-taught and solving most of the problems they give here instantly as I do a lot of codewars/leetcode. Covering all the topics you mentioned is easy, you can do it in a few weeks. Being good at them is a different story. Recursion alone took me a week of daily struggles to grasp the basics of it. I'm doing The Odin Project and most of the things you mentioned is covered later on into the course as well.

  • @sequoiakanies2202
    @sequoiakanies220220 күн бұрын

    Good video and great job. Super impressive for only having coded for a couple years

  • @wallacesansanoski8185
    @wallacesansanoski818511 ай бұрын

    thanks to share this helpfull video. I think in the first code question we can just use String function (not String constructor) to convert to string and make strict check on value.

  • @hbgl8889
    @hbgl888911 ай бұрын

    56:09 Gavin actually had the right idea which is to pass in the result array as an argument to flatten. On the other hand, the implementation you suggested needlessly creates temporary arrays.

  • @TechWithNader

    @TechWithNader

    11 ай бұрын

    Good point! Yes, this can be done without the new array allocations but the code looks a bit messier since you need to use it in a closure or declare a separate/global function to use. If you have the code for it, it would be really helpful for others to see this alternative way since it can definitely be more space/alloc efficient 😊

  • @andrewwall2730
    @andrewwall27305 ай бұрын

    Great video, really helpful. Just curious why you want to create methods on the prototype instead of just using plain functions. This seems dangerous as it could collide with other libs that add methods to the prototype. Seems the trend is away from OOP to functional programming. Also in JS, 'this' always refers to an object, though strict-mode may modify that behavior but not sure.

  • @mohamedcisse1547
    @mohamedcisse15478 ай бұрын

    thank you for these videos

  • @Dext-err
    @Dext-err8 ай бұрын

    thanks a lot Nader

  • @eduardovivanco4702
    @eduardovivanco47028 ай бұрын

    Thanks for the video😁

  • @iconiiick
    @iconiiick9 ай бұрын

    In non-strict mode, THIS is always a reference to an object. In strict mode, it can be any value. - MDN So you could have also used this.toString() instead of String(this)

  • @rampandey191
    @rampandey19111 ай бұрын

    The problem with this was that it's mentioned that it's a object in the docs right? That's why it was an object and we all know that everything in js is a object so when we use the String constructor and pass an object it returns the string. Let me know if you find any fault here

  • @jsagar95
    @jsagar955 ай бұрын

    This was too good ! (no pun intended)

  • @noid3571
    @noid357111 ай бұрын

    Palindrome question, is the solution used in the video better than iterating the string with a single for loop matching symbols from both ends of the string and breaking on the first mismatch?

  • @konan6191

    @konan6191

    11 ай бұрын

    the solution utilizes functional programming which is more or less specific to prototyping in js. so from the aspect of using a prototype, yes it's better

  • @NoxyYT

    @NoxyYT

    11 ай бұрын

    Single loop like that should be much more efficient and doesn't allocate unnecessary memory so it is better (more performant). Some could argue that 'functional' solution is more readable, but I'm not so sure about that as imperative one literally spells out how we think about palindromes and I think would read just as fast.

  • @hmm1778
    @hmm177810 ай бұрын

    In the first problem we should either loosely compare "this" with reversedString (using ==) or compare this.valueOf() with reversedString

  • @KevinCogen101

    @KevinCogen101

    9 ай бұрын

    We could also use this.toString() === reversedString

  • @front_interviews
    @front_interviews9 ай бұрын

    great review friends, if possible take me to work)

  • @abdessittirharkati7603
    @abdessittirharkati760311 ай бұрын

    I would love to have an interview with you Nader

  • @user-hz1hf5nt1s
    @user-hz1hf5nt1s6 ай бұрын

    cool video)

  • @LucianoClassicalGuitar
    @LucianoClassicalGuitarАй бұрын

    Make more please

  • @satyajitj5388
    @satyajitj538810 ай бұрын

    Can the palindrome task be solved in this way? Would appreciate your feedback :) String.prototype.isPalindrome = function (str) { if (str.split("").reverse().join("").toLowerCase() === str.toLowerCase()) { return true; } else return false; }; console.log(String.prototype.isPalindrome("racecar"));

  • @dualasus12

    @dualasus12

    10 ай бұрын

    Yes just not as readable in some opinions but you could also get rid of the else since you return out of the if statement and even remove the brackets. However you will have to use this unless you want to call it as String.prototype.isPalindrome(myString) vs using this and calling myString.isPalindrome(). One addition note is your version also requires a check to ensure it is a string being passed in. With the "this" version it will implicitly be type string since method only accessible through String prototype chain unless you did something like String.prototype.isPalindrome.call(myArray) which would also break the "this" option but would almost have to be intentional miss use // Replace "this" with str and add back to function signature for your version. String.prototype.isPalindrome = function () { str = this.toLowerCase() if (str.split("").reverse().join("") === str) return true; return false; }; console.log(myString.isPalindrome()) // Your version. String.prototype.isPalindrome = function (str) { if (typeOf(str) !== "string") throw new Error(''Argument must be a string"); str = str.toLowerCase() if (str.split("").reverse().join("") === str) return true; return false; }; console.log(String.prototype.isPalindrome(myString)) Also thank you for pointing this out I forgot to .toLowerCase in the video.

  • @victor63666

    @victor63666

    9 ай бұрын

    They only need to do: String.prototype.isPalindrome = function () { return this.split("").reverse().join("").toLowerCase() === this.toLowerCase() }; console.log("racecar".prototype.isPalindrome());

  • @virgoeun
    @virgoeun7 ай бұрын

    I'd love having him as my interviewer... I feel sick to my stomach whenever I have live coding challenge or tech interview... I just can't think well when someone watches me :(((( I am just frozen.

  • @saidibra9231
    @saidibra92316 ай бұрын

    I think it is not a good idea to use String.prototype.isPalindrome and Array.prototype.myMap it will cause a lot of problems which is why you will never see someone using them in an interview or in a project. instead just use a normal function like: function isPalindrome, function myMap, etc

  • @BernhardRutzen
    @BernhardRutzen11 ай бұрын

    Are you sure this is for a junior position? I think it might be more suitable for a junior position at a FANG corporation. Given the salary range of 60k to 100k, these types of exercises would likely be appropriate for a mid-level software engineer.

  • @tomasito19861

    @tomasito19861

    10 ай бұрын

    agree, I don't think this is junior lvl

  • @danfrith726

    @danfrith726

    10 ай бұрын

    he did mention junior/intermediate so id say a, this is more for a junior(with a year + under the belt) minimum/intermediate.

  • @Kamil-rf5qn

    @Kamil-rf5qn

    2 ай бұрын

    I'm 1.5 month into learning programming from zero and solved most of the problems in video. I doubt this is mid level.

  • @LeMatt87n
    @LeMatt87n11 ай бұрын

    I came here to hear the English language from the point of view of a non English speaker

  • @nilfux
    @nilfux8 ай бұрын

    DSA is a BS way of determining employee value. But here. Anyone over 40 usually does poorly with these because we didn't have classes to learn, we taught ourselves. Now we are senior systems designers and we find solving these stupid puzzles ridiculous. Proves next to nothing. We hired someone who smoked all the DSA, on the job they were absolute trash. Couldn't even commit things to Git, had no idea about TypeScript, had no idea about the value of cohesive patterns. Just hot garbage hire, 9 months later, they left. DSA is a red herring at best. Libraries solve most of these, like Lodash, and if not, use AI to generate a starting point and optimize it. These are solved here for reference. I wrote these, but only because of interviewing. Interviewing is broken. They should be asking us to build something related to the job. Not this nonsense. O{n} version const isPalindrome = str => { const forward = str const reverse = str.split('').reverse().join('') return forward === reverse } The interviewer will then ask you to optimize it, which means remove the memory so O(1) version using pointers. const isPalindromeWithPointers = str => { let left = 0 let right = str.length - 1 for (let i = 0; i if (str[left] != str[right]) { return false } else { left = left + 1 right = right - 1 } } return true }

  • @terry_swd
    @terry_swd6 ай бұрын

    I think it's unnecessarily confusing for a Junior Level interview to use the String.prototype.isPalidrome. Just let the guy focus on the main goal of the question which is to check for a palindrome with a simple function. :)

  • @lewiemarks6418
    @lewiemarks64185 ай бұрын

    this seem overly convoluted for a junior mock interview. Playing around with prototypes in this manner and creating things that already exist in JS ie map, flatten etc seems really odd.

  • @rajubojja2446
    @rajubojja24462 ай бұрын

    const array2 = [1,2,[2,4,[7,8]],[8,9]] Array.prototype.flatten = function(depth=1){ let result = [] for(let i=0;i0){ result.push(...this[i].flattern(depth-1)) }else{ result.push(this[i]) } } return result; } console.log(array2.flatten(2)) Array.prototype.myMap = function(cb){ let ownArray = []; for(let i=0;ivalue*2) console.log(newArray) Array.prototype.myFilter = function(cb){ let ownArray = []; for(let i=0;ival%2==0); console.log(filtered)

  • @nbyfceryhxet
    @nbyfceryhxet2 ай бұрын

    String.prototype.isPalindrome = function() { return Object.values(this).join("") === this.split("").reverse().join("") ? true : false; }

  • @MohamedFathy-jw8vo
    @MohamedFathy-jw8vo9 ай бұрын

    String.prototype.isPalindrome = function () { if (this.split('').reverse().join('') === this.slice(0)) { return true; } return false; };

  • @yassinezaza7118

    @yassinezaza7118

    7 ай бұрын

    String.prototype.isPalindrome=function(){ return this.split("").reverse().join("")===this.toString() }

Келесі