The call() is a predefined Javascript function which can used to call a method of an object while passing it another object. For example, if you look at the following code, you will observe that the object being passed into the call() method replaces the this variable of the object whose method is being invoked.
To perform unit testing on a component that makes use of a service, that returns a promise, we can use fakeAsync() and spy() methods from Angular’s unit testing package.
In Javascript, when you pass a primitive data type like String or Int in Java to a function or a method, and a function modifies it, then this does not effect the actual data being passed. For example,
The Floyd Warshall Algorithm is used to find the shortest distance between all pairs in a weighted graph with positive or negative edges. It makes use of Dynamic Programming.
Kth largest element in an array can be determined using the “Quickselect Algorithm”.
Average performance O(n)
Worst-case performance O(n^2)
Amazon
Usually for SDE I, the interview involves
For entry level software engineers, usually it comprises of
Microsoft
For different levels of Software Engineering positions, usually the interview comprises of
Most tech companies try to test your ability to apply core Computer Science fundamentals to solve problems.
Dynamic Programming is a way of solving a problem by breaking it down into smaller sub problems and storing them without having to recalculate them. Usually this involves 3 main methods.
You will need a Windows PC for this. Make sure you have backed up your data before proceeding.
Install ng-recaptcha module and import it into the app.module.ts
The difference between classical inheritance and prototypal inheritance is that classical inheritance is limited to classes inheriting from other classes while prototypal inheritance supports the cloning of any object using an object linking mechanism. Read more here.
== in JavaScript is used for comparing two variables, but it ignores the datatype of variable. === is used for comparing two variables, but this operator also checks datatype and compares two values.
This property of Javascript allows for private variables in a function. For example
const increment = (() => {
let counter = 0;
return () => {
counter += 1;
console.log(counter);
}
})();
// Self invoking function.
increment();
increment();
increment();
This is one common scenario you might run into when you use async calls inside a loop. The loop executes before the async call returns and the desired output is not logged.
function httpGet(theUrl, callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
}
xmlHttp.open("GET", theUrl, true);
xmlHttp.send(null);
}
for (var i = 0; i < 5; i++) {
httpGet('https://httpbin.org/get', function(data) {
console.log(i);
});
}
Output
5 5 5 5 5
Using closure we can handle this in the following way
function httpGet(theUrl, callback) {
var xmlHttp = new XMLHttpRequest();
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
callback(xmlHttp.responseText);
}
xmlHttp.open("GET", theUrl, true);
xmlHttp.send(null);
}
for (var i = 0; i < 5; i++) {
((index) => {
httpGet('https://httpbin.org/get', function(data) {
console.log(index);
})
})(i);
}
/* or in ES6 you can simply use the 'let' keyword. */
for (let i = 0; i < 5; i++) {
httpGet('https://httpbin.org/get', function(data) {
console.log(i);
});
}Output
0 1 2 3 4
The variables in javascript can be declared even after they are used as they are moved to the top of the code during execution. Hoisting doesn’t take place for initializing though. The same goes with function hoisting.
Note: There is no variable/function hoisting in ES6.
When ‘use strict’ is used you will need to declare variables while using them. There are other rules such as not being able to delete objects etc when using this mode.
Event propogation can be of 2 types Bubbling and Capturing.
Bubbling
Event propogation occurs starting from the inner element to the outermost element.
Capturing
Event propogation starts from the outermost element to innermost element. This is also known as Trickling.
If a lot of elements are handled in a similar way, then instead of assigning a handler to each of them – we put a single handler on their common ancestor.
Events bubble by default. So the difference between the two is:
target is the element that triggered the event (e.g., the user clicked on)currentTarget is the element that the event listener is attached to Read more…
The Promise object represents the eventual completion (or failure) of an asynchronous operation and its resulting value. Read more here.
REST stands for representational state transfer. API stands for Application programming interface. Read here.
Read more here.
Read more here.
Read more here.
Stick to compositor-only properties. Read more here.
Read more here.
The localStorage and sessionStorage objects are part of the web storage API, are two great tools for saving key/value pairs locally. Using localStorage and sessionStorage for storage is an alternative to using cookies and the data is saved locally only and can’t be read by the server, which eliminates the security issue that cookies present. It allows for much more data to be saved (10MB). Cookies are still useful, especially when it comes to authentication, but there are times when using localStorage/sessionStorage may be a better alternative.
Read more here & here.
The Beacon API is a web API that allows you to send small amounts of data from a web page to a web server, asynchronously and without delaying the loading of the next page. This API is typically used for analytics and performance monitoring purposes.
const data = {
event: 'button_click',
timestamp: Date.now(),
user_id: '12345',
};
// Send data to the server asynchronously using the Beacon API
navigator.sendBeacon('/api/log-event', JSON.stringify(data));
Server-Sent Events (SSE) is a technology that enables a server to push real-time updates to a web client over a single HTTP connection. SSE is often used for applications that require real-time updates, such as live scoreboards, news feeds, or chat applications. SSE is used for light weight one way communication from server to client. Here’s an example of how to use Server-Sent Events in a web application:
Server-Side (Node.js with Express):
const express = require('express');
const app = express();
// Serve a simple HTML page to the client
app.get('/', (req, res) => {
res.sendFile(__dirname + '/index.html');
});
// SSE route for sending updates
app.get('/sse', (req, res) => {
res.setHeader('Content-Type', 'text/event-stream');
res.setHeader('Cache-Control', 'no-cache');
res.setHeader('Connection', 'keep-alive');
// Send a message to the client every 1 second
setInterval(() => {
res.write(`data: ${JSON.stringify({ message: 'Hello, world!' })}\n\n`);
}, 1000);
});
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`Server is running on port ${port}`);
});
In this example, the server sends a message to the client every second using an SSE endpoint (/sse).
2. Client-Side (HTML and JavaScript):Next, you’ll create an HTML page that listens to SSE updates and displays them. Here’s an example index.html file:
<!DOCTYPE html>
<html>
<head>
<title>SSE Example</title>
</head>
<body>
<h1>Server-Sent Events Example</h1>
<div id="sse-data"></div>
<script>
const sseDataElement = document.getElementById('sse-data');
// Create an EventSource object to listen for SSE updates
const eventSource = new EventSource('/sse');
eventSource.onmessage = (event) => {
const data = JSON.parse(event.data);
sseDataElement.innerHTML = `Message from server: ${data.message}`;
};
</script>
</body>
</html>
When you run this code, you should see “Hello, world!” messages displayed on the HTML page, updated every second, coming directly from the server.
HTTP long polling is a technique used to achieve real-time updates or push notifications from a server to a client over the HTTP protocol, even in scenarios where full-duplex communication like WebSockets is not available. In long polling, the client sends a request to the server, and the server holds the request open until new data becomes available or a timeout occurs. When new data is ready, the server responds to the client’s request, and the client immediately sends another request to keep the connection open.
const http = require('http');
const url = require('url');
// In-memory storage for messages (replace with a database in a production scenario)
const messages = [];
const server = http.createServer((req, res) => {
const reqUrl = url.parse(req.url, true);
if (reqUrl.pathname === '/poll') {
const timeout = 30000; // You can adjust the timeout as needed (e.g., 30 seconds)
const startTime = Date.now();
const checkForMessages = () => {
if (messages.length > 0) {
res.writeHead(200, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ message: messages.shift() }));
} else if (Date.now() - startTime > timeout) {
res.writeHead(200, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ message: 'timeout' }));
} else {
setTimeout(() => {
checkForMessages();
}, 1000); // Polling interval (1 second)
}
};
checkForMessages();
} else if (reqUrl.pathname === '/push' && req.method === 'POST') {
let requestBody = '';
req.on('data', chunk => {
requestBody += chunk.toString();
});
req.on('end', () => {
const parsedBody = JSON.parse(requestBody);
const message = parsedBody.message;
if (message) {
messages.push(message);
res.writeHead(200, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ status: 'Message added to the queue' }));
} else {
res.writeHead(400, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ status: 'No message provided' }));
}
});
} else {
res.writeHead(404, { 'Content-Type': 'text/plain' });
res.end('Not Found');
}
});
const PORT = process.env.PORT || 3000;
server.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});
In this Node.js example:
/poll and /push endpoints./poll, it waits for messages to become available and responds when a message is ready or when a timeout occurs./push, it accepts POST requests to add messages to the queue.Client (HTML/JavaScript)
<!DOCTYPE html>
<html>
<head>
<title>HTTP Long Polling Example</title>
</head>
<body>
<div id="messages"></div>
<script>
const messagesDiv = document.getElementById('messages');
function pollServer() {
fetch('/poll')
.then(response => response.json())
.then(data => {
if (data.message) {
messagesDiv.innerHTML += '<p>' + data.message + '</p>';
}
pollServer(); // Continue polling
})
.catch(error => {
console.error('Error:', error);
pollServer(); // Continue polling even in case of errors
});
}
// Start polling when the page loads
pollServer();
</script>
</body>
</html>Reference counting vs Mark and Sweep. Read more here.