DEV Community

Cover image for Frontend interview - Questions I was asked
Rajesh Royal
Rajesh Royal

Posted on • Edited on

Frontend interview - Questions I was asked

#interview #javascript #frontend #questions

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.

Top comments (11)

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
Rajesh Royal • • Edited

Masterpiece.

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
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 •

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
 
alexter42 profile image
Alejandra Monroy • • Edited 
const sortBy = (arr, attribute) => { const set = new Set(); arr.map((element) => set.add(element[attribute])); const sorted = {}; set.forEach( (setElement) => (sorted[setElement] = arr.filter((element) => element[attribute] === setElement)) .forEach(element => delete element[attribute]), ); return sorted; };
Enter fullscreen mode Exit fullscreen mode
Collapse
 
sauravbehera1 profile image
Saurav Behera •

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" }
// ]
// const male=people.filter((el)=>el.gender=="male")
// const female=people.filter((el)=>el.gender=="female")
// console.log({male:male,female:female})

Collapse
 
sauravbehera1 profile image
Saurav Behera •

// let result = [{x: 1}, {x: 2}, {x: 3}];
// res=result.reduce((acc,el)=>acc+el.x,0)

Collapse
 
sauravbehera1 profile image
Saurav Behera •

let value = "5+8=x";
let arr=value.split("=")
arr=arr[0].split("+").map(Number).reduce((acc,e)=>acc+e)
console.log(arr)

View full discussion (11 comments)