Master JavaScript & Frontend Engineering Interviews
The JavaScript Interview Masterbook
Deep-dive theoretical foundations: Execution Context, Event Loop, Closures, Scoping, and Advanced Web Architecture with intuitive mental models.
Difference between let, const and var
What is hoisting in JavaScript
What is scope (global, function, block)?
What are closures?
What is Event Loop?
Explain call stack and execution context
Company-Tagged Machine Coding & SDE Sets
Practical problems asked in technical rounds at Swiggy, Uber, Zeta, Birdeye, ThoughtSpot, and Abhibus across SDE-1, SDE-2, and SSE tiers.
Ceaser Cipher
Caesar Cipher: An earlier encryption technique which used to substitute the current alphabets with alphabet after a number of count. Implement an algorithm to solve the ceaser cipher. Input: text = ABCD , Key = 13 A B C D E F G H I J K L M N O P Q R S T U V W X Y Z 13 shift to A is N 13 shift to B is O 13 shift to C is P 13 shift to D is Q Output: NOPQ Input: console.log(ceaserCipher('ATTACKATONCE', 13)); console.log(ceaserCipher('prashantyadav', 13)); Output: "NGGNPXNGBAPR" "cenfunaglnqni"
Check performance of async and sync functions
This question was asked in Atlassian’s principal engineer interview (P60) and Razorpay's Interview. Create an async function measurePeformance() that will take the function (async or sync) as input whose performance has to be evaluated. Example sync function Input: // normal function const syncFunction = () => { let sum = 0; for (let i = 0; i < 1000000; i++) { sum += i; } return sum; }; // measure performance of the normal function measurePerformance(syncFunction, { name: 'Sync Calculation', iterations: 5, warmup: true }); Output: "Performance Results for Sync Calculation:" "----------------------------------------" "Type: Sync" "Iterations: 5" "Average: 10.00ms" "Min: 9.00ms" "Max: 11.00ms" "----------------------------------------" Example async Function Input: // async function const asyncFunction = async () => { await new Promise(resolve => setTimeout(resolve, 100)); return 'done'; }; // measure performance of the async function measurePerformance(asyncFunction, { name: 'Async Calculation', iterations: 5, warmup: true }); Output: "Performance Results for Async Calculation:" "----------------------------------------" "Type: Async" "Iterations: 5" "Average: 105.60ms" "Min: 104.00ms" "Max: 107.00ms" "----------------------------------------" The measurePeformance() will take following props as input: other props like: - name: The name of the function or the default alias for the anonymous functions. - iterations: Number of time the function should be invoked, helps to get the average computation time with high and low time. - warmup: This flag will be used to run the function once to make sure it is not throwing any error before starting the performance test. - logResults: This flag will be used to determine if we have to log the results or not. Compare performance of two or more functions Extend the measurePerformance function and create a comparePerformance function that will take two or more functions and compare there performance. Testcase Input: // async function const asyncFunction = async () => { await new Promise(resolve => setTimeout(resolve, 100)); return 'done'; }; // normal function const syncFunction = () => { let sum = 0; for (let i = 0; i < 1000000; i++) { sum += i; } return sum; }; // compare two functions comparePerformance([ { fn: syncFunction, name: 'Sync Calculation' }, { fn: asyncFunction, name: 'Async Operation' } ], { iterations: 5, warmup: true }); Output: "Performance Results for Sync Calculation:" "----------------------------------------" "Type: Sync" "Iterations: 5" "Average: 2.40ms" "Min: 2.00ms" "Max: 3.00ms" "----------------------------------------" "Performance Results for Async Operation:" "----------------------------------------" "Type: Async" "Iterations: 5" "Average: 104.40ms" "Min: 100.00ms" "Max: 113.00ms" "----------------------------------------" "Performance Comparison:" "----------------------------------------" "1. Sync Calculation:" " Average: 2.40ms" " Min: 2.00ms" " Max: 3.00ms" "2. Async Operation:" " Average: 104.40ms" " Min: 100.00ms" " Max: 113.00ms" "----------------------------------------" Note: You have to implement the functions measurePeformance() and comparePerformance() that solves the problem. There are no testcases to this. Test it yourself using the sample testcases. Related Link - https://leetcode.com/discuss/post/6769058/atlassian-principal-frontend-engineer-p6-b0h2/
Create a function to truncate string
This question was asked in Birdeye's frontend interview. It was asked to create a function to truncate the string and end it with the ellipses characters ... at the end. Create a function truncate(str, maxlength) that checks the length of the given str and if it exceeds maxlength, replaces the end of str with the ellipsis character ... , to make its length equal to maxlength. Example Input: truncate("What I'd like to tell on this topic is:", 20) Output: "What I'd like to tel..." Note: You have to implement the solution that solves the problem. There are no test cases to this. Test it yourself using the sample testcases.
Create a sampling function
This question was asked in ZETA's SDE1 Frontend interview. Create a function in JavaScript that accepts a function as input and a count and executes that input function once for a given count of calls. Known as sampling function. function message(){ console.log("hello"); } const sample = sampler(message, 4); sample(); sample(); sample(); sample(); // this will be executed sample(); sample(); sample(); sample(); // this will be executed Note: You have to implement a function sampler that evaluates the above expression. There are no test cases to this. Test it yourself with different values. Related Links - https://www.linkedin.com/posts/prakharchauhan281098_opentowork-frontenddevelopment-javascript-share-7281324741347430400-6sx1/?utm_source=share&utm_medium=member_desktop
Create a Sampling Functon
Problem Statement: Create a function in JavaScript that accepts a function as input and a count and executes that input function once for a given count of calls. Known as sampling function. function message(){ console.log("hello"); } const sample = sampler(message, 4); sample(); sample(); sample(); sample(); // this will be executed sample(); sample(); sample(); sample(); // this will be executed
Data Structures & Algorithms in Native JavaScript
66+ DSA challenges written in clean modern JavaScript. Every problem breaks down multiple approaches with explicit Time & Space Complexity analysis: Brute Force $O(N^3) \rightarrow$ Better $O(N^2) \rightarrow$ Optimal $O(N)$.