Câu hỏi phỏng vấn React thường gặp + cách trả lời đúng (2026)

Đi phỏng vấn React mà chỉ học thuộc định nghĩa thì rất dễ lộ: người phỏng vấn hỏi thêm một câu "vì sao" là tắc. Bài này gom những câu hỏi phỏng vấn React và Frontend hay gặp nhất, chia theo cấp độ, kèm đáp án ngắn gọn nhưng đúng kiến thức. Mục tiêu là bạn hiểu để diễn đạt bằng lời của mình, không phải đọc vẹt.

Nhóm 1 - JavaScript nền tảng (đừng bỏ qua)

Rất nhiều buổi phỏng vấn ReactJS bắt đầu bằng JavaScript, vì React thực chất là JavaScript. Hổng phần này thì phần React phía sau cũng lung lay.

• var, let, const khác nhau ở đâu? var có function scope và bị hoisting (đẩy khai báo lên đầu), dễ gây bug. let và const có block scope. const không gán lại được biến, nhưng object/array bên trong vẫn mutate được.
• Closure là gì? Là khi một function "nhớ" được các biến ở scope nơi nó được tạo ra, kể cả khi đã chạy ra ngoài scope đó. Đây là nền tảng để hiểu vì sao state trong React hook hoạt động.
• == và === khác gì? == so sánh có ép kiểu (type coercion), === so sánh cả giá trị lẫn kiểu. Luôn ưu tiên === để tránh bug khó lường.
• Event loop / bất đồng bộ hoạt động ra sao? JavaScript chạy đơn luồng. Tác vụ bất đồng bộ (timer, fetch) được đẩy ra ngoài, khi xong mới quay lại queue và được event loop đưa vào call stack khi stack rỗng. Promise và async/await là cách viết code bất đồng bộ dễ đọc.
• map, filter, reduce dùng để làm gì? map biến đổi từng phần tử và trả mảng mới; filter lọc; reduce gộp về một giá trị. map xuất hiện liên tục khi render list trong React.

Nhóm 2 - React core

Đây là phần xương sống của mọi buổi phỏng vấn React.

• React là gì, vì sao dùng? Là thư viện xây UI theo hướng component. Điểm mạnh: chia UI thành các mảnh tái sử dụng, và cập nhật DOM hiệu quả thông qua cơ chế so sánh thay vì thao tác DOM thủ công.
• Component và JSX là gì? Component là một function trả về JSX (cú pháp giống HTML viết trong JavaScript). JSX cuối cùng được biên dịch thành các lời gọi tạo React element.
• Props và State khác nhau thế nào? Props là dữ liệu truyền từ component cha xuống con, con không được sửa (read-only). State là dữ liệu nội bộ của component, thay đổi được và khi đổi sẽ kích hoạt re-render. Một câu chốt tốt: props đi xuống, state thuộc về chính component.
• Virtual DOM là gì? Là một bản mô tả UI bằng object JavaScript trong bộ nhớ. Khi state đổi, React tạo bản mô tả mới rồi so sánh với bản cũ để tính ra thay đổi tối thiểu cần áp lên DOM thật.
• Reconciliation (so khớp) là gì? Là quá trình React đối chiếu cây render mới với cây cũ để quyết định cần cập nhật những node DOM nào. Theo react.dev, render chia làm 3 bước: trigger (state đổi), render (gọi lại function component để tính UI), và commit (chỉ áp những thay đổi tối thiểu lên DOM). Node nào không đổi thì React để nguyên.
• key prop dùng để làm gì? Khi render list, key giúp React nhận diện phần tử nào được thêm, xóa hay đổi vị trí, để giữ đúng state/DOM cho từng item. Key nên duy nhất giữa các sibling và ổn định qua các lần render (thường lấy id từ dữ liệu).
• Vì sao không nên dùng array index làm key? Vì khi list bị thêm, xóa hay đảo thứ tự, index sẽ lệch khỏi item, khiến React gán nhầm state và sinh bug khó lần (ví dụ input giữ sai giá trị). Chỉ dùng index khi list tĩnh, không đổi thứ tự.
• Hooks là gì, lợi ích? Là cách dùng state và các tính năng React trong function component, không cần class. Lợi ích: code gọn hơn, tái sử dụng logic qua custom hook, dễ đọc.
• Rules of Hooks? Chỉ gọi hook ở top level của component hoặc custom hook, không gọi trong if/loop/nested function. Lý do: React dựa vào thứ tự gọi hook ổn định giữa các lần render để map đúng state. Có eslint-plugin-react-hooks để bắt lỗi này.
• useState làm gì? Khai báo một biến state; gọi hàm set sẽ queue một lần re-render với giá trị mới. Lưu ý không mutate trực tiếp mà tạo giá trị mới (ví dụ spread array/object).
• useEffect dùng khi nào? Để đồng bộ component với một hệ thống bên ngoài React: gọi API, timer, event listener, thư viện ngoài. Dependency array quyết định khi nào effect chạy: [] chạy một lần sau mount, [a, b] chạy lại khi a hoặc b đổi, không truyền gì thì chạy sau mỗi render. Hàm return trong effect là cleanup, chạy trước lần chạy kế tiếp và khi unmount.
• Bẫy hay gặp về useEffect: react.dev nói rõ đừng dùng effect để biến đổi dữ liệu cho việc render (tính trực tiếp khi render là đủ) và đừng dùng để xử lý sự kiện người dùng (việc đó thuộc về event handler). Nói được câu này thường gây ấn tượng vì nhiều người lạm dụng useEffect.
• Controlled vs Uncontrolled component? Controlled: giá trị input do React state quản lý (value + onChange). Uncontrolled: DOM tự giữ giá trị, đọc qua ref. Thực tế đa số dùng controlled để dễ validate và kiểm soát.
• Lift state up là gì? Khi hai component cần chia sẻ state, ta đưa state đó lên component cha chung gần nhất rồi truyền xuống qua props. Tránh duplicate state ở nhiều nơi.
• Pure component / purity? Theo react.dev, render phải "thuần": cùng input (props/state) cho cùng output JSX, và không được mutate props/state hay biến bên ngoài trong lúc render. Purity giúp React tối ưu, render an toàn, bỏ qua re-render khi input không đổi. Side effect phải đặt trong event handler hoặc useEffect.

Nhóm 3 - Nâng cao: performance + state management

Vòng này phân loại junior với middle/senior.

• Re-render thừa và cách tối ưu? Component re-render khi state/props đổi, và mặc định kéo theo các con. Cách giảm: React.memo cho component, useMemo để cache giá trị tính toán nặng, useCallback để giữ ổn định reference của function truyền xuống con. Quan trọng: chỉ tối ưu khi đo được vấn đề, đừng rải memo khắp nơi.
• useMemo và useCallback khác gì? useMemo nhớ một giá trị; useCallback nhớ một function. Cả hai tránh tạo lại reference mỗi lần render, hữu ích khi truyền xuống component đã memo hóa.
• useRef để làm gì? Giữ một giá trị không gây re-render khi đổi, hoặc tham chiếu tới DOM node (ví dụ focus input). Khác state ở chỗ đổi .current không trigger render.
• useReducer khi nào? Khi logic state phức tạp, nhiều nhánh cập nhật liên quan nhau; gom về một reducer dễ test và dễ đọc hơn nhiều useState rời rạc.
• Context API vs Redux/Zustand? Context hợp cho dữ liệu ít đổi, dùng toàn app (theme, user, locale). State phức tạp, đổi liên tục thì dùng thư viện chuyên như Redux Toolkit hoặc Zustand để tránh re-render lan và quản lý tốt hơn. (Xem thêm bài React Hooks để nắm kỹ từng hook.)
• Code splitting / lazy loading? Dùng React.lazy + Suspense để tách bundle, chỉ tải component khi cần, giúp trang vào nhanh hơn.

Nhóm 4 - Thực tế: dự án + coding

Phần này kiểm tra bạn có thật sự làm sản phẩm hay chỉ học lý thuyết.

• Kể về một dự án React bạn làm. Nói rõ: bài toán, vai trò của bạn, quyết định kỹ thuật và lý do, khó khăn gặp phải và cách xử lý. Có link deploy thật thì điểm cộng lớn.
• Gọi API chuẩn thế nào? Phải xử lý loading và error state, hủy request khi component unmount (dùng AbortController) để tránh leak và race condition. Thực tế nên dùng TanStack Query, SWR hoặc RTK Query để lo cache, retry, dedupe thay vì tự viết tay.
• Vòng thuật toán/coding: đừng bất ngờ, phỏng vấn Frontend rất hay có một vòng coding hoặc thuật toán. Dạng hay gặp: xử lý mảng/chuỗi, đệ quy, độ phức tạp Big-O cơ bản, hoặc bài live-coding dựng một component nhỏ (ví dụ autocomplete, debounce search, todo). Luyện đều dạng này giúp bạn không "khựng" khi bị nhìn lúc gõ code.

Mẹo trả lời + nhà tuyển dụng tìm gì

• Trả lời theo tầng: câu ngắn gọn trước, rồi mới đào sâu nếu được hỏi tiếp. Đừng đổ một tràng lý thuyết.
• Luôn kèm "vì sao" và ví dụ thật: "Tôi dùng useCallback ở đây vì truyền hàm xuống một list item đã React.memo, tránh re-render thừa." Cụ thể hơn định nghĩa khô.
• Không biết thì nói thẳng và trình bày cách bạn sẽ tìm ra. Trung thực ăn điểm hơn chém gió.
• Nhà tuyển dụng thật sự tìm: tư duy giải quyết vấn đề, hiểu bản chất (không học vẹt), thói quen viết code sạch, và khả năng giao tiếp kỹ thuật rõ ràng. Junior không cần biết tất cả, nhưng cần nền tảng vững và biết mình đang nói gì.

Nếu bạn đang lên kế hoạch học bài bản trước khi đi phỏng vấn, tham khảo Lộ trình học ReactJS và Lương Frontend React để biết cần đạt mức nào.

Đậu phỏng vấn = nền tảng vững + tay nghề coding

Đậu phỏng vấn React không đến từ học thuộc 100 câu hỏi, mà từ hai chân: nền tảng React thật vững để trả lời được mọi câu "vì sao", và tay nghề coding/thuật toán để vượt vòng live-coding. Khóa React PRO của HoleTex dạy React từ nền tảng đến dự án đi làm được, đúng phần phỏng vấn hay xoáy. Còn để khỏi khựng ở vòng coding, luyện đều trên nền tảng Algo của HoleTex: bài tập thuật toán có chấm tự động và trợ lý AI hướng dẫn. Vững cả hai chân là bạn bước vào phòng phỏng vấn với tâm thế khác hẳn.

Bài liên quan

• Lộ trình học ReactJS từ con số 0 đến đi làm
• Lương Frontend React Developer 2026
• Portfolio xin việc Frontend
• React Hooks là gì? useState và useEffect
• Quản lý state trong React

Nguồn tham khảo: react.dev (Render and Commit; useEffect; Keeping Components Pure; Rendering Lists; Rules of Hooks), GreatFrontend "Top 30 React Interview Questions and Answers". Đã đối chiếu để đảm bảo đúng kiến thức, cập nhật 2026-06-04.