Top JavaScript interview questions and answers in 2024

JavaScript is a scripting language. It is different from the Java language. It is an object-based, lightweight, cross-platform translated language. It is widely used for client-side validation. The JavaScript Translator (embedded in the browser) is responsible for translating the JavaScript code for the web browser.

1. From the beginning, the 'var' keyword was used in JavaScript programming whereas the keyword 'let' was just added in 2015.
2. The keyword 'Var' has function scope. Anywhere in the function, the variable specified using var is accessible but in ‘let’ the scope of a variable declared with the 'let' keyword is limited to the block in which it is declared. Let's start with a Block Scope.
3. In ECMAScript 2015, let and const are hoisted but not initialized. Referencing the variable in the block before the variable declaration results in a ReferenceError because the variable is in a "temporal dead zone" from the start of the league until the declaration is processed.

JavaScript was developed by Brendan Eich, who was a Netscape programmer. Brendan Eich developed this new scripting language in just ten days in the year September 1995. At the time of its launch, JavaScript was initially called Mocha. After that, it was called Live Script and later known as JavaScript.

Some of the advantages of JavaScript are:

• Server interaction is less
• Feedback to the visitors is immediate
• Interactivity is high
• Interfaces are richer

Some of the disadvantages of JavaScript are:

• No support for multithreading
• No support for multiprocessing
• Reading and writing of files is not allowed
• No support for networking applications.

The function which has named at the time of definition is called a named function.

The types of functions are:

• Named - These type of functions contains a name at the time of definition.
• Anonymous - These type of functions doesn't contain any name. They are declared dynamically at runtime.

The variables of JavaScript represent the arguments that are passed to a function.

In JavaScript, we need closures when a variable which is defined outside the scope in reference is accessed from some inner scope.

Netscape provided the JavaScript language. Microsoft changed the name and called it JScript to avoid the trademark issue. In other words, you can say JScript is the same as JavaScript, but Microsoft provides it.

A simple example of JavaScript hello world is given below. You need to place it inside the body tag of the HTML.

<script type="text/javascript">  

document.write("JavaScript Hello World!");  

</script>  

BOM stands for Browser Object Model. It provides interaction with the browser. The default object of a browser is a window. So, you can call all the functions of the window by specifying the window or directly. The window object provides various properties like document, history, screen, navigator, location, innerHeight, and innerWidth.

The window object is created automatically by the browser that represents a window of a browser. It is not an object of JavaScript. It is a browser object.

The window object is used to display the popup dialog box. Let's see with the description.

The history object of a browser can be used to switch to history pages such as back and forward from the current page or another page. There are three methods of history object.

1. history.back() - It loads the previous page.
2. history.forward() - It loads the next page.
3. history.go(number) - The number may be positive for forward, and negative for backward. It loads the given page number.

There are two types of comments in JavaScript.

1. Single Line Comment: It is represented by // (double forward slash)
2. Multi-Line Comment: Slash represents it with an asterisk symbol as /* write a comment here */

There are two types of data types in JavaScript:

• Primitive data types
• Non- Primitive data types

Primitive data types

The primitive data types are as follows:

String: The string data type represents a sequence of characters. It is written within quotes and can be represented using a single or a double quote.

Example:

var str1 = "Hello JavaTpoint"; //using double quotes  

var str2 = 'Hello Javatpoint'; //using single quotes  

Number: The number data type is used to represent numeric values and can be written with or without decimals.

Example:

var x = 5; //without decimal  

var y = 5.0; //with decimal  

Boolean: The Boolean data type is used to represent a Boolean value, either false or true. This data type is generally used for conditional testing.

Example:

var x = 5;  

var y =  6;  

var z =  5;  

(x == y) // returns false  

(x == z) //returns true

BigInt: The BigInt data type is used to store numbers beyond the Number data type limitation. This data type can store large integers and is represented by adding "n" to an integer literal.

Example:

var bigInteger =  123456789012345678901234567890;  

// This is an example of bigInteger.  

Undefined: The Undefined data type is used when a variable is declared but not assigned. The value of this data type is undefined, and its type is also undefined.

Example:

var x; // value of x is undefined  

var y = undefined; // You can also set the value of a variable as undefined.  

Null: The Null data type is used to represent a non-existent, null, or invalid value i.e. no value at all.

Example:

var  x = null;  

Symbol: Symbol is a new data type introduced in the ES6 version of JavaScript. It is used to store an anonymous and unique value.

Example:

var symbol1 = Symbol('symbol'); 

typeof: The typeof operator is used to determine what type of data a variable or operand contains. It can be used with or without parentheses (typeof(x) or typeof x). This is mainly used in situations when you need to process the values of different types.

Example:

typeof 10;  // Returns: "number"  

typeof 10.0;  // Returns: "number"  

typeof 2.5e-4;  // Returns: "number"  

typeof Infinity;  // Returns: "number"  

typeof NaN;  // Returns: "number". Despite being "Not-A-Number"  

// Strings  

typeof '';  // Returns: "string"  

typeof 'Welcome to JavaTpoint';  // Returns: "string"  

typeof '12';  // Returns: "string". Number within quotes is typeof string  

// Booleans  

typeof true;  // Returns: "boolean"  

typeof false;  // Returns: "boolean"  

// Undefined  

typeof undefined;  // Returns: "undefined"  

typeof undeclaredVariable; // Returns: "undefined"  

// Null  

typeof Null;  // Returns: "object"  

// Objects  

typeof {name: "John", age: 18};  // Returns: "object"  

// Arrays  

typeof [1, 2, 3];  // Returns: "object"  

// Functions  

typeof function(){};  // Returns: "function"  

Non-Primitive data types

In the above examples, we can see that the primitive data types can store only a single value. To store multiple and complex values, we have to use non-primitive data types.

The non-primitive data types are as follows:

Object: The Object is a non-primitive data type. It is used to store collections of data. An object contains properties, defined as a key-value pair. A property key (name) is always a string, but the value can be any data types, such as strings, numbers, and Booleans, or complex data types like arrays, functions, and other objects.

Example:

// Collection of data in key-value pairs  

var obj1 = {  

   x:  123,  

   y:  "Welcome to JavaTpoint",  

   z: function(){  

      return this.x;  

   }  

}  

Array: The Array data type is used to represent a group of similar values. Every value in an array has a numeric position, called its index, and it may contain data of any data type numbers, strings, Booleans, functions, objects, and even other arrays. The array index starts from 0 so that the first array element is arr[0], not arr[1].

Example:

var colors = ["Red", "Yellow", "Green", "Orange"];  

var cities = ["Noida", "Delhi", "Ghaziabad"];  

alert(colors[2]);   // Output: Green  

alert(cities[1]);   // Output: Delhi  

The == operator checks equality only whereas === checks equality, and data type, i.e., a value must be of the same type.

The isNan() function returns true if the variable value is not a number. 

For example:

function number(num) {  

  if (isNaN(num)) {  

    return "Not a Number";  

  }  

  return "Number";  

}  

console.log(number('1000F'));  

// expected output: "Not a Number"  

console.log(number('1000'));  

// expected output: "Number"

The innerHTML property is used to write the HTML code using JavaScript dynamically. Let's see a simple example:

document.getElementById('mylocation').innerHTML="<h2>This is heading using JavaScript</h2>"; 

The innerText property is used to write the simple text using JavaScript dynamically. Let's see a simple example:

document.getElementById('mylocation').innerText="This is text using JavaScript";   

There are 3 ways to create an object in JavaScript.

1. By object literal
2. By creating an instance of Object
3. By Object Constructor

Let's see a simple code to create an object using object literal.

emp={id:102,name:"Rahul Kumar",salary:50000}   

There are 3 ways to create an array in JavaScript.

1. By array literal
2. By creating an instance of Array
3. By using an Array constructor

Let's see a simple code to create an array using the array literal.

var emp=["Shyam","Vimal","Ratan"];

Client-side JavaScript comprises the basic language and predefined objects which are relevant to running JavaScript in a browser. The client-side JavaScript is embedded directly in the HTML pages. The browser interprets this script at runtime.

Server-side JavaScript also resembles client-side JavaScript. It has relevant JavaScript which is to run on a server. The server-side JavaScript is deployed only after compilation.

The storage of cookies on the hard disk depends on the OS and the browser.

The Netscape Navigator on Windows uses a cookies.txt file that contains all the cookies. The path is c:\Program Files\Netscape\Users\username\cookies.txt

Internet Explorer stores the cookies on a file username@website.txt. The path is c:\Windows\Cookies\username@Website.txt.

In JavaScript, the event.preventDefault() method is used to prevent the default behavior of an element.

For example: If you use it in a form element, it prevents it from submitting. If used in an anchor element, it prevents it from navigating. If used in a context menu, it prevents it from showing or displaying.

On the other hand, the event.stopPropagation() method is used to stop the propagation of an event or stop the event from occurring in the bubbling or capturing phase.

"View state" is specific to a page in a session whereas "Session state" is specific to a user or browser that can be accessed across all pages in the web application.

The navigator.appVersion string can be used to detect the operating system on the client machine.

By the help of try/catch block, we can handle exceptions in JavaScript. JavaScript supports try, catch, finally and throw keywords for exception handling.

JavaScript didn't show any error message in a browser. However, these mistakes can affect the output. The best practice to find out the error is to debug the code. The code can be debugged easily by using web browsers like Google Chrome, and Mozilla Firebox.

To perform debugging, we can use any of the following approaches:

• Using console.log() method
• Using debugger keyword

The JavaScript strict mode is used to generate silent errors. It provides the "use strict"; expression to enable the strict mode. This expression can only be placed as the first statement in a script or a function.

DOM stands for Document Object Model. A document object represents the HTML document. It can be used to access and change the content of HTML.