Top 20 Interview Questions for JavaScript

I have researched some interview questions for JavaScript. And I found out top 20 of them till now(08 May, 2021).

What are truthy and falsy values?

Falsy values are those which are considered as false. A list of falsy values in JavaScript is:

1. The keyword ‘false’
2. 0 / -0 (number)
3. "", '', `` (empty string)
4. the keyword null
5. the keyword undefined
6. the keyword NaN

Except these, all other things are considered as truth. So, all things except these things are truthy values.

Difference between null and undefined

undefined is a type, whereas null an object.

undefined occurs when

1. a variable is declared but it has no value.
2. a function is declared but nothing is returned.
3. a function is not passing the parameters as it should. To prevent this, we can simply set default parameter.

other side, null is an assignment value. I can assign it to a variable. When something should be exist, but it doesn’t, then null appears.

Difference between == and === in JavaScript

The double-equal compares only the values of two variables, whether triple-equal compares both values and type of the variables.

The double-equal converts both types into same types by implicit conversion and compare the values.

Define Scope, block scope, global scope

Scope means area. That is when a variable or something is declared, it covers an area where it can accessible. This area is called scope.

JavaScript has two types of scope.

1. Local/block scope — e.g. when a variable is declared within a function, then we can access that only within that function. that means, this variable’s scope is block scope.
2. global scope — e.g. when a variable is declared at the beginning of the code, we can access it even from inside of a function. That means this variable is visible from anywhere. It is called global scope.

What is hoisting?

Hoisting means a behavior of moving declarations to the top.

We can use a variable before declaring if it is declared by var. But how’s that possible? Because, JavaScript move the variable declared by var to the top of the block immediately after running the code. So it gives no error. This behavior of JavaScript is called hoisting.

A similar thing is happened with function. JavaScript also hoists function.

What is ‘window’ in JavaScript?

All global JavaScript objects, functions, and variables automatically become members of the window object. window in JavaScript is global.

If we declare something by window(though it is not recommended), this will automatically become a global thing.

Define ‘closure’ in JavaScript

A closure is a function having access to the parent scope, even after the parent function has closed. It is a feature in JavaScript, where an inner function has access to the outer function’s variables.

Let’s assume a restaurant. It has one chocolate box. Each chocolate price is one taka. person1 has ordered one chocolate. A hotel boy served him a chocolate and now person1 costs 1 taka. person1 has ordered another two chocolate and now costs total 3 taka.

Now, there is another customer person2 ordered one chocolate. The same hotel boy served him one chocolate from the same chocolate box. person2 now costs 1 taka.

The costs of person1 and person2 are different though they are served from same chocolate box and one after another. This functionality can be called as closure.

When there is a function(inner function) in another function(outer function), and I call the inner function with an external variable(maybe as a parameter), then both of the functions create a closed environment each and keep a reference of that external variable, so that it can be further used. This process is called as closure.

What do you know about ‘this’ keyword?

The JavaScript this keyword refers to the object it belongs to. For example, if I say,

I have a Mango, this mango is sweet, this mango is beautiful.

Here, I have said, this mango is sweet. I could have said, The Mango is sweet. Rather, I used this and I’m sure you’ve understand that, here this refers to the Mango. Similarly, when we want to refer the owner object, we can use this keyword.

It has different values depending on where it is used:

• In a method, this refers to the owner object.
• Alone, this refers to the global object.
• In a function, this refers to the global object.
• In a function, in strict mode, this is undefined.
• In an event, this refers to the element that received the event.
• Methods like call(), and apply() can refer this to any object.

What do you know about ‘new’ keyword?

Simply, I can say, the new keyword creates an empty object. In other words, it instantiates a class by allocating memory for a new object and returning a reference to that memory. We can also use the new keyword to create the array object.

It does 5 things:

1. It creates a new object. The type of this object is simply object.
2. It sets this new object’s internal, inaccessible property to be the constructor function’s external, accessible, prototype object (every function object automatically has a prototype property).
3. It makes the this variable point to the newly created object.
4. Whenever this is mentioned, it executes the constructor function.
5. It returns the newly created object.

Define ‘Event Loop’

When JavaScript runs on a machine(e.g. V8, etc.), it creates a stack of works to be done. While the commands in the stack is running, there are other commands have to wait in a queue. Now after finishing a stack, the machine takes another stack from the queue to be done running. When this stack is also done, it takes another stack from the queue. And this continues as a loop. We call this loop as Event Loop.

How JavaScript works?

Basically JavaScript works with the help of ‘Event Loop’, if we talk about runtime. Unlike other programming languages, it’s single-threaded language at runtime. That means the code execution will be done one piece at a time. Since code execution is done sequentially, any code that takes a long time to execute will block anything that needs to be executed after that. But where do they store to be run after?

They store on a queue. And sequentially be run by JavaScript with the help of event loop. That’s how JavaScript works.

Define ‘Event Bubble’

When there is an event in a tag, browser normally handles it. Then the browser checks whether it’s parent tag has any event or not. If any, the browser handles that too. After that, the browser checks if there are anymore parent tag’s event. If any, handles it. — This whole incident is called as event bubble, i.e. bubbling up from child to parent.

Define ‘Event Delegation’

When we want to add a single event handler to a parent element in order to avoid having to add event handlers to multiple child elements, we use a simple technique — which is named as JavaScript event delegation.

Event delegation works by bubbling up the event(event bubble).

What are the advantages of event delegation?

1. Attach events at the parent element
2. Less event handler setup(we do not have to add event handler for tons of child elements, one event handler for parent works fine)
3. Even when a new child element is created, the event delegation works for that new element too.

What is JavaScript?

JavaScript is a programming language commonly used in web development. It was originally developed by Netscape as a means to add dynamic and interactive elements to websites.

JavaScript is a text-based programming language used both on the client-side and server-side that allows to make web pages interactive. Where HTML and CSS are languages that give structure and style to web pages, JavaScript gives web pages interactive elements that engage a user.

Difference between iteration and recursion

The concept of Recursion and Iteration is to execute a set of instructions repeatedly. The difference between them is that recursion simply works by a method call in which the method being called is the same as the one making the call while iteration is when a loop is repeatedly executed until a certain condition is met.

What is DOM?

DOM means Document Object Model. When we write something, an object is created. Which is understandable by browser. The browser then reads the object and work. This is actually DOM — a programming interface for HTML and XML. When a web page is loaded, the browser creates a Document Object Model of the page.

What is callback function?

When a function is set/used as a parameter, we call it a callback function.

Do you know about API? What are its methods?

When we want to do/read/sent a complex things and an interface helps us doing that easily, then the interface is called as Application Programming Interface or API.

For example, I said to my mom to give water. Mom gave me water. Between this, I did not know that, mom firstly did find the water, boiled it, did filter it and then gave me. Without knowing all of these to me, mom helps me to fetch the water. After that I can do whatever I want to do with that water. — We can call my mom as an API.

The methods of an API are: Get, Post, Put, etc.

Get vs. Post

GET is used to request data from a specified resource while POST is used to send data to a server to create/update a resource.