Skip to main content

Front end Interview Question

· 7 min read
tip

Front End Interview Question Topic

  • Javascript
  • ReactJS
  • NodeJS
  • Network
  • Principle
  • Data Structure

Stack

Mindset/Communication Interview Question

Why do you want to be a developer?

How Software Engineers/Developers and Coders are different?

Tell a past story where you resolve conflicts between you and colleges.

What are your favorite books/courses/papers to self-learn?

What do you hope to learn from working in my company?

What are your hobbies outside of works?

Experience Interview Question

What are the activities in your most typical work days?

What is the most fascinated problems that you solved; or what is your proudest project?

Javascript Interview Question

Difference between promise and callback?

Difference between event bubbling and capturing?

Difference between callback and closure in JavaScript?

Difference between Debounce and throttle in JavaScript?

Difference between deep copy and shallow copy in JavaScript?

Difference between null and undefined in JavaScript?

Difference between == and === operator in JavaScript?

What are Hoisting?

What are closure?

What are Immediately-invoked Function Expressions (IIFE)?

Trình bày các tính năng của ES6?

Is Encoding the same as Escaping?

A Primer on the Different Types of Browser Storage?

What is ‘this’ keyword in JavaScript?

What would be the result of 3+2+”7″?

What is unescape() and escape() functions?

What are the decodeURI() and encodeURI()?

What is the difference between .call() and .apply()?

How can JavaScript codes be hidden from old browsers that do not support JavaScript?

Explain the binding behavior of this keyword.

Explain how inheritance in JavaScript works? (How is it different from other OOP languages like Java)

What are the different types of errors in JavaScript?

What are the different types of errors in JavaScript?

There are three types of errors:

  • Load time errors: Errors that come up when loading a web page, like improper syntax errors, are known as Load time errors and generate the errors dynamically.
  • Runtime errors: Errors that come due to misuse of the command inside the HTML language.
  • Logical errors: These are the errors that occur due to the bad logic performed on a function with a different operation.

What are the various functional components in JavaScript?

What are the various functional components in JavaScript?

The different functional components in JavaScript are

  • First-class functions: Functions in JavaScript are utilized as first-class objects. This usually means that these functions can be passed as arguments to other functions, returned as values from other functions, assigned to variables, or can also be stored in data structures.
  • Nested functions: The functions, which are defined inside other functions, are called Nested functions. They are called ‘every time the main function is invoked.

ReactJS Interview Question

What are synthetic events in React?

What’s the difference between super() and super(props) in React?

How do you build an npm package?

Compare function component to class component?

Trình bày các lifecycle trong React Component?

What are Higher-Order components?

What do you know about controlled and uncontrolled components?

What are Pure Components?

What is code-splitting?

tip

What is code-splitting?

Bundling is great, but as your app grows, your bundle will grow too. Especially if you are including large third-party libraries. You need to keep an eye on the code you are including in your bundle so that you don’t accidentally make it so large that your app takes a long time to load.

To avoid winding up with a large bundle, it’s good to get ahead of the problem and start “splitting” your bundle. Code-Splitting is a feature supported by bundlers like Webpack, Rollup and Browserify (via factor-bundle) which can create multiple bundles that can be dynamically loaded at runtime.

Code-splitting your app can help you “lazy-load” just the things that are currently needed by the user, which can dramatically improve the performance of your app. While you haven’t reduced the overall amount of code in your app, you’ve avoided loading code that the user may never need, and reduced the amount of code needed during the initial load.

What is dynamic import?

tip

What is dynamic import?

React.lazy takes a function that must call a dynamic import(). This must return a Promise which resolves to a module with a default export containing a React component.

The lazy component should then be rendered inside a Suspense component, which allows us to show some fallback content (such as a loading indicator) while we’re waiting for the lazy component to load.

Avoid fallback

Any component may suspend as a result of rendering, even components that were already shown to the user. In order for screen content to always be consistent, if an already shown component suspends, React has to hide its tree up to the closest <Suspense> boundary. However, from the user’s perspective, this can be disorienting.

However, sometimes this user experience is not desirable. In particular, it is sometimes better to show the “old” UI while the new UI is being prepared. ==> Using startTransition to fixed it

UI Framework Interview Question

Bạn biết những preprocessor nào?

Trình bày các Psuedo class trong CSS mà bạn biết?

Bạn đã biết những UI lib/framework nào

NodeJS Interview Question

Computer Science Interview Question

What are tail-calls optimization?

What is the difference between Process and Thread?

tip

EN - What is the difference between Process and Thread?

VI - What is the difference between Process and Thread?

The process and thread are an independent sequence of execution, but both are differentiated in a way that processes execute in different memory spaces, whereas threads of the same process execute in shared memory space.

  • A process in OS can remain in any of the following states:
NEW: A new process is being created.
READY: A process is ready and waiting to be allocated to a processor.
RUNNING: The program is being executed.
WAITING: Waiting for some event to happen or occur.
TERMINATED: Execution finished.

Explain Recursive.

Explain the “Big O” concept

What is the difference between Stack and Heap?

How would you implement a hash table?

What are the fundamental differences between Arrays and Linked Lists? When to use which?

Database Interview Question

Explain index in RDBMS ? Why do we need index, advantages and disadvantages?

What is transaction ? Explain Transaction Isolation Levels in DBMS ?

Coding skill

When do you need to violate DRY?

Difference between Terminal and Shell?

Difference between git merge and git rebase?

Assess: Are they fluent in their primary programming languages?

Assess: Are they proficient in their day-to-day tools (IDE, text editors, shells, etc.)?

Network Interview Question

What happens when you type a URL into your browser?

HTTP Request/Response có cấu trúc thế nào?

What is the difference between HTTP v1 and HTTP v2?

What is the difference between HTTP and HTTPS?

What is the difference between TCP and UDP?

What is the difference between SSL and TLS?

HTTP hoạt động như thế nào?

Explain what’s an HTTP Session.

Website