Javascript interview questions can be helpful when you are going to appear for an interview. These can be a quick refresher for you just before the interview. In this article, we will explore some common interview questions and answers that can be asked in your next interview.

1. What is IIFE?

IIFE stands for Immediately Invoked Function Expression. It is a javascript function that runs as soon as it is defined.

The syntax of IIFE is as follows:

(function() {
       // Logic
})();

In the following example, IIFE is created to log message on the screen.

(function() {
     let message = 'IIFE';
     console.log(message);
});

2. What is the difference between undeclared and undefined variables?

Undeclared variables do not exist in a program and are not declared. If you try to read the value of an undeclared variable, then a runtime error is encountered.

Undefined variables are declared in the program but have not been assigned any value. If you try to read the value of an undefined variable, an undefined value is returned.

3. What is Callback?

A callback is a function passed into another function as an argument? This function is invoked inside another function to complete an action.

function callbackFunc(name) {
     console.log("Hello " + name)'
}
function displayName(callback) {
     let name = prompt('Please enter your name');
     callback(name);
}
displayName(callbackFunc);

Callbacks are mainly used in scenarios where we need to make sure that certain code does not execute until the other code is finished execution.

4. What is the difference between isNaN and Number.isNaN?

isNaN – This function converts the argument to a number and returns true if the resulting value is not a number.

Number.isNaN – This method does not convert the argument but it returns true when the type is a number and the value is not a number.

isNaN("hello"); // True
Number.isNaN("hello"); // false

5. What is the difference between for..in and for..of?

for..in loop is used to iterate over the enumerable properties of an object. It iterates over the keys of an object. for..in is only for iterating plain objects and their keys, not for iterating the items in an array.

const obj = { a: 1, b: 2, c: 3 };
for (const key in obj) {
  console.log(key);  // Outputs: "a", "b", "c"
}

for..of is used to iterate over the values of an iterable object (e.g., arrays, strings, maps, sets, etc.). It directly iterates over the values, not the keys.

const arr = [1, 2, 3];
for (const value of arr) {
  console.log(value);  // Outputs: 1, 2, 3
}

6. What’s the difference between an “attribute” and a “property”?

Attributes are usually associated with HTML elements and represent the initial values defined in the HTML markup. They don’t necessarily represent the current state of an element.

In the below example, the value attribute of an input element represents its initial value, but accessing the value property using JavaScript would give you the current user-inputted value.

<input id="myInput" type="text" value="Initial Value">

Properties are the actual values that are used in the DOM manipulation. They represent the current state of the element.

For example, using JavaScript, you can access and manipulate the value property of an input element to get or set its current value.

const inputElement = document.getElementById("myInput");
console.log(inputElement.value); // Outputs the current value of the input
inputElement.value = "New Value"; // Changes the value of the input

7. What’s the difference between a variable that is: null, undefined, or undeclared?

null means nothing or no value, it could be used as a placeholder.

undefined means it was declared but it wasn’t assigned a value.

undeclared means it doesn’t exist or hasn’t been declared yet.

To check if a variable is null or undefined, you can use triple equality. You can’t check undeclared because it doesn’t exist.

8. Difference between: function Person(){}, var person = Person(), and var person = new Person()?

function Person(){} is a constructor function or a factory function.

var person = Person() is a syntax to create a new Object from a factory function.

var person = new Person() a new object created by a constructor using the new operator keyword.

9. Explain the difference between mutable and immutable objects.

Mutable means changeable. If the state of the object can be changed this means it is mutable, if it can’t be changed then it is Immutable.

10. What is the difference between function scope and block scope in JavaScript?

Function scope refers to the visibility and accessibility of variables defined within a function throughout the entire function. Variables declared using the var keyword are function-scoped. This means that these variables are accessible within the function in which they are declared, regardless of where within the function they are declared.

function getValue() {
  var x = 10;
  if (true) {
    var y = 20;
  }
  console.log(x); // Output: 10
  console.log(y); // Output: 20
}

In the above example, both x and y are accessible throughout the getValue due to their function scope.

Block scope refers to the visibility and accessibility of variables defined within a block of code, such as inside a loop, conditional statement, or block defined using the let or const keywords. Variables declared using let and const are block-scoped. This means that they are only accessible within the block in which they are defined.

function getValue() {
  if (true) {
    let x = 10;
    const y = 20;
    console.log(x); // Output: 10
    console.log(y); // Output: 20
  }
  console.log(x); // Error: x is not defined
  console.log(y); // Error: y is not defined
}

In the above example, x and y are only accessible within the if block where they are defined. They are not accessible outside of that block.

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

== operator is used to compare the values of two operands for equality. It performs type coercion, which means it converts the operands to a common type before making the comparison.

5 == "5" // true, because JavaScript coerces the string to a number before comparison

=== operator also known as strict equality operator. It compares both values and types of two operands for equality. It does not perform type coercion. Both the values and the types of the operands must match exactly for the comparison to be true.

5 === "5" // false, because the types (number and string) are different

12. What would be the result of 2+5+”3”?

In this expression, the first 2 + 5 is calculated to 7. 3 is a string, the number 7 will be converted to a string and 7 & 3 both are concatenated. The result will be 73.

13. How do you convert a string to an int?

In JavaScript, you can convert a string to an integer using the parseInt() function. The parseInt() function takes a string as its argument and attempts to parse it into an integer.

var str = "42";
var integerVal = parseInt(str); // Converts the string "42" to the integer 42

Other Examples parseInt() are :

var str1 = "42";
var intValue1 = parseInt(str1); // 42

var str2 = "42abc";
var intValue2 = parseInt(str2); // 42

var str3 = "abc42";
var intValue3 = parseInt(str3); // NaN

var str4 = "1010"; // Binary string
var intValue4 = parseInt(str4, 2); // 10 (parsed as binary)

var str5 = "0xFF"; // Hexadecimal string
var intValue5 = parseInt(str5, 16); // 255 (parsed as hexadecimal)

14. How do you add an element at the beginning of an array? How do you add one at the end?

In JavaScript, you can add an element at the beginning of an array using the unshift() method, and you can add an element at the end of an array using the push() method.

// Adding an element at the beginning of an array
const a = [2, 3, 4];
const element = 1;
a.unshift(element);

console.log(a); // Output: [1, 2, 3, 4]

// Adding an element at the end of an array
const b = [1, 2, 3];
const element = 4;
b.push(element);

console.log(b); // Output: [1, 2, 3, 4]

The unshift() method adds the specified element(s) to the beginning of the array and returns the new length of the array. The push() method adds the specified element(s) to the end of the array and returns the new length of the array.

15. What is Strict Mode in JavaScript? Why do you need it?

Strict mode is a feature in ECMAScript 5 that allows you to place a program, or a function in a “strict” operating context. Strict mode is useful to write “secure” JavaScript by notifying “bad syntax” into real errors.

16. Why do you need Promises in JavaScript?

Promises are used to handle asynchronous operations. They provide an alternative approach to callbacks by reducing callback hell and writing cleaner code.

17. What is a Unary function?

A unary function is a function that accepts exactly one argument. Ex.

const unary = (a) => console.log(a);