28 Sample Interview Questions for JavaScript Developers | Theory and Practice

If you’re looking for JavaScript interview questions, chances are you’re either a tech recruiter or a prospective candidate looking for a job in JavaScript development. In this article, we’ve brushed over some theoretical questions covering the fundamentals of JavaScript, as well as gathered some sample practice coding interview questions.

JavaScript Theory Basics
JavaScript Practice Questions

JavaScript Theory Basics

What is JavaScript? What common features of JS can you name?

Answer: JavaScript is an object-oriented programming language as well as client- and server-side scripting language that can be inserted into web pages to make them interactive.

Common JS features include a standard library of objects (Array, Date, Math) and a core set of language elements (operators, control structures, statements).

Client-side JavaScript extends the core language by supplying objects to control a browser and its Document Object Model (DOM).

Server-side JavaScript extends the core language by supplying objects relevant to running JS on the server side.

What’s the relationship between JavaScript and ECMAScript?

Answer: ECMAScript is a scripting-language specification that was created to standardize JavaScript.

Is JS case sensitive?

Yes, it is. For example, myvar is not the same as myVar

What JS frameworks can you name? Define each.

Answer: There are numerous JS frameworks and libraries available. For example, Angular (and AngularJS), JQuery, React, Vue.js

AngularJS is a client-side JavaScript framework based on MVC architecture; it simplifies web development by offering automatic view/model synchronization. Main language: JavaScript

Angular (or Angular 2+) is a complete rework of the whole Angular framework. Main language: TypeScript

JQuery is a feature-rich JavaScript library that makes HTML document traversal and manipulation, event handling, animation, and Ajax simpler with an easy to use API.

React is a JavaScript library for building user interfaces specifically for single page applications and handling view layer for web and mobile apps.

Vue.js is a JavaScript library (framework) for building modern web interfaces and which is focused on the ViewModel layer of the MVVM pattern.

What JS testing frameworks can you name? Define each.

Answer: Jest is a JavaScript unit testing framework that allows testing all JavaScript code including React applications.

Mocha is a JavaScript test framework running on Node.js and in the browser. Mocha runs tests serially, mapping uncaught exceptions to the correct test cases.

Karma is a JavaScript test framework running on Node.js which allows executing JavaScript code in multiple real browsers. Karma is highly configurable and integrates with popular CI packages.

What are JS Data Types?

Answer: JS Data Types or types of JS values include numbers, strings, booleans, objects, undefined, null, and symbol (in ES6). All types except the object are primitive (can only hold a single value).

What are logical operators and how many of them you can name?

Answer: There are three main logical operators in JS: and, or, and not.

Operator && means and. It’s a binary operator that would be true only if two values are true:

console.log(true && true)
// → true

Operator ||means or. It yields true if any of the given values are true:

console.log(false || true)
// → true

! means Not. It’s a unary operator that flips the value given to it, for example, !true means false and !false gives true.

There’s also a ternary operator (or conditional) that operates on three values: ?:
For example,

console.log(true ? 1 : 2);
// → 1

The ternary operator picks the middle value when it’s true, and when it’s false – value on the right.

What’s the difference between undeclared and undefined variables?

Answer: Undeclared are those variables that are not declared, therefore do not exist in a program; whereas undefined are those variables that are declared but have not been given or assigned any value.

What’s the difference between == and === operators?

Answer: == checks equality in values
=== checks stricter equality: returns false if either the value or the type of the variables are different

The first operator, ==, uses Abstract Equality Algorithm, thus if operands are of different types, it will convert them into the same type for comparison. For example, 5 == '5', the string will be converted to Number. And === operator uses Strict Equality Comparison Algorithm, thus if operands are of different types, then the result will always be false.

What’s a function in JavaScript?

Answer: Function is a JavaScript procedure—a set of statements that performs a task or calculates a value. To execute a function is to apply or invoke it. Values, called arguments, are assigned inside the function. Depending on types of functions, they can hold a different number and types of arguments.

What are the looping structures?

Answer: In JS the looping structures are: for, while, and do while loops. Loops are interaction statements that allow doing something repeatedly.

For example, for loop continues until a specified condition evaluates as false:

for (var i = 0; i <5; i++) {
  console.log(i);
}
// → 0, 1, 2, 3, 4

What is null in JavaScript?

Answer: null is a primitive value in JavaScript and represents the intentional absence of any object value. For example:

var var1 = null;
console.log(null === undefined)
// → false

Explain the difference between pop() method and shift()?

Answer: pop() method removes the last element from an array and returns that element.
shift() method removes the first element from an array and returns that removed element.

For example:

var array1 = [1, 2, 3];
var firstElement = array1.shift();
console.log(array1);
// → Array [2, 3]

And

var plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];
console.log(plants.pop());
// → "tomato"

What type of errors are there in JavaScript?

Answer: Load time errors are errors that come up when loading a web page (e.g. improper syntax).
Run time errors are errors that occur during execution (after compilation/interpretation).
Logical errors are errors that come up due to bad logic performed on a function.

Define the “Strict” mode in JavaScript

Answer: Strict mode adds more compulsions to JavaScript language: stricter syntax is employed.

To activate strict mode, put “use strict” above the file:

“use strict”;
var var1 = 7;
console.log(var1);

What is the difference between .call() and .apply()?

Answer: .call() is used when the number of the function’s arguments are known; call() accepts an argument list; whereas .apply() is used when this number is unknown; apply() accepts a single array of arguments. For example:

var numbers = [5, 6, 2, 4, 9];
var min = Math.min.apply(null, numbers);
console.log(min);
// → 2

And

function Product(name, price) {
  this.name = name;
  this.price = price;
}
function Food(name, price) {
  Product.call(this, name, price);
  this.category = 'food';
}
console.log(new Food('carrot', 1).name);
// → "carrot"

How are DOM utilized in JS?

Answer: DOM (Document Object Model) is an API that represents and interacts with any HTML or XML document. Basically, DOM is responsible for how various objects in a document interact with each other. DOM is the way JS sees its containing page’s data; it’s an object that includes information about how HTML/XML is formatted and the browser state.

How are event handlers utilized in JS?

Answer: An event handler manages proper execution of the events (clicking a link, filling a form, etc. in the browser). Event handlers are extra attributes of the object. The attribute includes the event’s name and action taken.

For example,

window.addEventListener("click", function() {
  console.log("You clicked?");
});

JavaScript Practice Questions

What will be the output of the following code?

var word = 'name = tag';
var result = word.replace(/\W/g, '').split('').reverse().join('');
console.log(result);

Answer: gateman

(deleting all characters except letters, split to an array, reversing elements, join to a string)

What will be the output of the following code?

console.log(typeof typeof null);

Answer:string

typeof null will return "object" and typeof "object" will return "string".

What will be the output of the following code?

var b = 5;
(function(){
  var a = b = 3;
  a++;
  console.log('b = ' + b);
})();
console.log('b = ' + b);

Answer:
b = 3
b = 3

Consider the two functions below. Will they both return the same thing? Why or why not?

function f1()
{
  return {
    important: "data"
  };
}

function f2()
{
  return
  {
    important: "data"
  };
}

Answer: Bad syntax

f1 returns:
Object {important: “info”}
f2 returns:
undefined

What will be the output of the following code? Explain your answer.

console.log(0.1 + 0.6 == 0.8 - 0.1);

Answer: false
0.1 + 0.6 // 0.7
0.8 – 0.1 // 0.7000000000000001

Write a sum method which will work properly when invoked using either syntax below.

console.log(multiply(5,7));   // Outputs 35
console.log(multiply(5)(7));  // Outputs 35

Answer:

METHOD 1

function multiply(x) {
  if (arguments.length == 2) {
    return arguments[0] * arguments[1];
  } else {
    return function(y) { return x * y; };
  }
}

METHOD 2

function multiply(x, y) {
  if (y !== undefined) {
    return x * y;
  } else {
    return function(y) { return x * y; };
  }
}

What will be the output of the following code?

function recursion(n) {
  return (n < 10) ? n : n % 10 + recursion(Math.floor(n / 10));
}
console.log(recursion(123));

Answer: 6

Recursive function that finds the sum of digits of a number.
Each time the function is called, the last digit is taken, and the rest of the number is returned to the function again.

Write a counter method which will work properly as in the code below.

var inc = counter(5);
console.log(inc()); // Outputs 6
console.log(inc()); // Outputs 7

Answer: Using closure

function counter(n) {
  var count = n;
  return function() {
    return count += 1;
  }
}

What is the output out of the following code? Explain your answer.

var x={x:'x'},
    y={y:'y'},
    z={z:'z'};

x[y]='y';
x[z]='z';

console.log(x[y]);

Answer: The output of this code will be z
(not y).

What will be the output of this code?

var x = 30;
var age = function () {
  console.log(x);
  var x = 20;
};
age();

Answer:undefined

Having covered the sample interview questions for JavaScript developers, we’re pretty confident you’re on the way to success to prepare for both theoretical and practical coding questions. We’ll continue the series and add even more questions covering various aspects of JavaScript development, and popular frameworks in the future articles.