DEV Community

loading...
Cover image for Frontend interview - Questions I was asked

Frontend interview - Questions I was asked

rajeshroyal profile image Rajesh Royal ・Updated on ・1 min read

These are the questions I was asked In a frontend interview for a ReactJS position.

If you ask me to clone Netflix UI I will do It in shortest possible time, but if you ask me evaluate and string expression without eval(). I might not able to do this.

Hope you guys will find these questions useful.

BTW I failed miserably πŸ‘ΆπŸ‘Ά because I was desperate to get the job and It leads to nervousness which killed my performance.

I will say

Β 

Be eager but never be desperate.

Β 

let result = [{x: 1}, {x: 2}, {x: 3}];
Enter fullscreen mode Exit fullscreen mode

reduce this array and result should be 6; You are suggested to use arr.reduce() function.


Input:
people = [
  { name: 'Alice', age: 21, gender: "female" },
  { name: 'Max', age: 20, gender: "male" },
  { name: 'Jane', age: 20, gender: "female" }
  { name: 'Jon', age: 21, gender: "male" },
  { name: 'Alex', age: 20, gender: "male" }
]

output: 
{
 male: [
  { name: 'Max', age: 20, },
  { name: 'Jon', age: 21, },
  { name: 'Alex', age: 20, }
],
female: [
 { name: 'Alice', age: 21 },
{ name: 'Jane', age: 20 }
]
}
Enter fullscreen mode Exit fullscreen mode

Input: 
let value = "5+8=x";

Output should be 13 (type should be number);
Enter fullscreen mode Exit fullscreen mode

comment section is yours fellows. πŸ™πŸ™πŸ™

Thanks.

Discussion (7)

Collapse
faiwer profile image
Stepan Zubashev
result.reduce((acc, item) => acc + item.x, 0)

people.reduce((acc, item) => {
  if (item.gender === 'male') acc.male.push(item);
  else acc.female.push(item);
  return acc;
}, { male: [], female: [] });

eval(value.split('=')[0])
Enter fullscreen mode Exit fullscreen mode
Collapse
diogo405 profile image
Diogo Goncalves

people.reduce(...) answer is a masterpiece πŸ‘πŸ»

Collapse
rajeshroyal profile image
Collapse
infantiablue profile image
Truong Phan

A more generic solution to group by any property:

Array.prototype.groupBy = function (p) {
    return this.reduce((g, i) => {
        g[i[p]] = g[i[p]] || [];
        g[i[p]].push(i);
        return g;
    }, {});
};
Enter fullscreen mode Exit fullscreen mode
Collapse
rajeshroyal profile image
Rajesh Royal Author

Didn't understand It can you explain a little more.

Collapse
infantiablue profile image
Truong Phan • Edited

I may use the implicit variables so that you could read easily, see my comments for the explanations

// get the input property to group by, we attach the function to the prototype object
Array.prototype.groupBy = function (prop) {
    // then apply reduce
    return this.reduce((group, item) => {
        // create new property for the group object if not existed, if yes, reassign from the accumulator 
        group[item[prop]] = group[item[prop]] || [];
        // add new item to the group of property (in this  case, a list) we want to group
        group[item[prop]].push(item);
        return group;
   // create initial empty object to implement reduce
    }, {});
};
Enter fullscreen mode Exit fullscreen mode

Then we can use people.groupBy('gender') or people.groupBy('age')

Collapse
antonijogalic profile image
Antonijo Galic

Using .filter for the second task

const output = () => {
  const male = people.filter(person => person.gender === 'male');
  const female = people.filter(person => person.gender === 'female');

  return { male: male, female: female };
};

output();
Enter fullscreen mode Exit fullscreen mode
Forem Open with the Forem app