Find jobs for front end engineer

Front end engineer Interview Questions

Front end engineer Interview Questions

Front end engineer Interview Questions

A front end engineer is focused on the user experience of software or an app. During an interview, you will need to demonstrate that you understand UX/UI design principles, a commitment to clean code optimized for the product offering, and a willingness to work with backend engineers to solve problems. Expect to be asked about your technical experience, as well as your people management and design skills.

9,647 Front End Engineer interview questions shared by candidates

Top Front End Engineer Interview Questions & How to Answer

Here are three top front end engineer interview questions and how to answer them:

Question #1: What is your preferred workflow/management style?

How to answer: Outline what tools and methodologies you use to manage the development of a product. Talk about the strategies you use to work with a diverse range of stakeholders, including clients, sales and marketing, and back end engineers. Use specific examples to show how your workflow has been successful, and also express a willingness to adapt and change when necessary.

Question #2: How do you manage testing, reviews and version control?

How to answer: A lot of a front end engineer's role involves the nitty gritty details that make sure a user's experience is seamless. Highlight that you understand the importance of good clean code, testing protocols, and version management. Use examples of methodologies you have used and what problems they addressed or solved.

Question #3: What excites you most about the UX/UI space?

How to answer: A question like this is your opportunity to show that you are passionate about front end engineering. Explain how you integrate user-centered design in your projects and the philosophies that you follow. Outline any books or articles you have read and what you agree with. If possible, talk about what changes you foresee and how you think design and technology will adapt to those changes.

Top Interview Questions

Sort: Relevance|Popular|Date
Bloomberg L.P.
Front End Web Developer was asked...February 23, 2010

What is a JavaScript callback function?

5 Answers

A callback function is a piece of JavaScript code that executes after the main function that the callback is attached to executes successfully. Less

udaykanth, I would say that a .forEach() would be the most common and most basic use of a callback function. I'm just writing this to help anyone that might have a hard time thinking up a quick example if the come across this question themselves. Example: var numArray = [ 1, 2, 3 ] ; numArray.forEach( function( i ) { console.log( arr[ i - 1 ] ) } ) ; // logs out // 1 // 2 // 3 Less

Is there a front end role at bloomberg. I guess your position must have been labelled software dev right? altho ur a dront end dev Less

Show More Responses
GCI

How to center a 200px x 200px div to the center of the screen?

2 Answers

<div> <div> Inner </div> <div> .outer { width: 100vw; height: 100vh; position: relative; } .inner{ width: 200px; height: 200px; position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; }</div></div> Less

Provide top and left 50% then off set the div with -100px margin top and left. A more scaleable solution would be to use transform: translate(-50%, -50%) to make it not matter what size the div is. Less

TravelClick

As a designer, did I think I would get bored with coding and troubleshooting?

1 Answers

I let them know that while design is a creative field, I have always been interested in designing for the user, and coding is no different. Whether creating a design or writing code the interesting part to me was the end result for the user. Less

IXL Learning

Given a number n where n+1 and n-1 are prime, prove n is divisible by 6

1 Answers

n+1 is prime, n+2 is prime... all prime numbers are odd, so n must be even (i.e., divisible by 2) in any set of 3 numbers (consider 1,2,3 or 4,5,6 or 20,21,22) at least one number is divisible by 3. since n+1 and n+2 can't be divisible by anything, n must be divisible by 3. therefore n is div by 6 Less

Lab49

Say there was a function that took 1 second to execute and you needed to run this function 10 million times, how would you cut down on the execution time?

1 Answers

Build a system that would run the functions concurrently.

LinkedIn

If we wanted to implement a method of tracking every click that the user made on the site, how would we want to do this?

1 Answers

Place a JavaScript event listener for all clicks at the document level. Perform actions based on the details of the click. This problem had multiple branches and sub-questions, but the gist is that you would want to capture the events as they bubbled back up to the document level. There are other acceptable answers to this question. Less

AT&T

What is== and === operator?

1 Answers

== returns a Boolean true if both the operands are equal. === this is the strict equal operator and only returns a Boolean true if both the operands are equal and of the same type. Less

Meta

Given an input array and another array that describes a new index for each element, mutate the input array so that each element ends up in their new index. Discuss the runtime of the algorithm and how you can be sure there won't be any infinite loops.

25 Answers

Essentially the same as Anh's answer but less code, assuming ES5 is available var arr = ["a","b","c","d","e","f"]; var indices = [2, 3, 4, 0, 5, 1]; arr = indices.map(function (item, index) { return arr[indices.indexOf(index)]; }); Less

function reposition(arr, indices) { var newArr = []; // I'm not sure if extra space is allowed. If it is, the solution should be this simple. for(var i = 0; i &lt; arr.length; ++i) { var newIndex = indices[i]; newArr[newIndex] = arr[i]; } return newArr; } var arr = ["a", "b", "c", "d", "e", "f"]; var indices = [2, 3, 4, 0, 5, 1]; reposition(arr, indices); // returns: ["d", "f", "a", "b", "c", "e"] Less

function repositionElements(arr, indices) { // assert(arr.length === indices.length) var moved = []; for (var i = 0; i &lt; arr.length; i++) { moved.push(false); } var moveFrom, moveTo, itemToMove; for (moveFrom = 0; moveFrom &lt; arr.length; moveFrom++) { itemToMove = arr[moveFrom]; while (!moved[moveFrom]) { moveTo = indices[moveFrom]; var tmpItem = arr[moveTo]; arr[moveTo] = itemToMove; itemToMove = tmpItem; moved[moveFrom] = true; moveFrom = moveTo; } } return arr; } var arr = ["a", "b", "c", "d", "e", "f"], indices = [2, 3, 4, 0, 5, 1]; repositionElements(arr, indices); // returns: ["d", "f", "a", "b", "c", "e"] Less

Show More Responses
Meta

Given input: // could be potentially more than 3 keys in the object above items = [ {color: 'red', type: 'tv', age: 18}, {color: 'silver', type: 'phone', age: 20} ... ] excludes = [ {k: 'color', v: 'silver'}, {k: 'type', v: 'tv'}, .... ] function excludeItems(items, excludes) { excludes.forEach(pair => { items = items.filter(item => item[pair.k] === item[pair.v]); }); return items; } 1. Describe what this function is doing... 2. What is wrong with that function ? 3. How would you optimize it ?

24 Answers

I agree with converting the excludes to an object, but in order to get linear performance that doesn't depend on the number of excluded things, you have to concatenate the k and v into one value to be used as the key in the object: let excludesObject = {}; excludes.forEach(pair =&gt; excludesObject[`${pair.k}_${pair.v}`] = true); Then you can check if an item should be excluded in O(k) time where k is the number of keys in an item. And the whole thing will run in O(nk) where n is the number of items. // if there is some key which is found in the excludesObject, the filter will return false items = items.filter(item =&gt; !Object.keys(item).some(key =&gt; excludesObject[`${key}_${item[key]}`]); ); Facebook, hire me! lol Less

function excludeItems(items, excludes) { let excludesMap = excludes.reduce((entry, result)=&gt;{ entry[result.k + result.v] = true; return entry; },{}); return items.reduce( (result, item) =&gt; { let updatedObject = Object.keys(item).reduce( (result,key) =&gt; { if(!excludesMap[key + item[key]]){ result[key] = item[key] } return result; }, {}) result.push(updatedObject) return result; }, []) } Less

This solution will give much faster and immutable result. You can test with performance.now items.reduce((allItems, item) =&gt; { if(!excludes.some(exclude=&gt;item[exclude.k] === exclude.v)){ allItems.push(item); } return allItems; }, []); Less

Show More Responses
Meta

1. In JavaScript, write a function that takes an array as input that can contain both ints and more arrays (which can also contain an array or int) and return the flattened array. ex. [1, [2, [ [3, 4], 5], 6]] =&gt; [1, 2, 3, 4, 5, 6] 2. Using HTML and CSS, show how you would create an image that would display another image (aligned to the bottom, right) when the user hovers over the image. ex. The Facebook "edit profile picture" icon

12 Answers

ary.join().split(',');

array.toString().split(',').map(Number), map need because input array has only integer types. Less

var flatten = function(arr, resultArr) { var result = resultArr || []; for(var i = 0; i &lt; arr.length; i++) { if(Array.isArray(arr[i])) { flatten(arr[i], result); } else { result.push(arr[i]); } } return result; }; Less

Show More Responses
Viewing 1 - 10 of 9,647 Interview Questions

See Interview Questions for Similar Jobs

web developerui engineerfront end developernet developersoftware engineerui developer