74 câu hỏi phỏng vấn React JS hàng đầu và câu trả lời

Câu hỏi và câu trả lời phỏng vấn React

Dưới đây là những câu hỏi phỏng vấn ReactJs và câu trả lời dành cho cả người mới bắt đầu và ứng viên có kinh nghiệm để có được công việc mơ ước của mình.

1) Reactjs là gì?

React là một thư viện JavaScript giúp xây dựng giao diện người dùng dễ dàng. Nó được phát triển bởi Facebook.

---

2) React có sử dụng HTML?

Không, nó sử dụng JSX, tương tự như HTML.

Tải xuống PDF miễn phí: Câu hỏi phỏng vấn React & Trả lời

---

3) React được phát hành lần đầu tiên vào khi nào?

React được phát hành lần đầu tiên vào tháng 2013 năm XNUMX.

---

4) Hãy cho tôi biết hai nhược điểm quan trọng nhất của React

• Việc tích hợp React với nền tảng MVC như Rails đòi hỏi cấu hình phức tạp.
• React yêu cầu người dùng phải có kiến ​​thức về việc tích hợp giao diện người dùng vào nền tảng MVC.

---

5) Nêu sự khác biệt giữa DOM thực và DOM ảo

DOM thực tế	DOM ảo
Nó được cập nhật chậm.	Nó cập nhật nhanh hơn.
Cho phép cập nhật trực tiếp từ HTML.	Không thể sử dụng để cập nhật HTML trực tiếp.
Nó lãng phí quá nhiều bộ nhớ.	Tiêu thụ bộ nhớ ít hơn

---

6) Khái niệm Flux trong React là gì?

Facebook sử dụng rộng rãi khái niệm kiến trúc Flux để phát triển các ứng dụng web phía máy khách. Nó không phải là một framework hay thư viện. Nó chỉ đơn giản là một loại kiến trúc mới bổ sung cho React và khái niệm Luồng Dữ liệu Đơn hướng.

---

7) Định nghĩa thuật ngữ Redux trong React

Redux là một thư viện được sử dụng để phát triển front-end. Đây là một bộ chứa trạng thái cho các ứng dụng JavaScript, được sử dụng để quản lý trạng thái của ứng dụng. Bạn có thể kiểm tra và chạy một ứng dụng được phát triển bằng Redux trong các môi trường khác nhau.

---

8) Tính năng 'Store' trong Redux là gì?

Redux có một tính năng gọi là 'Store' cho phép bạn lưu toàn bộ State của ứng dụng tại một nơi. Do đó, tất cả State của thành phần được lưu trữ trong Store để bạn có thể nhận được các bản cập nhật thường xuyên trực tiếp từ Store. Cây state duy nhất giúp bạn theo dõi các thay đổi theo thời gian và gỡ lỗi hoặc kiểm tra ứng dụng.

---

9) Hành động trong Redux là gì?

Đây là một hàm trả về một đối tượng hành động. Kiểu hành động và dữ liệu hành động luôn được lưu trữ trong đối tượng hành động. Các hành động có thể gửi dữ liệu giữa Store và ứng dụng phần mềm. Tất cả thông tin được Store truy xuất đều được tạo ra bởi các hành động.

---

10) Nêu tên các tính năng quan trọng của React

Sau đây là những tính năng quan trọng của React.

• Cho phép bạn sử dụng thư viện của bên thứ 3
• Tiết kiệm thời gian
• Phát triển nhanh hơn
• Đơn giản và có thể kết hợp
• Được hỗ trợ đầy đủ bởi Facebook.
• Tính ổn định của mã với liên kết dữ liệu một chiều
• Thành phần phản ứng

---

11) Giải thích thuật ngữ thành phần không trạng thái

Các thành phần không trạng thái là các hàm thuần túy chỉ hiển thị DOM dựa trên các thuộc tính được cung cấp cho chúng.

---

12) Giải thích về React Router

React Router là một thư viện định tuyến cho phép bạn thêm luồng màn hình mới vào ứng dụng của mình và cũng đồng bộ hóa URL với những gì đang hiển thị trên trang.

---

13) Gói hoạt hình phổ biến trong hệ sinh thái React là gì?

Gói hoạt hình phổ biến trong hệ sinh thái React là

• Phản ứng chuyển động
• Nhóm chuyển tiếp phản ứng

---

14) Jest là gì?

Jest là một khuôn khổ kiểm thử đơn vị JavaScript do Facebook tạo ra dựa trên Jasmine. Nó cung cấp khả năng tạo mô phỏng tự động và môi trường jsdom. Nó cũng được sử dụng như một thành phần kiểm thử.

---

15) Người điều phối là gì?

Bộ điều phối là trung tâm của ứng dụng, nơi bạn sẽ tiếp nhận các hành động và truyền tải dữ liệu đến các lệnh gọi lại đã đăng ký.

---

16) Hàm callback có nghĩa là gì? Mục đích của nó là gì?

Một hàm gọi lại phải được gọi khi setState hoàn tất và thành phần được kết xuất lại. Vì setState không đồng bộ, đó là lý do tại sao nó sử dụng hàm gọi lại thứ hai.

---

17) Giải thích thuật ngữ thành phần bậc cao

Một thành phần bậc cao hơn cũng được gọi tắt là HOC là một kỹ thuật tiên tiến để tái sử dụng logic thành phần. Nó không phải là một phần của React API, nhưng chúng là một mô hình xuất phát từ bản chất cấu thành của React.

---

18) Giải thích phân đoạn Trình bày

Phần trình bày là một phân đoạn cho phép bạn hiển thị HTML. Khả năng của phân đoạn là trình bày trong đánh dấu.

---

19) Props trong react js là gì?

Props nghĩa là thuộc tính, là cách truyền dữ liệu từ thành phần cha sang thành phần con. Ta có thể nói rằng props chỉ là một kênh giao tiếp giữa các thành phần. Nó luôn di chuyển từ thành phần cha sang thành phần con.

---

20) Từ khóa super trong React có tác dụng gì?

Từ khóa super giúp bạn truy cập và gọi các hàm trên đối tượng cha.

---

21) Giải thích câu khẩu hiệu yield trong JavaScript

Câu cửa miệng về năng suất được sử dụng để trì hoãn và tiếp tục một công việc tạo ra năng suất, được gọi là câu cửa miệng.

---

22) Nêu tên hai loại thành phần React

Có hai loại thành phần phản ứng là:

• Thành phần chức năng
• Thành phần lớp

---

23) Giải thích sự kiện tổng hợp trong React js

Sự kiện tổng hợp là một loại đối tượng hoạt động như một lớp bao bọc đa trình duyệt xung quanh sự kiện gốc của trình duyệt. Nó cũng giúp chúng ta kết hợp các hành vi của nhiều trình duyệt khác nhau vào API tín hiệu.

---

24) React State là gì?

Đây là một đối tượng quyết định cách một thành phần cụ thể hiển thị và cách nó hoạt động. Trạng thái lưu trữ thông tin có thể thay đổi trong suốt vòng đời của một thành phần React.

---

25) Làm thế nào để cập nhật trạng thái trong React JS?

Trạng thái có thể được cập nhật trên thành phần trực tiếp hoặc gián tiếp.

---

26) Giải thích cách sử dụng hàm mũi tên trong React

Hàm mũi tên giúp bạn dự đoán hành vi của lỗi khi được truyền dưới dạng lệnh gọi lại. Do đó, nó ngăn chặn lỗi do điều này gây ra.

---

27) Các bước trong vòng đời của React là gì?

Các bước quan trọng trong vòng đời của React js là:

• Khởi tạo
• Cập nhật tình hình/tài sản
• Phá hủy là vòng đời của React

---

28) Nêu sự khác biệt chính giữa Pros và State

Sự khác biệt chính giữa hai loại này là State có thể thay đổi còn Pros thì không thể thay đổi.

---

29) Giải thích các thành phần thuần túy trong React js

Các thành phần thuần túy là các thành phần nhanh nhất có thể thay thế bất kỳ thành phần nào chỉ bằng render(). Nó giúp bạn tăng cường tính đơn giản của mã và hiệu suất của ứng dụng.

---

30) Loại thông tin nào điều khiển một phân đoạn trong React?

Có chủ yếu hai loại thông tin kiểm soát một phân đoạn: Trạng thái và Đạo cụ

• Trạng thái: Thông tin trạng thái sẽ thay đổi, chúng ta cần sử dụng Trạng thái.
• Đạo cụ: Đạo cụ do tác giả thiết lập và được giải quyết trong suốt vòng đời của một phần.

---

31) 'create-react-app' là gì?

'create-react-app' là một công cụ dòng lệnh cho phép bạn tạo một ứng dụng React cơ bản.

---

32) Giải thích cách sử dụng 'key' trong danh sách phản ứng

Khóa cho phép bạn cung cấp cho mỗi phần tử danh sách một danh tính ổn định. Khóa phải là duy nhất.

---

33) Đạo cụ trẻ em là gì?

Các props trẻ em được sử dụng để truyền thành phần cho các thành phần khác dưới dạng thuộc tính. Bạn có thể truy cập nó bằng cách sử dụng

{props.children}

---

34) Giải thích ranh giới lỗi?

Ranh giới lỗi giúp bạn phát hiện lỗi Javascript ở bất kỳ đâu trong các thành phần con. Chúng được sử dụng nhiều nhất để ghi lại lỗi và hiển thị giao diện người dùng dự phòng.

---

35) Thẻ rỗng <> có tác dụng gì? ?

Các thẻ trống được sử dụng trong React để khai báo các đoạn mã.

---

36) Giải thích chế độ nghiêm ngặt

StrictMode cho phép bạn chạy kiểm tra và cảnh báo cho các thành phần phản ứng. Nó chỉ chạy trên bản dựng phát triển. Nó giúp bạn làm nổi bật các vấn đề mà không hiển thị bất kỳ giao diện người dùng nào.

---

37) Cổng phản ứng là gì?

Portal cho phép bạn kết xuất các phần tử con vào một nút DOM. Phương pháp CreatePortal được sử dụng cho mục đích đó.

---

38) Bối cảnh là gì?

React context giúp bạn truyền dữ liệu bằng cách sử dụng cây thành phần React. Nó giúp bạn chia sẻ dữ liệu toàn cục giữa các thành phần React khác nhau.

---

39) Webpack có tác dụng gì?

Webpack về cơ bản là một trình xây dựng mô-đun. Nó chủ yếu chạy trong quá trình phát triển.

---

40) Babel trong React js là gì?

Babel là trình biên dịch JavaScript chuyển đổi JavaScript mới nhất như ES6, ES7 thành JavaScript ES5 thông thường mà hầu hết các trình duyệt đều hiểu được.

---

41) Trình duyệt có thể đọc tệp JSX như thế nào?

Nếu bạn muốn trình duyệt đọc JSX, thì tệp JSX đó phải được thay thế bằng trình chuyển đổi JSX như Babel rồi gửi lại cho trình duyệt.

---

42) Những vấn đề chính khi sử dụng kiến ​​trúc MVC trong React là gì?

Sau đây là những thách thức chính mà bạn sẽ phải đối mặt khi xử lý kiến ​​trúc MVC:

• Xử lý DOM khá tốn kém
• Hầu hết các ứng dụng đều chậm và không hiệu quả
• Do các hàm tuần hoàn, một mô hình phức tạp đã được tạo ra xung quanh các mô hình và ý tưởng

---

43) Có thể làm gì khi có nhiều hơn một dòng biểu thức?

Vào thời điểm đó, biểu thức JSX nhiều dòng là lựa chọn duy nhất còn lại dành cho bạn.

---

44) Sự giảm sút là gì?

Giảm là một phương pháp ứng dụng để xử lý trạng thái.

---

45) Giải thích thuật ngữ sự kiện tổng hợp

Trên thực tế, đây là một wrapper đa trình duyệt xung quanh sự kiện gốc của trình duyệt. Các sự kiện này có giao diện stopPropagation() và preventDefault().

---

46) Khi nào bạn nên sử dụng các phần tử hạng nhất cho phần tử hàm?

Nếu phần tử của bạn có giai đoạn hoặc chu kỳ sống, chúng ta nên sử dụng các phần tử hàng đầu.

---

47) Làm thế nào để chia sẻ một phần tử trong quá trình phân tích cú pháp?

Sử dụng State, chúng ta có thể chia sẻ dữ liệu.

---

48) Giải thích thuật ngữ hòa giải

Khi trạng thái hoặc props của một thành phần thay đổi thì rest sẽ so sánh phần tử được render với DOM đã render trước đó và sẽ cập nhật DOM thực tế nếu cần. Quá trình này được gọi là đối chiếu.

---

49) Làm thế nào để render lại một thành phần mà không sử dụng hàm setState()?

Bạn có thể sử dụng hàm forceUpdate() để hiển thị lại bất kỳ thành phần nào.

---

50) Bạn có thể cập nhật props trong React không?

Bạn không thể cập nhật props trong react js vì props chỉ đọc. Hơn nữa, bạn không thể sửa đổi props nhận được từ parent sang child.

---

51) Giải thích thuật ngữ 'Tái cấu trúc'.

Tái cấu trúc là quá trình khai thác mảng đối tượng. Khi quá trình hoàn tất, bạn có thể tách từng đối tượng trong một biến riêng biệt.

---

52) Bạn có thể cập nhật giá trị của props không?

Không thể cập nhật giá trị của props vì nó không thể thay đổi.

---

53) Giải thích ý nghĩa của Mounting và Demounting

• Quá trình gắn phần tử vào DCOM được gọi là lắp ráp.
• Quá trình tháo rời phần tử khỏi DCOM được gọi là quá trình tháo lắp.

---

54) Thư viện 'prop-types' có tác dụng gì?

Thư viện 'Prop-types' cho phép bạn thực hiện kiểm tra kiểu thời gian chạy cho các prop và đối tượng tương tự trong ứng dụng gần đây.

---

55) Giải thích về hook phản ứng

React hooks cho phép bạn sử dụng State và các tính năng khác của React mà không cần viết lớp.

---

56) Mảnh vỡ là gì?

Bạn có thể sử dụng từ khóa fragment để nhóm danh sách các thành phần con mà không cần sử dụng bất kỳ nút bổ sung nào cho DOM. Ví dụ:

render() {

return (
);
}

---

57) Sự khác biệt chính giữa createElement và cloneElment là gì?

• createElement được react sử dụng để tạo các phần tử react.
• cloneElement được sử dụng để sao chép một phần tử và truyền cho nó các thuộc tính mới.

---

58) Thành phần được kiểm soát là gì?

Thành phần được kiểm soát là thành phần kiểm soát các phần tử đầu vào.

---

59) Tại sao bạn cần sử dụng props.children?

Props.children cho phép bạn truyền một thành phần dưới dạng dữ liệu cho các thành phần khác.

---

60) Liệt kê một số phương thức trong gói react-dom

Các phương pháp quan trọng cho các gói react-dom là:

• kết xuất ()
• hydrat hóa()
• tạoPortal()
• gỡ bỏ thành phần tại nút()
• tìmDOMNode()

---

61) Làm thế nào chúng ta có thể thực hiện render phía máy chủ trong React?

Chúng ta có thể sử dụng phản ứng phục vụ để thực hiện kết xuất phía máy chủ.

---

62) Hãy nêu sự khác biệt giữa getInitialState() và constructor()?

Nếu bạn muốn tạo một thành phần bằng cách mở rộng 'React. Component', hàm tạo sẽ giúp bạn khởi tạo State. Nhưng nếu bạn muốn tạo bằng cách sử dụng 'Reat.createClass.' thì bạn nên sử dụng 'genInitiaState.'

---

63) Refs là gì?

Ref là một thuộc tính của các phần tử DOM. Mục đích chính của ref là tìm các phần tử DOM một cách dễ dàng.

---

64) ComponentWillMount() là gì

componentWillMount() là thực hiện lệnh gọi API sau khi thành phần được khởi tạo và cấu hình các giá trị vào trạng thái. Để thực hiện lệnh gọi API, hãy sử dụng HttpClient như Axios hoặc chúng ta có thể sử dụng fetch() để kích hoạt lệnh gọi AJAX.

---

65) Làm thế nào để gửi dữ liệu trong cửa hàng?

Chúng ta có thể phân phối dữ liệu đến một thành phần khác dựa trên hành động lưu trữ thành phần cha.

---

66) Làm thế nào bạn có thể xử lý nhiều hành động hơn khi sử dụng redux?

Để tạo ra cùng một thành phần với nhiều luồng hành động hơn, chúng tôi sử dụng cùng một chức năng trong nhiều mô-đun khác nhau.

---

67) Làm sao bạn có thể làm đổ chất giảm tốc?

Chúng ta có thể đổ các cuộc giải cứu dựa trên các hành động sự kiện. Hành động đó nên được chia thành các mô-đun riêng biệt.

---

68) Kể tên năm nguyên mẫu được xác định trước được sử dụng trong React

Nguyên mẫu quan trọng nhất được sử dụng trong React js là:

• con số
• chuỗi
• mảng
• vật
• thành phần

---

69) Mục đích của việc sử dụng bindActionsCreators là gì?

BindActionCreator giúp bạn liên kết sự kiện dựa trên trình phân phối hành động với phần tử HTML.

---

70) REFS trong React là gì

Ref là tham chiếu đến phần tử. Nên tránh trong hầu hết các trường hợp. Tuy nhiên, đôi khi nó được sử dụng khi bạn cần truy cập DOM hoặc phiên bản của thành phần trực tiếp.

---

71) Phần tử JSX có thể được gắn vào các thành phần JSX khác không?

Có, bạn có thể sử dụng tính năng đính kèm phần tử JSX với các thành phần JSX khác, rất giống với việc lồng các phần tử HTML.

---

72) Phiên bản ổn định hiện tại của React là gì?

Phiên bản ổn định hiện tại của React là phiên bản 17.5

---

73) Nêu tên một tính năng quan trọng của các tính năng quy trình làm việc Redux

Các tính năng quan trọng của quy trình làm việc Redux là:

• Đặt lại: Giúp bạn đặt lại Trạng thái của Cửa hàng
• Hoàn nguyên: Cho phép bạn quay lại trạng thái đã cam kết cuối cùng
• Quét: Tất cả hành động vô hiệu hóa mà bạn có thể vô tình kích hoạt sẽ bị xóa
• Cam kết: Giúp bạn biến Trạng thái hiện tại thành Trạng thái ban đầu.

---

74) Nêu sự khác biệt giữa React JS và React Native

React JS là một thư viện JavaScript nguồn mở front-end được sử dụng để xây dựng UI, trong khi React Native là một khuôn khổ di động nguồn mở cho phép các nhà phát triển sử dụng React trên các nền tảng như Android và iOS. Những câu hỏi phỏng vấn này cũng sẽ giúp ích cho bài viva(oral) của bạn