Question and answer

JavaScipt

1) What is the difference between native and host object?

- Native object: Array, Object, String - Host object: environment object such window, getElementById()

2) What is the event delegation ?

In dictionary, delegration means: a set of people chosen or elected to represent a larger group.

So, in case you want to assign event listeners for a variety of DOM elements, you might need to declare only one function put in the parent element. Then you can trace the nested child element using event.target.

3) What is prototype in JavaScript?

- Native object: Array, Object, String - Host object: environment object such window, getElementById()

4) What is the "immutability" in JavaScript?

- Native object: Array, Object, String - Host object: environment object such window, getElementById()

5) What are the differences between shallow and deep clone/copy?

Shallow copy: spread operator, Object.assign. For array, you might use Array.prototype.slice()||map()||filter()||reduce().

Deep copy: using structuredClone(), _.cloneDeep (lodash) or JSON.parse (JSON.stringify(a)).

6) What does the function getBoundingClientRect() return?

It returns information about the size of an element and its position relative to the viewport.

7) What is the decorator ?

Normally written as @Component(), decorator is a kind of function in TypeScript that allows you declare (meta) data such as those used in Angular or Nestjs.

8) What is the difference between low and high programming languages ?

Low: close to the machine code such as C, C++. Higher: easier to write and read, kinda human-friendly languages such as Python, PHP or JavaScript

9) Difference between localStorage and cookies ?

Cookies and localStorage serve different purposes. Cookies are primarily for reading server-side, local storage can only be read by the client-side. Cookies 4096 bytes, while localStorage is as big as 5MB per domain.

10) What is the singleton design pattern?

Create only one instance and no more from a defined class

11) What are Closures in JavaScript?

Closures in JavaScript are a feature where an inner function has access to the outer function’s variables.

12) What is the best way to remove Duplicates from a JavaScript Array?

There are many ways to remove dublicated items such as looping, filter or using Set.

CSS

1. Please compare relative and absolute css property?

They are two among 5 different types of CSS positions [static, relative, absolute, fixed, sticky]. By default, any element is given static value. Relative: the element is positioned according to its original position. Absolute: elements are positioned according to the nearest containing(parent) element. The parent should be declared as relative.

2. Comparing "resetting" and "normalizing" CSS?

- Resetting - Resetting is meant to strip all default browser styling on elements - Normalizing - Normalizing preserves useful default styles rather than "unstyling" everything.

3. Differentiate Between Ordered List and Unordered List ?

- ol - ul

4. What are the different ways to hide an Element using CSS?

- display: none - visibility: hidden - position: absolute

5. What are CSS Sprites?

- CSS sprites are used to minimize the loading time of a web page by combining multiple small pictures into a single image.

General

1) How do you learn new concept?

Open ending question.

2) Imagine yourself in next 5 years?

Open ending question.

3) Name a few Git Commands and function

Open ending question.

References

https://github.com/duyet/vietnamese-frontend-interview-questions#hỏi-chơi-cho-vui

https://www.frontendinterviewhandbook.com/

https://www.simplilearn.com/tutorials/programming-tutorial/front-end-developer-interview-questions