20 Common JavaScript Interview Questions

An interview is an important part of the hiring process. It gives insights about the skillset, knowledge, and the ability of an individual to take on challenging tasks. It is also one of the most reliable ways for an employer to filter out unsuitable candidates for a job post.

As a JavaScript developer, you must prepare yourself before appearing in an exam or an interview. It will increase your chances to get hired by a reputed company.

Now you might be wondering where to start the preparation or what questions will they ask in the interview.

So, to help you out, I’ve compiled a list of commonly asked JavaScript Interview Questions. Each of these questions has a brief answer which you can review below.

In the end, you will be a bit more confident to answer any question of your interviewer. So, without any further ado, let’s get started.

1- What Is JavaScript?

JavaScript is a scripting language created by Netscape in 1995. It was initially used on a popular web browser Netscape Navigator. But, these days, we can use it for client-side as well as server-side application development.

Well… I don’t think someone will ask this, but we shouldn’t forget where JavaScript comes from.

2- List Some Advantages of JavaScript?

• JavaScript can work offline inside the web browser.
• It supports multiple programming paradigms. For example, we can make use of Object-Oriented, Functional, and Imperative programming concepts.
• It has the biggest collection of open source libraries and frameworks.
• JavaScript is capable of creating online/offline games, desktop software, websites, and mobile apps.
• No need to learn separate programming languages to create frontend and backend of a website. JavaScript is supported on all major web browsers and it can run on the server using Node.js.
• It is an interpreted language. Meaning that we don’t have to build or compile its code before use. JavaScript instructions execute directly.

3- Should We Use Internal or External JavaScript?

Internal JavaScript is more suitable when we just need to use it on a single web page. Whereas, always prefer an external JavaScript file for websites that has multiple web pages.

4- Why WordPress Plugins Like Autoptimize Aggregate JavaScript Code in One File?

Aggregation of JavaScript source code in a single file reduces the number of requests made to the server while generating a web page. In turn, it makes a website load faster.

For example, let’s say we’ve included 10 JavaScript files on a web page. Now, when we open this web page then our web browser sends 10 HTTP requests to the server in order to retrieve these files. On the other hand, if we aggregate the code of all these files into one then we just need to make 1 request to the server.

5- What Is JavaScript Hoisting?

Hoisting is a concept in JavaScript which allows us to use variables and functions even before they are declared.

Basically, when we execute a JavaScript code then at first it automatically extracts all variable and function declarations from the code and moves them to the top of their scope. After that, it starts executing the code.

The major benefit of Hoisting is that our code works correctly and doesn’t display any errors like “undefined variable” or “undefined function”.

Learn more about hoisting with my article Understanding Variables, Scope, and Hoisting in JavaScript

6- Predict the Output of the following Code?

Code:-

username = "Juan Cruz Martinez";
var username; // variable declaration
var username; // redeclared the variable
console.log(username);

Output:-

Juan Cruz Martinez

Explanation:-

• First of all, the variable declaration at line # 2 and line # 3 will be considered as one statement.
• Now, the concept of hoisting will be applied. Meaning that JavaScript will move the variable declaration to the top. After that, the code will be executed.
• Also, remember that the value stored in a variable will not be lost even if we redeclare the variable.

7- What Is JavaScript &Ldquo;Strict Mode”?

The default behavior of JavaScript is very forgiving in case we make a minor mistake. It means that it will not display any error messages. But, sometimes in development, we need to see all kinds of errors and warnings to debug the code.

Here comes the use of “Strict Mode” in JavaScript. Basically, it’s a restricted variant where JavaScript displays all errors and warnings, even if they are silent ones.

We can enable “Strict Mode” by using the "use strict"; directive at the beginning of our script.

8- What Are Some Alternatives to Svelte?

Svelte is a front-end development framework for the JavaScript programming language. Some of its popular alternatives include:-

• React
• Vue.js
• Angular

9- What Are Self Invoking Functions?

Self Invoking Functions are a little different from normal functions because they are executed immediately where they were declared.

Normally, we first declare a function and later just call it. But, JavaScript automatically executes the code of Self Invoking Functions at run-time.

A point to be noted is that these functions do not have any name. In turn, we are unable to recall these types of functions. They are also known as “Anonymous Functions”.

Here’s an example of Self Invoking Functions.

(function (){
	var a = 12;
	var b = 3;
	console.log(a * b);
}());

10- What Is the Difference between &Ldquo;var”, &Ldquo;let”, and &Ldquo;const”?

Learn more about them with my article Understanding Variables, Scope, and Hoisting in JavaScript

11- What Is the Difference between &Ldquo;==” and &Ldquo;===”?

Both of them are used in JavaScript to perform a comparison between two values.

12- Is There Any Difference between &Ldquo;null” and &Ldquo;undefined” Keywords?

Both of these keywords represent an empty value. But, there are two basic differences between null and undefined.

13- Differentiate between &Ldquo;function Declaration” and &Ldquo;function Expression”?

Basically, Function Declaration is nothing but the normal process of defining a function using the keyword function, its unique name, parameters, and the function body. Whereas, when we assign a function declaration to a variable then it become Function Expression.

It is interesting to note that function expressions are not hoisted. Meaning that they will display an error if you try to call them before defining.

Function Declaration:-

function full_name(first_name, last_name)
{
	return first_name + " " + last_name;
}

Function Expression:-

var addition = function add(value_1, value_2)
{
	return value_1 + value_2;
}

14- What Is a Closure?

A closure in JavaScript is a function inside another function. The inner function has access to its own variables, the variables defined in the outer function as well as the global variables.

Closure Example:-

var a = 2;

function outer()
{
	var b = 4;
	
	function inner()
	{
		var c = 6;
		
		console.log(a + b + c);
	}
	
	inner();
}

outer();

15- Predict the Output of These Two Functions? Will They Return Same the Output or Not?

function user1()
{
	return {
		name: "Juan"
	};
}

function user2()
{
	return
	{
		name: "Juan"
	};
}

console.log(user1());
console.log(user2());

Output of Function user1()

{name: "Juan"}

Output of Function user2()

undefined

16- What Is NaN?

In JavaScript, NaN stands for “Not a Number”. It is a special value that occurs when we are unable to perform an operation.

For example, what if we try to divide a string using a number (e.g. “Hello World” / 5).

17- Explain the For-in Loop?

The for-in loop is specifically designed to loop through all the object’s properties in a step by step manner. It selects one property from the object in each iteration and performs the required operations on it.

Let’s try to understand it with the help of an example.

var user = {
	"name": "Juan",
	"country": "Germany",
	"website": "livecodestream.dev"
};

for(var key in user)
{
	if(user.hasOwnProperty(key))
	{
		console.log(key + " -> " + user[key]);
	}
}

Output:-

name -> Juan
country -> Germany
website -> livecodestream.dev

18- What Is Event Bubbling and Capturing?

In JavaScript DOM, HTML elements are nested inside one another to form a hierarchy.

Now, if both parent and child elements have registered a handle for a specific event then what will be the order of event propagation?

It can be determined in two ways which are known as event bubbling and capturing.

In event bubbling, the child element will capture the event first and then propagate it to parent elements. Whereas, in event capturing, the parent element will capture the event first and then propagate it to the child elements.

19- What Is the Difference between JavaScript and ECMA Script?

JavaScript is a scripting language whereas ECMA Script is a collection of guidelines and rules to standardize JavaScript across different web browsers.

20- How to Create a Cookie Using JavaScript?

In JavaScript, a cookie can be created using a document.cookie object. Simply assign it a string value that is just a series of key-value pairs separated with semi-colons.

JavaScript Create Cookie Example:-

document.cookie = "username=Juan; expires=Wed, 03 Oct 2030 12:00:00 UTC; path=/";

Conclusion

Employers usually try to confuse the applicants by asking tricky questions. So, if you are not well-prepared then chances are that you will end up losing the opportunity.

So, today, I tried to answer some commonly asked JavaScript Interview questions. You may even use it as a reference just before going to an interview.

Thanks for reading!

Juan Cruz Martinez

Juan has made it his mission to help aspiring developers unlock their full potential. With over two decades of hands-on programming experience, he understands the challenges and rewards of learning to code. By providing accessible and engaging educational content, Juan has cultivated a community of learners who share their passion for coding. Leveraging his expertise and empathetic teaching approach, Juan has successfully guided countless students on their journey to becoming skilled developers, transforming lives through the power of technology.