DEV Community

loading...

Dream11 – SDE2 – Frontend Interview Experience

learnersbucket profile image Prashant Yadav Originally published at learnersbucket.com ・3 min read

Dream11 - SDE2 - Frontend Interview Experience

Visit learnersbucket.com If you are preparing for your Javascript interview. I have written solutions for more than 300+ solved algorithms and implementation of all important data structures in JS.

I had applied on Dream11 career section for SDE2 Frontend position in March 2021.

Round 1: Hacker rank test

3 questions to be solved in 90 minutes.

Round 2: DSA

Round 3: Platform round (Javascript)

  • Implement a function onlyTwice which stores two instances a function invocation and returns first on odd calls and second on even calls.

It was based on singleton design pattern.

const addTwoNumbers = (a, b) => a + b
const myFancyAdd = onlyTwice(addTwoNumbers)

console.log(myFancyAdd(2, 3)) // 5
console.log(myFancyAdd(1, 2)) // 3
console.log(myFancyAdd(3, 4)) // 5
console.log(myFancyAdd(3, 7)) // 3
Enter fullscreen mode Exit fullscreen mode

My answer

const onlyTwice = (fn) => {
  let isOdd = true;
  let first = null;
  let second = null;

  return function(...args) {

    if(isOdd){
      if(!first){
        first = fn(...args);
      }

      isOdd = false;
      return first;
    }else{
      if(!second){
        second = fn(...args);
      }

      isOdd = true;
      return second; 
    }
  }
}
Enter fullscreen mode Exit fullscreen mode
  • Create throttle function.

  • Create a polyfill for promise which should handle following edge cases.

const prom = new MyPromise((resolve, reject)=>{
  setTimeout(() => {
    resolve("Done");
  }, 1000);
});


prom.then(function(data){
  console.log('1' + data) // Prints "1 Done" after 1 second
})

prom.then(function(data){
  console.log('2' + data) // Prints "2 Done" after 1 second
})

setTimeout(function(){
  prom.then(function(data){
    console.log('3' + data) // Prints "3 Done" after 2 seconds
  })
}, 2000)


const nwPromise = new Promise(()=>{
  xhr.send();

  xhr.onReadyStateChange = (data)=> {
    resolve(data)
  } 

  xhr.abort()
})

nwPromise.cancel()
Enter fullscreen mode Exit fullscreen mode

My code

const MyPromise = function(fn){
  // Code here

  let result = null;
  let error = null;
  let thenCallBackFunction = [];
  let resolveState = 0;

  const resolve = (data) => {
    resolveState = 1;

    result = data;
    if(thenCallBackFunction.length > 0){
      for(let fn of thenCallBackFunction){
        fn(data);
      }

      thenCallBackFunction = [];
    }

    resolveState = 0;
  }

  const reject = (error) => {
    error = error;
  }

  this.then = (fn2) => {
    if(!result){
      thenCallBackFunction.push(fn2);
    }else{
      fn2(result);
    }
  }

  this.catch = (errorFn) => {
    errorFn(error);
  }

  this.cancel = (cancelFn) => {
    if(resolveState === 0){

    }
  }

  fn(resolve, reject);
}
Enter fullscreen mode Exit fullscreen mode

I did not implemented the .cancel() as there was no time left.

Round 4: System design

Given the following API endpoints create a book reader.

/books (List of books with book IDs)
/book/:book_id/page_count (Returns page count for the requested book)
/book/:book_id/page/:page_number (Returns content for the requested page in RTE)
Enter fullscreen mode Exit fullscreen mode
  • It will show the list of books
  • On click open the selected book
  • Scroll to the next page (no pagination)

Lots of cross question on

  • Handle latency
  • Debounce
  • Direct jump to random page
  • Caching pages
  • Pre-loading data
  • Buffer zone
  • Optimization.

I failed in the final in this round as the interviewer asked me that if I use debounce (2ms) to load the next page and consider that you are on a 2g network and there is delay of 10ms for response then how will you handle it. I got stuck here.

Also he asked me that suppose your RAM will be able to store only 20 pages at a time then how would you jump to 300th page from the 100th page, when will you make the api call to fetch the page, will you show blank page or not, your scroll should end at 300th page, etc, etc.

Discussion (2)

pic
Editor guide
Collapse
nikolahristov profile image
Niki Hristov

Just a heads up that you can add highlighting to the code blocks if you'd like. Just change:

code block with no colors example

... to specify the language:

code block with colors example

More details in our editor guide!

Collapse
learnersbucket profile image
Prashant Yadav Author

Thanks!. Will update.