I have been watching interview videos on Youtube to prepare for interviews these days, and I came across this video titled 'Mock Technical Interview - Javascript Developer Junior Level' of a channel 'Tech with Nader'.
In the channel, There are two interview videos(2023/Aug/18), that I really enjoyed. Due to my English skills, I couldn't catch everything, but it was a great opportunity to improve my interview skills with high-quality content.
Nader, which was the interviewer in the video, very impressive in how conducted the interview to get the answers he wanted from the interviewee.
Gavin, which was the interviewee in the video, seemed very relaxed during the interview. He approached problems step by step and spoke well. The one thing that really impressed me was his attitude when he received feedback from the interviewer. I have no doubt that he will become a great senior in the future.
The channel also offers valuable resources for learning Javascript and React. I recommend checking it out.
Note
I am going to share my opinions about the answers. I want you to know that it is just my point of view, it could be wrong. If you have some opinions, feel free to comment down below :)
Technical Questions
1. What is Javascript?
He answered briefly. The flow of the interview went smoothly which I felt it was a good starting. He mentioned two things what javascript was originally used for and what javascript is like nowadays.
2. What is a React?
He started to answer instantly, this quick response indicates his strong knowledge of React.
From my point of view, he might have tried to say that how development in React is different from a traditional way, and characteristics of React.
I liked some terms in what he said like encapsulate, components, 'building blocks to create full applications' and bundle.
3. What does react allow us to do in the context of state?
He gave a good example to explain how it is different from an old way when updating view by changing data.
4. What is a Rest API?
The interviewer asked some more questions to get the answers what he wanted which I felt it was a good leading.
There can be multiple answers of this question. I was thinking about the answer too and I would've answered like this.
"Restful API is an interface how they exchange information over the internet. It's kind a promise. As following the specification, you expect what they want. It make the communication easier. For instance, if a client send data with a 'PUT' method, they can expect that the client requests updating data. As the other information, it's usually implemented over the http protocol and has headers, data, URI and methods depending on a purpose of a request. It has methods such as get, post, put, patch and delete."
I am not sure I will be able to answer it instantly in an actual interview.
5. What is a database?
As he went with his answer, he brought up words like SQL, Relational Database, documentdb which is one of NoSQL databases and so on. In my opinion, it showed that he had a diverse experiences in terms of database.
6. Why not just use a text file, why do need a database?
He emphasized the importance of database performance. I couldn't come up with a clear answer of it. If you guys have any opinion about it, please let me know.
7. Login Process Explanation
It was a good question. The interviewer might be able to figure out that the understanding of practical aspects out of the question.
Coding Test
1. String.Palindrome
Prototype Chain. It had been a long time since I looked it up. I forgot constructor, differences between __proto__ and prototype and many the other things. I brushed them up again.
He asked him questions what he wanted to know and the interviewer guided him well.
When I heard this question, I was thinking using loop and iterate for the half of the string.
String.prototype.isPalindrome = function () {
const string = this.toString();
const halfLength = string.length / 2;
for (let i = 0; i < halfLength; i++) {
if (string[i] !== string[string.length - 1 - i]) return false;
}
return true;
};
He came up with a method that used Array.
String.prototype.isPalindrome = function () {
const string = this.toString();
let reversedString = string.split("").reverse().join("");
if (string === reversedString) return true;
return false;
};
I believe this approach is more readable. Sometimes, people make a complicated logic even when the performance doesn't that matter. I like his way.
There are two small things I want to fix.
String.prototype.isPalindrome = function () {
const string = this.toString();
const reversedString = string.split("").reverse().join(""); // let -> const
return string === reversedString; // It doesn't need if syntax.
};
About the issue that this keyword is an object in a'String.prototype' Function, I searched and found the answer but he already commented about it in the comment.
... Else if Type(thisArg) is not Object, set the ThisBinding to ToObject(thisArg). ...
In (https://es5.github.io/#x10.4.3)[https://es5.github.io/#x10.4.3]
2. Create Array Map
Array.prototype.myMap = function (cb) {
const returnArray = [];
for (let i = 0; i < this.length; i++) {
returnArray[i] = cb(this[i]);
}
return returnArray;
}
const arr1 = [1, 2, 3].myMap(console.log);
I think there were two points in this questions.
- Does the interviewee know how to use a function as a parameter?
- Does the interviewee know what returns when function doesn't return anything?
using console.log might lead to confusion because it doesn't return values. In my opinion, it might've been better to use another function.
3. Flatten an array
Array.prototype.flatten = function () {
const result = [];
for (const value of this) {
if (Array.isArray(value)) {
const flattened = value.flatten();
result.push(...flattened);
} else {
result.push(value);
}
}
return result;
};
I liked the approach. Comment first.
And as Nadar mentioned in the feedback section, while I was seeing the question, I wanted to ask him how I should deal with object.
Some people might think it's already clear though, I think it would be a good question to ask to make sure that since object is considered a special type in javascript.
For the answer, I was thinking about defining one function inside the flatten function. I didn't came up with reusing the function through Array which is a better way as I think.
Array.prototype.flatten = function () {
const result = [];
const _flatten = (val) => {
if (Array.isArray(val)) {
for (const v of val) {
_flatten(v);
}
} else {
result.push(val);
}
};
_flatten(this);
return result;
};
4. Create getElementById
If I had the question, I would have written the code like below which is the same way for the previous question. It seems one of my habits. I should try to think differently depending on situation.
Document.prototype.myGetElementById = function (id) {
let targetElmt = null;
const searchElementById = (node) => {
for (const child of node.children) {
if (child.id === id) {
targetElmt = child;
break;
}
searchElementById(child);
}
};
searchElementById(this);
return targetElmt;
};
And he solved the question in this way.
Document.prototype.myGetElementById = function (id) {
for (const element of this.children) {
if (element.id === id) return element;
const found = Document.prototype.myGetElementById.call(element, id);
if (found) return found;
}
return null;
};
His code is more concise and elegant. I also learned how to iterate elements from document. There arechildNodesandchildrenin a html element.childNodehastextandcommentNodes whilechildren` don't have them.
Wrap Up
It was enjoy to watch. The coding test was very different from what I had in Korea. I liked the part the interviewer and the interviewee were trying to solve problems together. It would be a good time for both to get to know each other as future team mates. It looked ideal for coding test purposes.
I am currently preparing for interviews abroad for my first time. Have you had interviews in English or from different cultures? If you have some advice you can give me, I would love to hear them :)
Thank you for reading the post.
Happy coding!
Top comments (0)