Top 30 Câu Hỏi Phỏng Vấn JavaScript & TypeScript 2026 – Thực Chiến Kèm Đáp Án Chi Tiết

Tổng hợp những câu hỏi phỏng vấn JavaScript và TypeScript mới nhất 2026 kèm đáp án chi tiết. Giúp Frontend Developer tự tin vượt qua vòng phỏng vấn kỹ thuật.

Virtual DOM là gì? React sử dụng thuật toán gì để diff giữa các lần render?
Khi gõ tìm kiếm nhanh gây ra kết quả trước sau lẫn lộn thì xử lý thế nào? (race condition)
Làm sao cache kết quả tìm kiếm để không re-fetch?
Sự khác nhau giữa Type và Interface
Generic là gì?
Các mapped types như Partial, Required,... hoạt động ra sao?
Điểm hạn chế của enum trong TypeScript

Event Loop hoạt động như thế nào? Microtask vs Macrotask?
Closure là gì? Cho ví dụ thực tế nơi closure gây bug hoặc memory issue.
this trong JavaScript hoạt động ra sao? Khác nhau giữa arrow function và function thường?
Prototype và Prototype Chain là gì? JavaScript là prototype-based nghĩa là gì?
Deep copy vs Shallow copy — khi nào gây bug production?
Debounce vs Throttle — khác nhau và dùng trong trường hợp nào?
Promise vs Async/Await — async/await có làm code synchronous không?
Các cách handle error trong async code? (try/catch, .catch, global handler)

unknown vs any — nên dùng cái nào và tại sao?
Union vs Intersection types — khác nhau thế nào?
never là gì? Khi nào TypeScript suy ra kiểu never?
keyof và typeof dùng để làm gì?
Type narrowing / type guards là gì? Ví dụ (in, typeof, instanceof).

Xem thêm: Những Câu Hỏi Phỏng Vấn Next.js 2026 Nâng Cao

Sau nhiều buổi phỏng vấn Frontend gần đây, mình nhận ra một sự thật rất rõ:

Framework có thể giúp bạn được gọi phỏng vấn.
Nhưng JavaScript và TypeScript mới là thứ quyết định bạn pass hay fail.

Rất nhiều developer học React, NextJS rất nhanh — nhưng lại thiếu nền tảng về cách JavaScript thực sự vận hành.

Và đó chính là thứ interviewer muốn kiểm tra.

Lưu ý: Đây không phải danh sách để học thuộc.
Các câu hỏi dưới đây thường được dùng để:

đo độ sâu kiến thức
đánh giá tư duy kỹ thuật
phân loại level developer

Nếu nắm vững phần này, bạn đã vượt qua phần lớn vòng technical.

1. Virtual DOM là gì? Diffing algorithm?

Virtual DOM là một bản sao nhẹ của DOM thật được lưu trong memory dưới dạng JavaScript object.

Cách React render:

Tạo Virtual DOM mới
So sánh với Virtual DOM cũ (diffing)
Chỉ update phần thay đổi vào Real DOM

Thuật toán:

React dùng heuristic O(n) thay vì O(n³).

Hai giả định chính:

Element khác type → replace toàn bộ subtree
Dùng key để nhận diện phần tử trong list

2. Race condition khi search

Xảy ra khi request gửi trước nhưng response về sau.

Cách xử lý tốt nhất:

AbortController

const controller = new AbortController();
fetch(url, { signal: controller.signal });
controller.abort();

Track request id
Chỉ update UI nếu response là request mới nhất.

React Query / SWR
Thư viện này xử lý sẵn.

3. Cache kết quả tìm kiếm

Mục tiêu: tránh gọi API lại.

Cách phổ biến:

Map / Object

const cache = new Map();

if(cache.has(query)) return cache.get(query);

Thư viện: React Query, SWR → auto cache + revalidate.

Advanced:

LRU cache
TTL (time expiration)

4. Type vs Interface

Interface

Extend dễ
Declaration merging
Tốt cho object / class

Type

Union, intersection
Flexible hơn

5. Generic là gì?

Cho phép viết code tái sử dụng nhưng vẫn giữ type safety.

function identity<T>(value: T): T {
  return value;
}

Use case senior:

API response wrapper
Repository pattern
Custom hooks

Keyword nên nói:
reusable + type-safe

6. Mapped Types

Cho phép tạo type mới từ type cũ.

Ví dụ Partial:

type Partial<T> = {
  [P in keyof T]?: T[P];
};

Phổ biến:

Partial → optional
Required → bắt buộc
Readonly
Pick / Omit

Thể hiện bạn hiểu type transformation.

7. Hạn chế của enum

Tạo runtime object → tăng bundle
Khó tree-shaking
Không linh hoạt

Xu hướng hiện đại:

type Role = "admin" | "user";

Nhẹ hơn + an toàn hơn.

8. Event Loop

JS là single-threaded nhưng xử lý async nhờ event loop.

Flow:

Call stack chạy sync
Async → Web APIs
Callback → Queue
Event loop đẩy vào stack

Microtask ưu tiên hơn Macrotask:

Microtask:

Promise
queueMicrotask

Macrotask:

setTimeout
setInterval

Câu bẫy: Promise chạy trước setTimeout.

9. Closure

Function nhớ được scope bên ngoài ngay cả khi scope đã kết thúc.

function counter() {
  let count = 0;
  return () => ++count;
}

Gây bug khi:

Giữ reference lớn → memory leak
Loop với var

Fix bằng let.

10. this hoạt động thế nào?

Phụ thuộc cách function được gọi, không phải nơi nó được viết.

Rule nhanh:

Method → this = object
Arrow → không bind this
call/apply/bind → set thủ công

11. Prototype Chain

JS không phải class-based — mà là prototype-based.

Khi truy cập property:

Tìm trong object
Không có → lên prototype
Cho tới null

12. Deep vs Shallow copy

Shallow: copy reference nested object.

{...obj}

Deep:

structuredClone(obj)

13. Debounce vs Throttle

Debounce: chỉ chạy sau khi user ngừng gõ.

Throttle: giới hạn số lần chạy theo interval.

Search → debounce
Scroll → throttle

14. Promise vs Async/Await

Async/await chỉ là syntax sugar của Promise.

Không làm code synchronous — vẫn async.

Ưu điểm:

Dễ đọc
Try/catch

15. Handle error async

✔ try/catch
✔ .catch()
✔ Global handler

16. unknown vs any

any: tắt type checking
unknown: phải check trước khi dùng.

Luôn prefer unknown.

17. Union vs Intersection

Union (|) → một trong các type
Intersection (&) → phải có tất cả

Intersection dễ tạo conflict.

18. never

Type của giá trị không bao giờ xảy ra.

Ví dụ:

Function throw error
Infinite loop

Dùng để exhaustive checking trong switch.

19. keyof & typeof

keyof: lấy key của object thành union type.

type Keys = keyof User;

typeof: lấy type từ biến.

Rất mạnh khi build reusable types.

20. Type Guards / Narrowing

Giúp TS hiểu type cụ thể hơn.

Ví dụ:

if(typeof value === "string") {
}

Hoặc:

in
instanceof
custom guard

Có một pattern rất rõ:

Nếu bạn trả lời sâu các chủ đề như Event Loop, Closure hoặc Generics, interviewer gần như sẽ tăng độ khó ngay lập tức — vì họ biết bạn không chỉ học thuộc.