This section includes 7 InterviewSolutions, each offering curated multiple-choice questions to sharpen your Current Affairs knowledge and support exam preparation. Choose a topic below to get started.
| 1. |
ES5 Vs ES6: What is the Difference |
||||||||||||
|
Answer» ECMAScript 5 (ES5P): Because it was launched in 2009, ES5 is also known as ECMAScript 2009. It has functions where developers concentrate on how items are created. In ES5, you must use the function keyword and return to define the function, just as you would in any other JavaScript language. ECMAScript 6 (ES6): Because it was launched in 2015, ES6 is also known as ECMAScript 2015. Its class allows developers to create an object with the new operator and an arrow function if they don't need to use the function keyword to specify the function, and they can also avoid using the return keyword to get the computer value. The key differences between ES5 and ES6 are as shown below:
As a programming language, JavaScript is gaining popularity. Because of its proven track record and benefits, it is becoming the language of choice for developing web properties. JavaScript based libraries like React, Angular, Nest, etc. are becoming popular day by day because of the ease with which they allow users to use JavaScript to build applications. We have compiled several of the most basic and important operators, functions, principles, and methods in the JavaScript cheat sheet above. It gives both experienced developers and beginners a good introduction of the language and serves as a reference. We hope you found it informative. Useful Resources:
|
|||||||||||||
| 2. |
JavaScript Error Handling |
|
Answer» Various types of errors occur when we are coding in JavaScript. There are a few options for dealing with them:
JavaScript possesses its own inbuilt error object which has the following properties:
There are six types of ways in which the error property can return its name. They are as follows:
|
|
| 3. |
JavaScript Memory Allocation and Event Loop |
|
Answer» In JavaScript, memory allocation is done in the following regions:
The function stack is a function that maintains track of all other functions that are running at the same time. An example to illustrate it is as follows: function second() {console.log("Second") } function First() { second() } function foo() { first() } foo() The order in which functions are executed, that is. when they are popped out of the stack once their purpose is completed, is as follows:
The callback function in the event queue has not yet started and is waiting for its time to be added to the stack when SetTimeOut() is called and the Web API waits. The function is loaded onto the stack when the function stack becomes empty, as seen below: The event loop is used to take the first event from the Event Queue and place it on the stack, which in this case is the callback function. If this function is called from here, it will call other functions within it. |
|
| 4. |
Asynchronous JavaScript |
|
Answer» A number of Web API features now use asynchronous code for running, especially those that access or fetch a resource from external devices, for instance, retrieving files from the network, accessing some database and returning data to it, accessing a video stream from a webcam, or broadcasting the display to a VR headset. There are two ways in which asynchronous coding can be done in JavaScript:
alert('Button has been clicked!'); let paraElement = document.createElement('p'); paraElement.textContent = 'A new paragraph.'; document.body.appendChild(paraElement); }); The first parameter specifies the type of event to be listened for, while the second specifies a callback function to be called when the event occurs. When we give a callback function as an input to another function, we are merely passing the function's reference; the callback function isn't immediately performed. It is asynchronously "called back" (thus the name) somewhere within the containing function's body. When the time comes, the contained function is in charge of calling the callback function.
return res.json(); }).then(function(json) { let item = json; initialise(item); }).catch(function(e) { console.log('Fetch error: ' + e.message); }); Here, fetch() takes a single argument: the URL of a network resource we wish to fetch and a promise is returned. A promise is an object that represents whether the async operation succeeded or failed. In a sense, it reflects a transitional condition. In essence, it's the browser's way of saying, "I promise to respond as quickly as I can," hence the name "promise." fs.readdir(source, function (error, file) { if (error) { console.log(Problem occurred while finding file: ' + error) } else { file.forEach(function (filename, fileIndex) { console.log(filename) gm(source + filename).size(function (error, value) { if (error) { console.log(Problem occurred while identifying file size: ' + error) } else { console.log(filename + ' : ' + value) aspect = (values.width / values.height) widths.forEach(function (width, widthIndex) { height = Math.round(width / aspect) console.log('resizing ' + filename + 'to ' + height + 'x' + height) this.resize(width, height).write(dest + 'w' + width + '_' + filename, function(error) { if (error) console.log('Problem occurred while writing file: ' + error) }) }.bind(this)) } }) }) } }) |
|
| 5. |
JavaScript Event Propagation |
|
Answer» Event propagation is a technique that governs how events propagate or travel through the DOM tree to reach their destination, as well as what happens to them once they arrive. Consider the following scenario: you have been given a click event handler to a hyperlink (i.e. <a> element) that's nested inside a paragraph (i.e. <p> element). The handler will now be executed if you click on that link. However, if you set the click event handler to the paragraph containing the link instead of the link, the handler will be triggered regardless of whether the link is clicked. Because events go up and down the DOM tree to reach their target, they don't merely affect the target element that triggered the event. This is known as event propagation. When an event is fired on an element with parent elements, the above picture shows how the event travels through the DOM tree at different stages of the event propagation. Event propagation in current browsers is divided into two phases: capturing and bubbling.
|
|
| 6. |
JavaScript Events |
|
Answer» Things that can happen to HTML components and are executed by the user in JavaScript are called events. These events can be detected by the programming language, which can then be used to activate code actions. Without them, no JavaScript cheat sheet would be complete. Let us take a look at some of the events supported by JavaScript:
|
|
| 7. |
JavaScript Browser Objects |
|
Answer» JavaScript is also capable of taking note of the user's browser activity and incorporating its properties into the code, in addition to HTML elements.
|
|
| 8. |
JavaScript Date Objects |
|
Answer» Dates are extremely important to deal with while creating most types of applications. JavaScript also allows you to deal with and change dates and times. The next section of the JavaScript cheat sheet is how to work on dates:
|
|
| 9. |
Numbers and Mathematics in JavaScript |
|
Answer» JavaScript provides various properties and methods to deal with Numbers and Maths. Let us have a quick look at those:
|
|
| 10. |
JavaScript Regular Expressions |
|
Answer» Regular expressions can be defined as search patterns that can be used to match string character combinations. Text search and text to replace procedures can both benefit from the search pattern. Let us look at how JavaScript allows Regular Expressions:
|
|
| 11. |
JavaScript Data Transformation |
|
Answer» Data Transformation in JavaScript can be done with the usage of higher-order functions. Higher-order functions are those functions in JavaScript which can accept one or more functions as inputs and return a function as the result. All higher-order functions that take a function as input are map(), filter(), and reduce(). Let us now take a look at how these functions can be used. One thing to note over here is that because all of these functions are part of the JavaScript Array prototype, they can be used directly on an array. map() method: The map method applies a function to each array element. The callback function receives each element of the array and returns a new array of the same length. This method can be used to conduct the same operation/transformation on each element of an array and return a new array with the modified values of the same length. An example of the usage of the map() method is given below: var arr = [10,20,30];var triple = arr.map(x => x * 3); triple; // [30,60,90] filter() method: Using the filter() method, items that do not meet a criterion are removed from the array. The callback function receives every element of the array. If the callback returns true on each iteration, the element will be added to the new array; otherwise, it will not be added. An example of the usage of the filter() method is given below: var arr = [13,40,47];var odd = arr.filter(x => x % 2); odd; // [13,47] reduce() method: The reduce() method can combine the items of an array into a single value. When using reduce, we must declare the accumulator's beginning value (final result). Each iteration, we do some operation inside the callback, which is then added to the accumulator. An example of the usage of the reduce() method is given below: var arr = [10,20,30];var counter = 0; let answer = arr.reduce((accumulator, value) => value + accumulator, counter); console.log(answer) // answer = 10 + 20 + 30 = 60 |
|
| 12. |
Document Object Model (DOM) in JavaScript |
|
Answer» The Document Object Model (DOM) is the structure of a webpage's code. There are many different ways to build and alter HTML elements with JavaScript (called nodes).
|
|
| 13. |
JavaScript Strings |
|
Answer» As mentioned earlier, Strings are nothing but a combination of characters that can be used to perform a variety of tasks. JavaScript provides so many methods for Strings alone that it makes sense to cover Strings as a standalone topic in this cheat sheet. Let us now look at the various escape sequences in JavaScript and the methods which JavaScript provides for strings:
|
|
| 14. |
JavaScript Closures |
|
Answer» A closure is a function that has been bundled together (enclosed) with references to its surroundings (the lexical environment). In other words, a closure allows an inner function to access the scope of an outside function. Closures are formed every time a function is created in JavaScript, during function creation time. An example of closures in Javascript is given below: function subtractor(subtractingInteger) {return function(a) { return a - subtractingInteger; }; } var subtract2 = subtractor(2); var subtract5 = subtractor(5); console.log(subtract2(5)); // 3 is logged console.log(subtract5(5)); // 0 is logged In this example, we have developed a function subtractor(subtractingInteger) that takes a single parameter subtractingInteger and returns a new function. Its return function accepts only one input, a, and returns the difference of a and subtractingInteger. The function 'subtractor' is essentially a function factory. It creates functions that have the ability to subtract a specified value from their arguments. The function factory creates two new functions in the example above: one that subtracts 2 from its argument and one that subtracts 5 from its arguments. Both subtract2 and subtract5 are closures. They have the same function body definition, but they hold lexical surroundings that are distinct. subtractingInteger is 2 in subtract2's lexical environment, but subtractingInteger is 5 in subtract5's lexical environment. |
|
| 15. |
JavaScript Hoisting |
|
Answer» Prior to executing the code, the interpreter appears to relocate the declarations of functions, variables, and classes to the top of their scope using a process known as Hoisting in JavaScript. Functions can be securely utilised in code before they have been declared thanks to hoisting. Variable and class declarations are likewise hoisted, allowing them to be referenced prior to declaration. It should be noted that doing so can result in unforeseen mistakes and is not recommended. There are usually two types of Hoisting:
function display(inputString) { console.log(inputString); // 'Lion' gets logged }
var x // Declaration of variable x x = 7; // Initialization of variable x to a value 7 console.log(x); // 7 is logged post the line with initialization's execution. |
|
| 16. |
Scope and Scope Chain in JavaScript |
|
Answer» 1. Scope: The accessibility or visibility of variables in JavaScript is referred to as scope. That is, which sections of the program can access a given variable and where the variable can be seen. There are usually three types of scopes:
function sayHello() { console.log(hello); } // 'Hello!' gets logged sayHello();
var hello = 'Hello!'; console.log(hello); } // 'Hello!' gets logged sayHello(); console.log(hello); // Uncaught ReferenceError: hello is not defined
let hello = 'Hello!'; var language = 'Hindi'; console.log(hello); // 'Hello!' gets logged } console.log(language); // 'Hindi!' gets logged console.log(hello); // Uncaught ReferenceError: hello is not defined 2. Scope Chain: When a variable is used in JavaScript, the JavaScript engine searches the current scope for the variable's value. If it can't find the variable in the inner scope, it will look into the outer scope until it finds it or reaches the global scope. If it still can't identify the variable, it will either return an error or implicitly declare the variable in the global scope (if not in strict mode). Let us take into consideration the following example: let a = 'a';function foo() { let b = 'b'; console.log(b); // 'b' gets logged console.log(a); // 'a' gets logged randomNumber = 33; console.log(randomNumber); // 33 gets logged } foo(); When the function foo() is called, the JavaScript engine searches for the 'b' variable in the current scope and finds it. Then it looks for the 'a' variable in the current scope, which it can't find, so it moves on to the outer scope, where it finds it (i.e global scope). After that, we assign 33 to the 'randomNumber' variable, causing the JavaScript engine to search for it first in the current scope, then in the outer scope. If the script isn't in strict mode, the engine will either create a new variable called randomNumber and assign 33 to it, or it will return an error (if not in strict mode). As a result, the engine will traverse the scope chain till the time when a variable is found. |
|
| 17. |
JavaScript Functions |
|
Answer» JavaScript Functions can be defined as chunks of code written in JavaScript to perform a single task. A function in JavaScript looks like this: function nameOfTheFunction(parameterOne, parameterTwo, parameterThree, parameterFour,....,parameterN) {// Job or Task of the function } The code above consists of the "function" keyword and a name, as you can see. The parameters of the function are enclosed in brackets, while the function's task code and output is enclosed in curly brackets. You can make your own, but there are a few default functions to make your life easier. Although we will be discussing various methods throughout this cheat sheet, let us discuss in brief two important types of JavaScript functions in this section:
|
|
| 18. |
JavaScript Arrays |
|
Answer» Arrays are the next item on our JavaScript cheat sheet. Arrays are used in a variety of programming languages. They are a method of categorising variables and attributes. Arrays can be defined as a collection of objects of the same type. In JavaScript, here's how one can make an array of cars: var cars = ["Mercedes", "Tesla","Volvo"];Now that we understand how to make arrays, we can perform a bunch of operations on them. Let us take a look at some JavaScript methods which can be used to perform various types of operations on arrays:
|
|
| 19. |
JavaScript If-Else Statements |
|
Answer» The if-else statements are simple to comprehend. You can use them to set conditions for when your code runs. If specific requirements are met, something is done; if they are not met, another action is taken. The switch statement is a concept that is comparable to if-else. The switch however allows you to choose which of several code blocks to run. The syntax of if-else statements in JavaScript is given below: if (check condition) {// block of code to be executed if the given condition is satisfied } else { // block of code to be executed if the given condition is not satisfied } Loops in JavaScript: Most programming languages include loops. They let you run code blocks as many times as you like with different values. Loops can be created in a variety of ways in JavaScript:
// code to be executed in loop }
while(condition checking for the loop){ // 1. code to be executed in loop // 2. updation of the loop variable }
do{ // 1. code to be executed in loop // 2. updation of the loop variable }while(condition checking for the loop); There are two statements that are important in the context of loops:
|
|
| 20. |
JavaScript Operators |
|
Answer» You can use variables to conduct a variety of tasks using JavaScript operators. The various types of operators in JavaScript are as follows:
|
|
| 21. |
Javascript Data Types |
|
Answer» Different types of values and data can be stored in JavaScript variables. To assign values to JavaScript variables, you use the equals to "=" sign operator. The various data types in JavaScript are as follows:
|
|
| 22. |
Javascript Variables |
|
Answer» Variables in JavaScript are simply names of storage locations. In other words, they can be considered as stand-in values that we can use to perform various operations in our JavaScript codes. JavaScript allows the usage of variables in the following three ways:
|
|
| 23. |
JavaScript Fundamentals |
Answer»
//JavaScript coding can be done inside this tag </script> With this information, the browser can correctly make out that the code is written in JavaScript and execute the code.
|
|