Interview prep Flashcards
Which of the following is not true of JS 1. JS is case sensitive language 2. Semicolons at the end of JS statements are required 3. JS statements can be grouped together in blocks. 4. Javascript is loosely typed
- is false. JS is sensitive to the case of the function name, class name, identifiers, etc. JS is a loosely typed language - meaning you don’t have to specify what type of information will be stored in a variable in advance. For example, we use int, string, etc to initialize a variable but here we can give let, const, etc for initializing.
What should be called before send() in XMLHttpRequest
Open() Example: var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { // Action to be performed when the document is read; } }; xhttp.open(“GET”, “filename”, true); xhttp.send();
(function(){ console.log(1); setTimeOut(()=>{console.log(2)},1000); setTimeOut(()=>{console.log(3)},0); console.log(4) })();
1 4 3 2
Hoisting
Hoisting #
In JavaScript, a variable can be declared after it has been used. This is because variable declarations using var are hoisted to the top of their functional scope at compile time. Hence, a variable can be initialized and used before it has been declared.
Can you offer a use case for the new arrow => function syntax?
- For array manupulation
eg : map, reduce, forEach etc
- Managing async code
ex: resolving promise and using then as chaining
What is lexical scoping.
In JavaScript, arrow functions do not bind their own this, meaning they inherit the one from the parent scope; this is also known as lexical scoping.
What is the result of the below:
<style></style>
button {font-size: 50px; }
.on {background: #ff0000;}
<button>Click me</button>
const button = document.querySelector(‘#pushy’);
button. addEventListener(‘click’, () => {
this. classList.toggle(‘on’);
});
The keyword this does not bind to the element clicked as it is being used inside the arrow function. Due to this, the error, “TypeError, cannot read property, toggle of undefined”, occurs.
call & apply
what does Function.prototype.bind do?
The bind function creates a new function whose this value can be set to the value provided during the function call, enabling the calling of a function with a specified this value (the first parameter to bind function).
What does Function.call do?
The call method allows for a method that was defined for one object to be assigned and called on by another object. This allows for a method to get defined once and then get inherited by other objects without having to re-write it for other objects.
Difference between call and apply
The only difference between the two is that call expects all parameters to be passed individually, whereas apply expects the second argument to be an array of all the parameters.
what are closure and common uses of closure
In JavaScript, a closure is a function that can access the variables from another function’s scope. This is possible by creating nested functions. The enclosing/outer function will, however, not have access to the inner scope.
The inner function having access to the variables in the outer function. It is not a true visa versa
Used for below:
- Data object privacy
- In event handlers
- callback functions
- currying
What are event table, event loop and event queue
Event table & queue #
As you know, the call stack stores all your running JavaScript code. The interpreter reads the code line-by-line, pushes each statement into the call stack one-by-one, and pops them once they execute. However, if the statement is asynchronous, it is removed from the call stack and forwarded to the event table. This table is responsible for moving the asynchronous code to the event queue after a specified time. Here the statement waits for execution.
This brings us to the question. When will the statements from the event queue execute?
The event loop is responsible for keeping check of both the call stack and the event queue. It keeps checking if all the statements from the call stack have finished execution; that is, if the call stack is empty. If so, it pops the statement from the event queue (if present) to the call stack to execute.
Note: All synchronous statements execute first, and only then can the asynchronous ones execute.
What is IIFE
IIFE #
IIFE stands for Immediately Invoked Function Expressions. As the name implies, it is a way to execute the functions as soon as they are created.
- Annonymous
(function() {
//code goes here
})()
What does rest operator do?
What does spread operator do?
Describe event capturing in JavaScript.
In event capturing, when you click the button, the event passes from the parent down to the event target,
This
The JavaScript this keyword refers to the object it belongs to.
- The value of this is decided based on how the code is being executed.
- By default, the execution context for execution is global — which means if a code is being executed as part of a simple function call, then this refers to a global object.
- When a function is invoked with the new keyword, then the function is known as a constructor function and returns a new instance. In such cases, the value of this refers to a newly created instance.
- When a function is invoked as an object’s method, then this is the object that the method belong to
- If a function is invoked with call, bind, and apply methods, the value of this refers to the first argument passed.
In ES6 ‘this’ do not get bound to the arrow function. The value of this inside arrow function will be bound to the parent scope.
Prototypal inheritance
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Inheritance
Classical Inheritance
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Inheritance
Create a wrapper curry function.
For example: multiply(2,3,4) -> 24
mul(2)(3)(4) -> 24
Same origin policy
Feature detection and feature inference and User agent?
User Agent - accesses information of the browser environment you are using.
When you visit a browser, it sends a user-agent string to the host; this string contains information about the browser environment you are navigating.
Callback
A callback is a function that is passed to another function. When the first function is done, it will run the second function.
The problem with callbacks is it creates something called “Callback Hell.” Basically, you start nesting functions within functions within functions, and it starts to get really hard to read the code.
