Top 20 JavaScript Interview Questions

JavaScript remains the foundation of modern web development.

Even with powerful frameworks like React and Next.js, companies still evaluate developers based on core JavaScript knowledge during interviews.

Understanding JavaScript deeply helps developers write cleaner code, debug faster, and build scalable applications.

In this guide, we’ll go through 20 important JavaScript interview questions every developer should know, along with practical explanations.

⚡ Why JavaScript Fundamentals Still Matter

Frameworks change constantly.

But strong JavaScript fundamentals help you:

• Understand how frameworks actually work

• Debug complex issues

• Write performant applications

• Pass technical interviews confidently

Let’s explore some of the most common questions developers encounter.

1. What is the difference between var, let, and const?

These are used to declare variables in JavaScript.

var

• Function scoped

• Can be redeclared

• Hoisted with undefined

let

• Block scoped

• Cannot be redeclared in the same scope

const

• Block scoped

• Cannot be reassigned after initialization

var a = 10
let b = 20
const c = 30

2. What is a Closure?

A closure is a function that remembers variables from its outer scope even after the outer function has executed.

function outer() {
  let count = 0

  return function inner() {
    count++
    console.log(count)
  }
}

const counter = outer()
counter() // 1
counter() // 2

Closures are commonly used for:

• Data privacy

• Callbacks

• Functional programming

3. What is Hoisting?

Hoisting means JavaScript moves variable and function declarations to the top of their scope during compilation.

console.log(a)
var a = 5

Output:

undefined

4. What is the difference between == and === ?

== performs type coercion.

=== performs strict comparison.

5 == "5"   // true
5 === "5"  // false

Most developers prefer strict equality to avoid unexpected bugs.

5. What is the Event Loop?

JavaScript runs on a single thread, but it can still handle asynchronous operations through the event loop.

The event loop manages:

• Call stack

• Web APIs

• Callback queue

This allows JavaScript to handle things like:

• API calls

• Timers

• Promises

6. What is a Promise?

A Promise represents the result of an asynchronous operation.

It has three states:

• Pending

• Fulfilled

• Rejected

const promise = new Promise((resolve, reject) => {
  setTimeout(() => resolve("Done"), 1000)
})

promise.then(result => console.log(result))

7. What is async/await?

async/await is a cleaner way to work with Promises.

async function fetchData() {
  const response = await fetch("/api/data")
  const data = await response.json()
  return data
}

This makes asynchronous code easier to read.

8. What is the difference between map() and forEach()?

Both are array methods.

map()

• Returns a new array

forEach()

• Executes a function but returns nothing

const numbers = [1,2,3]

const doubled = numbers.map(n => n * 2)

9. What is the this keyword?

this refers to the object executing the current function.

const user = {
  name: "Alex",
  greet() {
    console.log(this.name)
  }
}

10. What is a Callback Function?

A callback is a function passed as an argument to another function.

function greet(name, callback) {
  console.log("Hello " + name)
  callback()
}

greet("John", () => {
  console.log("Welcome!")
})

11. What is Debouncing?

Debouncing limits how often a function executes.

Used in:

• search inputs

• resize events

• scroll events

function debounce(fn, delay) {
  let timer

  return function() {
    clearTimeout(timer)
    timer = setTimeout(fn, delay)
  }
}

12. What is Throttling?

Throttling ensures a function runs at most once in a given time interval.

This helps improve performance for frequent events.

13. What is the difference between null and undefined?

undefined

• Variable declared but not assigned

null

• Intentional empty value

let a
let b = null

14. What are Arrow Functions?

Arrow functions provide a shorter syntax for writing functions.

const add = (a, b) => a + b

They also do not bind their own this value.

15. What is Destructuring?

Destructuring allows extracting values from arrays or objects easily.

const user = { name: "John", age: 25 }

const { name, age } = user

16. What is the Spread Operator?

Spread syntax expands arrays or objects.

const arr1 = [1,2]
const arr2 = [...arr1, 3,4]

17. What is the Rest Operator?

Rest collects multiple elements into one array.

function sum(...numbers) {
  return numbers.reduce((a,b) => a+b)
}

18. What is Local Storage?

Local Storage allows storing data in the browser.

localStorage.setItem("name", "John")

19. What is JSON?

JSON stands for JavaScript Object Notation and is used for data exchange.

const json = JSON.stringify({ name: "John" })

20. What is the Difference Between Synchronous and Asynchronous Code?

Synchronous

• Executes line by line.

Asynchronous

• Allows operations like API calls to run without blocking execution.

setTimeout(() => {
  console.log("Async task")
}, 1000)

Final Thoughts

Mastering JavaScript fundamentals is essential for every web developer.

Strong knowledge of concepts like:

• closures

• asynchronous programming

• scope

• event loop

helps developers build better applications and perform well in technical interviews.

Before diving deep into frameworks like React or Next.js, invest time in understanding core JavaScript concepts.

It will pay off throughout your entire development career.