20 JavaScript Job Interview Questions to Know with Answers
Tags: webdev, javascript, beginners, programming
Published: 2021-05-03 22:50:03



You applied for a job as a web developer few days back. An interview was scheduled and you're worried that your knowledge of JavaScript is sub-par. 

If that is the case, well you're in luck! If not, you are still going to gain some information for any future interviews you are part of.

Below are 20 common job interview questions on JavaScript, along with their respective answers:

### What is JavaScript

Well let's be honest, You probably will be thinking this is such an easy question. But you may be surprised at how bad you'll fumble when trying to explain what JavaScript is to your potential boss. JavaScript is  the language used to write programs on websites and web apps. 

### What is the DOM
The Document Object Model (DOM) is a tree-like, top down representation of your web page and all it's elements. 

![Alt Text](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/bwqm3v7nwavmni35za6j.png)

### Mention 5 JavaScript methods for DOM manipulation and explain their uses

-  **createElement()**: This method creates a new HTML element in the web page. It takes a single parameter, which is the name of the element to be created.

- **querySelector()**: this method is used to target elements based on any CSS selector. It always returns the first element that matches one or more CSS selectors. It takes the selector as parameter.

- **querySelectorAll()**: while querySelector returns only the first instance that matches, this method returns all the elements that matches one or more CSS selectors. The elements are returned in a nodelist, which is similar to a JavaScript object.

- **getElementById()**: as it's name suggests, this method gets an element based on it's unique id attribute.

- **addEventListener()**: This method attaches an event listener to an element in the DOM. It takes a function as an additional parameter. When that element gets triggered by the set event, the callback function will run.

### What are Variables
All programming languages work with data and variables are simply containers for that data. When assigned to a variable, that data becomes the 'value'

``` javascript
var variable = value
```

### Define and explain the variable declarations in JavaScript

The difference between var, let, and const in JavaScript:

**Var**
- It is globally scoped
- When used to define a variable within a function, that variable is inaccessible outside that function
- It is reassignable
- It's not block scoped

**Const**
- It is used to store immutable/unchanging values.
- It is not globally scoped
- When used to define a variable within a function, that variable is inaccessible outside that function
- It is block scoped. That is, it's inaccessible outside blocks like if conditionals and for loops.


**Let**
- It is not globally scoped
- It is reassignable
- When used to define a variable within a function, that variable is inaccessible outside that function
- It is block scoped.


> 
N/B: If you're interested in learning more about modern JavaScript, I'll recommend  [HTML To React,: The Ultimate Guide by Sleepless Yogi](https://gumroad.com/a/834147443) 


### What is Asynchronous programming

Asynchronous programming is the principle of making code run later and not immediately/sequentially. This is achieved with Callbacks, Promises and other Async patterns.

### Explain Global scoping and local scoping

- Global variables can be accessed from anywhere in the script.

- Local variables, on the other hand, have function scoping. This means that a variable define in a function is not accessible outside that function. 



### What is Node.js and what does it do

Node.js is an open-source, cross-platform, back-end JavaScript runtime environment that runs on the V8 engine for executing JavaScript code. Remember that before JavaScript used to run only on browsers. You couldn't run JavaScript in any other environments. However, with the coming of Node.js, you could now run JavaScript on web servers independent of a web browser.

### List all the data types in JavaScript
 - String
 - Number
 - Boolean
 - Null
 - Object
 - Undefined
 -  Symbol (ES6)

###  What is Currying
Currying is a technique which happens when you take a function that would require multiple arguments and return a series of functions that take exactly one argument

``` javascript
const program = { 
name: 'Presenting Research', 
room: '415', 
hours: '3 - 6', 
}; 
const exhibit = { 
name: 'Emerging Scholarship', 
contact: 'Dyan', 
}; 

const setStrongHallProgram = program => { 
const defaults = { 
hours: '6 a.m. - 6 p.m.', 
address: 'jally Ave', 
name: 'kingsley', 
phone: '555-555-5555' 
} 
return { ...defaults, ...program} 
} 
const programs = setStrongHallProgram(program); 
const exhibit = setStrongHallProgram(exhibit);
```

### List and explain all array iterator methods

**Map()**: This method loops through an array and always returns an array. You can then define some action which will be applied to all items in the array. For example, you could say that all numbers in an array be divided by two.

**filter ()**: This method loops through an array collection and returns another array based on the filter condition. For example, you say that it should filter only ages which is below 50 and all numbers above 50 will not be included.

**find ()**: This is quite similar to filter(). The main difference is that this method returns only the first instance that matches the condition. Every subsequent match will be ignored.

**sort()**: This method loops through an array and returns another re-ordered array. The new order is based on the condition stipulated. For example, you can sort all names alphabetically, either in an ascending or descending order.

**forEach()**: This method loops through an array and performs a consistent action on all items in it. It doesn't return a new array. 

**reduce()**: This method is used to  transform an array into a completely new one, making radical changes to it.


### List any 5 new features you know in ES6

- JavaScript Classes

- Arrow functions

- Introduction of let and const keywords for variable declarations.

- The for/of loop. 

- Default Parameter

- Rest and Spread Operators


### What is React
React is a modern, u opinionated JavaScript library used to build modular and resusable UI Components like buttons as well as single-page applications. React utilitizes the virtual DOM.

### What is the virtual DOM

A virtual DOM is a lightweight JavaScript representation of the DOM used in declarative web frameworks such as React and Vue.js, . Updating the virtual DOM is comparatively faster than updating the real DOM, since nothing has to be rendered onto the screen. 

### What are classes. Write a typical syntax for defining a class

Classes are blueprints for objects.  To illustrate, you can think of an architectural plan for a building as a class, and the final building gotten from that plan as an object. The architectural plan won't have properties such as its color, kind of furniture to be used etc. All of those properties will be supplied when "constructing" the building, which is the object.

``` javascript
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
  // Getter
  get area() {
    return this.calcArea();
  }
  // Method
  calcArea() {
    return this.height * this.width;
  }
}
```

### What are Objects
When a class gets "instantiated", an object is constructed. Objects are data structures which have attributes that came in name: value pairs.



### Distinguish arrow function from named function

``` javascript
namedFunction() {
  console.log("this is a named function")
}

() => {
console.log("This is an arrow function")
}
```

### What are Libraries
Libraries are already-made packages of code/modules which can be imported into another program to perform a specific task.

Example of this is lodash, which contains a set of utility functions for some common tasks in programming like sorting etc.

### What is Typescript and when should I use it

Typescript is a superset of JavaScript; it contains all of JavaScript's syntax plus some additional functionality. It is used to write strongly typed JavaScript with type checking mechanisms.

### Buy me a pineapple 😋 
Yep! If you liked this article, I'll appreciate you buying me my favorite fruit:

<a href="https://www.buymeacoffee.com/ubahthebuilder"><img src="https://img.buymeacoffee.com/button-api/?text=Buy me a pineapple&emoji=🍍&slug=ubahthebuilder&button_colour=e0b51a&font_colour=000000&font_family=Cookie&outline_colour=000000&coffee_colour=FFDD00"></a>

**Thank you!**

*See you soon!*