28 Relevant Javascript Interview Questions Part I - The first 4

Cover Image: Free on Pexels by Pixabay

Table of Content

• A little perspective
• 1. The Famous FizzBuzz
• 2. Array Method Polyfill
• 3. Calculate Employee Gross Pay
• 4. Rolls of coins
• In closing

Table of contents generated with markdown-toc

A little perspective

For the past 12 years, I have been on both sides of the Front End Interview table. Sadly though, the emphasis is always put on Javascript during those rounds and the two other important languages - HTML and CSS - are not usually given the same weight.

Javascript though is very hard to cover as a whole since it has evolved from inside the DOM manipulation frame, to about anything that one sets their mind too. Let's not even mention the plethora of Javascript libraries and frameworks that have sprouted all around like an army of bunnies following a long and harsh winter - Spring is coming!!

All jokes aside though, you could totally rock it at one interview and feel like you command the clouds, or be harshly knocked off the mountain tops in another.

The interview process as a whole is busted and has been a source of frustration for both the candidate and the companies trying to hire the right talent.

I have decided to add my modest contribution and I'm hoping to be a part of the solution here. I have been literally reading over hundreds of common interview questions and feel like a review and refactor of those are the key elements in fixing the bigger issue, but I need your help :)

I will be sharing a curated list of the ones that I have picked, adapted and sometimes created as most relevant to not only for a candidate to prepare but also for a company to assess one. It is obviously very opinionated but will hopefully become valuable and maybe a standard with the help and inputs from the JS community.

Below is the first batch of 4, take a read and let me know how you feel about all or some of them in the comments. I highly encourage you to contribute by proposing some possible interview questions in the comments. Please share with anyone who can add to or benefit the discussion.

1. The Famous FizzBuzz

Best suited for: Junior | Senior - Stage: Round 1 | All rounds

1A. - The Challenge

Write a program that prints the numbers from 1 to 100. But for multiples of three print Fizz instead of the number and for the multiples of five print Buzz. For numbers which are multiples of both three and five print FizzBuzz

1B. The context

The FizzBuzz challenge is not specific to JavaScript and has been part of the coding interview process in almost every programing language. It is usually a quick check to assess the candidate basic programming instincts, but can also be turned in an assessment for in-depth knowledge if the interviewer decides to do so.

It is usually part of a lightweight first technical interview done while screen sharing. It is also a favorite from a non-JavaScript programmer to ask and quickly gauge your technical knowledge and approach.

In a Javascript context familiarity with some or all the following concepts are expected to be demonstrated:

• Logical operators
• Looping
• Falsy values
• Ternary operator
• Type coercion

2. Array Method Polyfill

Best suited for: Junior | Senior - Stage: Round 2 | On site

2A. The challenge

You might have to add all items in an array of numbers. You have been keeping up to date with new stuff in JS but are not sure that sum() is part of the Array prototype methods.

Write a small program that will add all the items in an array of numbers and return the total using the Array sum function if it exists or using your custom function.

 // should output 21
[1,2,3,4,5,6].sum();
// should be chainable and also output 21
[1,2,3].concat([4,5,6]).sum();

2B. The context

Extending native objects is usually frowned upon in JS circles. This should stir a 'healthy' debate on the pros and cons of doing so. Ultimately, it should highlight the candidate awareness of safeguarding against potential existing and future functionality override.
I believe it's a good question for a code screening or the first question on an onsite interview.

3. Calculate Employee Gross Pay

Best suited for: Senior | Expert - Stage: Round 2 | Round 3 | On site

3A. The challenge

As a new member of the Kora Inc. development your new hot assignment is to help the HR department quickly calculate employees gross pay. Below are the compensation models for each role:

const associate = { roleId: 3, rate: 12.5,overtime: 18.75 };
const supervisor = { roleId: 2, rate: 15,overtime: 22.5 };
const admin = { roleId: 1, rate: 30,  overtime: 0 }; // salary no overtime

Write a base function that takes a role (object), hours (number) and ovtHours (number) as arguments and returns the employee gross pay. Using this base function, create three partial application functions that respectively will calculate the associate, supervisor or admin gross pay when invoked.

3B. The context

From a first look, putting a function or program to calculate gross pay is very straightforward. Here, as I'm screening the candidate, I will pay close attention to her/him taking the time in reading about the specificity of the solution asked.

I will expect to have a lot of questions around the terms base function and the concept of partial application. I will also not push for in-depth knowledge of functional programming concepts such as currying but I will expect a general awareness of those.

4. Rolls of coins

Best suited for: Junior | Senior | Expert - Stage: Round 2 | Round 3

4A. The challenge

At the end of her shift, Amina’s tip jar is full of coins. She needs a little help in counting and stocking her hard earned loot. She wants to organize her coins in rolls so it is easy to bring back to the bank.

Write a program that will help her quickly find out how many rolls she has for each coin denomination and the remainder on each.

Below is a table of how many coins should be in each roll per denomination:

Coins	Coins per roll	Value
Penny ==> 1	50	$0.50
Nickel ==> 5	40	$2.00
Dime ==> 10	50	$5.00
Quarter ==> 25	40	$10.00

Your program will accept an unsorted array of coins. You can assume that each coin will be either 1, 5, 10 or 25. It should print a message like the one below:

Pennies:10 rolls - 39 left

Nickels: 25 rolls - 0 left

Dimes: 12 rolls - 49 left

Quarter: 2 rolls - 20 left

4B. The context

This one is a slight twist and variation of the Socker Merchant Challenge - Hacker Rank.

It is a frequency count as an exercise and since it can be approached and solved a countless number of ways, it is a perfect pick to get the candidate to walk us through their approach and their iterative process in problem-solving.

I'm a huge proponent of the 'Make it work first, optimize and refactor later' approach. I would pay close attention to code that overall is readable and self-documenting.

In closing

Alright folks, this was quite a long post and I salute you if you have made it this far. Let's keep the discussion live in the comments. Part 2 is soon to follow.

Cheers

Comments

[Laurie]

Thanks for writing this up. Obviously interviewing is broken, but I still take issue that a "correct" solution would rely on the knowledge of the existence of a specific function, i.e. sum in example two. I would hope that reduce or another efficient option would be just as acceptable. If not, it ends up being more about wrote memorization/keyword knowledge than about being able to breakdown the problem. Which is, theoretically, the point of the arduous technical interviews we have at present.

[Ady Ngom]

Hello Laurie thank you for reading and taking the time to add to the discussion. I think after reading your comment that maybe the wording of the challenge is not clear. The intent is to actually have the candidate write a sum function since it does not exist on the Array prototype methods like map, filter or reduce. In doing so the candidate should be careful in not overriding a possible future implementation of it - say for example if the method was to get added natively in ES8 or later.

For example if I was asked to add a method to the Array prototype that doubles each number in an array, a simple first step might be:

Array.prototype.doubles = function() {
 return this.map(n => n * 2);
}

And [2,4,6].doubles() will return [4,8,12].

Of course, that is the first step and there is more to it to make it more future proof - but hopefully that clarifies the intent.

Let me know if the wording needs to be revised.

Thanks again :)

[Laurie]

Ah, I was gonna say, I didn't know that WAS a function on array!

I think this is the line that is a bit confusing You have been keeping up to date with new stuff in JS but are not sure that sum() is part of the Array prototype methods. That implies that it might be and you just don't know it? I might say, You have been keeping up to date with new stuff in JS and know that sum() is not part of the Array prototype methods.

[Ady Ngom]

I think you are right and that section might need a bit of a revision to be clearer. I will take a stab at it, feel free to propose something as well.

[John]

This might be a relevant question to ask

/*

  Bank notes for three different currencies are stacked in five piles per
  row(represented by the money array below).

  The task is to output to the console only those rows where the currency
  is USD AND the sum of the currency values in the five piles sums to
  100.

*/

const money = [
  {id: 0, currency: 'USD', value: [10, 20, 20, (20 + 20), 10]},
  {id: 1, currency: 'EURO', value: [10, 20, 10, 10, 10]},
  {id: 2, currency: 'USD', value: [10, 20, 20, 50, 10]},
  {id: 3, currency: 'USD', value: [20, 20, 20, 20, 20]},
  {id: 4, currency: 'GBP', value: [10, 20, 20, (20 + 20), 10]},
  {id: 5, currency: 'USD', value: [10, 20, 50, 20, 20]},
  {id: 6, currency: 'EURO', value: [5, 20, (10 + 20), (20 + 20), 5]},
  {id: 7, currency: 'USD', value: [10, 20, (10 + 20), (20 + 20), 50]},
  {id: 8, currency: 'GBP', value: [10, 20, 20, 20, 10]},
  {id: 9, currency: 'USD', value: [10, 20, (10 + 20), (20 + 20), 100]},
  {id: 10, currency: 'GBP', value: [10, 20, (10 + 20), (10 + 20), 10]},
  {id: 11, currency: 'EURO', value: [10, 20, (10 + 20), (20 + 20), 10]},
]

[Ady Ngom]

Nice thanks for the contribution. I will take a close look. I really like the wording which sounds like a good user story.
Cheers

[Dan Silk]

Here you go: github.com/h5bp/Front-end-Develope...

[Ady Ngom]

Awesome Dan - thank you for the link. Cheers

[Reza Moini]

As a developer, I've served for nearly 2 decades, always javascripting. IMO, all 4 challenges above test the modular arithmetic knowledge of a candidate. Being a direct individual, I would simply ask a candidate if they know what mod does.

I have been belittled by self proclaimed GURU's who know a few tricks (tricks are for kids!) in the interview process so many times that I've felt like the most useless developer who's ever been or will be.

In general, I'd say testing someones coding during an interview process shows how incompetent the interviewer is! Just don't do it!