Skip to content

50 câu hỏi phỏng vấn React (p1)

Và gợi ý trả lời cập nhật 5/2026.
Bạn đang chuẩn bị cho buổi phỏng vấn vị trí Frontend Developer? Gần như chắc chắn React sẽ xuất hiện — dù bạn apply vào một startup nhỏ hay một công ty product lớn. Vấn đề là, React có rất nhiều khái niệm, và không phải ai cũng biết mình cần ôn gì, bỏ gì.
Bài viết này tổng hợp 50 câu hỏi phỏng vấn React phổ biến nhất — từ cơ bản đến nâng cao — kèm gợi ý trả lời ngắn gọn, đủ để bạn nắm vững ý chính và tự tin trình bày trong phòng phỏng vấn.

Câu 1: React là gì?

React là một thư viện JavaScript dùng để xây dựng giao diện người dùng (UI), được phát triển bởi Facebook (nay là Meta). React cho phép bạn chia nhỏ UI thành các component độc lập, tái sử dụng được — giúp code dễ quản lý và bảo trì hơn nhiều so với cách viết UI truyền thống.
Phiên bản hiện tại là React 19 (stable từ tháng 12/2024, mới nhất là 19.2 - tháng 10/2025), với nhiều cải tiến lớn về async workflows, Server Components, và Actions API.
Lưu ý: React là thư viện, không phải framework. Nó chỉ đảm nhiệm phần View trong mô hình MVC.

Câu 2: React có dùng HTML không?

Không trực tiếp. React sử dụng JSX (JavaScript XML) — một cú pháp trông giống HTML nhưng thực chất là JavaScript.
JSX được Babel (hoặc các transpiler tương tự như SWC, esbuild) biên dịch thành các lời gọi React.createElement() trước khi chạy trên trình duyệt. Các build tool như Vite hay Webpack thường tích hợp sẵn bước này trong quá trình build.
// JSX
const element = <h1>Hello, world!</h1>;

// Sau khi biên dịch
const element = React.createElement('h1', null, 'Hello, world!');

Câu 3: React ra mắt lần đầu vào năm nào?

React được phát hành lần đầu vào tháng 3 năm 2013, ban đầu dùng nội bộ tại Facebook trước khi được open-source. Đây là một mốc quan trọng vì React đã thay đổi cách cộng đồng frontend tiếp cận việc xây dựng UI theo hướng component-based.

Câu 4: Hai nhược điểm lớn nhất của React là gì?

1. Chỉ là View layer — React không phải một framework đầy đủ. Bạn cần tự lắp ghép thêm các thứ như routing (React Router), state management (Redux, Zustand…), fetching data… Điều này tạo ra sự linh hoạt, nhưng cũng dễ gây “configuration hell” nếu không có kinh nghiệm.
2. Tốc độ học có thể bị đánh giá thấp — JSX, Virtual DOM, component lifecycle, hooks… là những khái niệm mới so với HTML/CSS thuần. Người mới bắt đầu đôi khi bị overwhelm vì phải học quá nhiều thứ cùng lúc.

Câu 5: Sự khác biệt giữa Real DOM và Virtual DOM là gì?

Real DOM
Virtual DOM
Tốc độ cập nhật
Chậm hơn
Nhanh hơn
Cập nhật trực tiếp từ HTML
Không
Bộ nhớ
Tốn nhiều hơn
Tiết kiệm hơn
There are no rows in this table
Virtual DOM là một bản sao nhẹ của Real DOM được React lưu trong bộ nhớ. Mỗi khi state thay đổi, React tạo một Virtual DOM mới, so sánh với bản cũ (quá trình này gọi là diffing), rồi chỉ cập nhật đúng những phần thực sự thay đổi lên Real DOM — thay vì re-render toàn bộ trang.

Câu 6: Flux trong React là gì?

Flux là một kiến trúc quản lý luồng dữ liệu (data flow) trong ứng dụng React, được Facebook giới thiệu cùng thời điểm với React. Flux không phải thư viện hay framework — nó là một pattern (mô hình thiết kế).
Điểm đặc trưng của Flux là Unidirectional Data Flow (luồng dữ liệu một chiều):
Action → Dispatcher → Store → View → (Action mới)
Ngày nay, Flux ít được nhắc đến hơn vì Redux và các thư viện state management hiện đại (Zustand, Jotai…) đã kế thừa và cải tiến tư tưởng này.

Câu 7: Redux là gì?

Redux là một thư viện quản lý state cho JavaScript, thường được dùng kết hợp với React. Redux lưu toàn bộ state của ứng dụng vào một nơi duy nhất gọi là Store, giúp việc debug và theo dõi thay đổi trở nên dễ dàng hơn.
Redux hoạt động theo 3 nguyên tắc cốt lõi:
Single source of truth — toàn bộ state nằm trong một Store duy nhất
State is read-only — chỉ được thay đổi state thông qua Action
Pure functions — các thay đổi được xử lý bởi Reducer (hàm thuần túy)
Thực tế hiện nay: Với các dự án nhỏ-vừa, nhiều team chuyển sang Zustand hoặc React Context + useReducer vì nhẹ hơn và ít boilerplate hơn Redux.

Câu 8: Store trong Redux là gì?

Store là nơi lưu trữ toàn bộ state của ứng dụng Redux. Thay vì mỗi component tự quản lý state riêng, tất cả dữ liệu được tập trung tại Store — giúp các component ở bất kỳ đâu trong cây component đều có thể đọc dữ liệu mà không cần truyền props qua nhiều tầng.
import { createStore } from 'redux';

const store = createStore(rootReducer);

store.getState(); // Đọc state hiện tại
store.dispatch(action); // Gửi action để thay đổi state
store.subscribe(fn); // Lắng nghe khi state thay đổi

Câu 9: Action trong Redux là gì?

Action là một plain JavaScript object mô tả điều gì đó đã xảy ra trong ứng dụng. Mỗi action bắt buộc có trường type để Reducer biết cần xử lý gì, và có thể kèm thêm dữ liệu trong trường payload.
// Action object
{ type: 'INCREMENT_COUNT', payload: 1 }

// Action creator (hàm trả về action)
const increment = (amount) => ({
type: 'INCREMENT_COUNT',
payload: amount,
});
Action được gửi đến Store thông qua store.dispatch(action), sau đó Reducer nhận action và trả về state mới.

Câu 10: Các tính năng quan trọng của React là gì?

Component-based — UI được chia thành các component nhỏ, độc lập, tái sử dụng được
Virtual DOM — cập nhật UI hiệu quả, chỉ re-render những phần thực sự thay đổi
JSX — cú pháp kết hợp JS và HTML, giúp code trực quan hơn
Unidirectional Data Flow — dữ liệu chảy một chiều từ cha xuống con, dễ debug
Hooks — cho phép dùng state và lifecycle trong functional component
Hệ sinh thái phong phú — hàng nghìn thư viện tương thích, được Facebook/Meta hỗ trợ lâu dài
Kể từ React 19, một số tính năng đáng chú ý được bổ sung thêm:
Actions — xử lý async operations (form submit, API call) gọn hơn, không cần quản lý loading/error state thủ công
Hooks mớiuseActionState, useOptimistic, useFormStatus hỗ trợ các async UI pattern phổ biến
Server Components — render component trên server, giảm bundle size và tăng tốc load lần đầu
React Compiler (stable từ 2025) — tự động tối ưu re-render, giảm nhu cầu dùng useMemo/useCallback thủ công

Câu 11: Stateless Component là gì?

Stateless Component (hay còn gọi là Presentational Component) là component không có state nội bộ — nó chỉ nhận props từ component cha và render UI dựa trên đó.
Stateless component hoạt động như hàm thuần túy: cùng một input (props) luôn cho ra cùng một output (UI). Điều này giúp chúng dễ test, dễ đọc, và dễ tái sử dụng hơn.

Câu 12: React Router là gì?

React Router là thư viện routing phổ biến nhất cho React, cho phép bạn xây dựng Single Page Application (SPA) với nhiều “trang” mà không cần reload trình duyệt. React Router đồng bộ URL trên thanh địa chỉ với UI đang hiển thị, giúp người dùng có thể bookmark, share link, hoặc nhấn nút Back/Forward như một website thông thường.
Kể từ React Router v7 (ra mắt cuối 2024), có một thay đổi đáng chú ý: package react-router-dom đã được gộp vào react-router — bạn chỉ cần cài và import từ một package duy nhất:
v7 cũng bổ sung hỗ trợ tốt hơn cho SSR, static pre-rendering, và tích hợp với React 19 Server Components — đặc biệt hữu ích khi dùng với các framework như Next.js hoặc Remix.

Câu 13: Dispatcher trong Flux là gì?

Dispatcher là trung tâm điều phối trong kiến trúc Flux. Nó nhận các Action từ mọi nơi trong ứng dụng và phát (broadcast) chúng đến tất cả các Store đã đăng ký lắng nghe — Store sau đó tự quyết định có xử lý action đó hay không.
Dispatcher đảm bảo luồng dữ liệu luôn đi theo một chiều duy nhất và các Store được cập nhật theo thứ tự nhất quán, tránh các vòng lặp phụ thuộc lẫn nhau.
Trong Redux, khái niệm Dispatcher được đơn giản hóa thành store.dispatch(action) — không còn cần một Dispatcher riêng biệt như trong Flux thuần túy.

Câu 14: Callback function trong setState là gì?

Đây là khái niệm của class component (cú pháp cũ). setState trong class component nhận tham số thứ hai là một callback, được gọi sau khi state đã cập nhật xong và component đã re-render:
Lý do cần callback là vì setState trong class component bất đồng bộ — bạn không thể đọc state mới ngay sau dòng setState.
Với functional componentuseState (cách viết hiện đại), bạn dùng useEffect để theo dõi khi state thay đổi thay vì dùng callback:

Câu 15: Higher-Order Component (HOC) là gì?

HOC là một hàm nhận vào một component và trả về một component mới có thêm tính năng — đây là pattern để tái sử dụng logic giữa các component.
HOC không phải một tính năng của React API mà là một pattern xuất phát từ tính chất composable của React.
Thực tế hiện nay: HOC vẫn còn dùng, nhưng Custom Hooks thường được ưu tiên hơn vì code đơn giản và dễ đọc hơn.

Câu 16: Thư viện prop-types dùng để làm gì?

prop-types là thư viện giúp kiểm tra kiểu dữ liệu của props trong runtime (lúc chạy) — nếu component nhận sai kiểu dữ liệu, React sẽ hiển thị warning trong console.
Thực tế hiện nay: prop-types chỉ check lúc runtime và không hỗ trợ IDE autocompletion. Hầu hết dự án mới hiện dùng TypeScript thay thế — TypeScript kiểm tra kiểu dữ liệu ngay lúc viết code (compile time) và tích hợp tốt với mọi editor.

Want to print your doc?
This is not the way.
Try clicking the ··· in the right corner or using a keyboard shortcut (
CtrlP
) instead.