Wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Frontend_ReactJS_SS18

Total questions: 18

Worksheet time: 9mins

Name
Class
Date
1.

Mục đích chính của Hook useReducer trong React là gì?

a)

Tạo timer định kỳ trong component

b)

Thay thế useState khi state phức tạp hoặc liên quan đến nhiều bước cập nhật

c)

Quản lý nhiều component cùng lúc

d)

Cập nhật DOM trực tiếp bằng ref

2.

useReducer nhận vào mấy tham số?

a)

1

b)

2

c)

3

d)

Không có tham số

3.

Lợi ích chính của việc dùng useReducer thay vì nhiều useState riêng lẻ là gì?

a)

Tăng tốc độ render UI

b)

Gộp và tổ chức logic cập nhật state phức tạp vào một nơi duy nhất

c)

Có thể dùng được ngoài React component

d)

Tự động lưu state vào localStorage

4.

Câu nào mô tả đúng chức năng chính của useContext?

a)

Giúp component render lại khi có sự kiện click

b)

Cho phép chia sẻ dữ liệu giữa các component mà không cần truyền props qua nhiều cấp

c)

Dùng để thay thế cho useReducer trong mọi trường hợp

d)

Tăng tốc độ truy xuất DOM

5.

Kết quả khi App được render là gì?

a)

Báo lỗi vì không có Provider

b)

Hiển thị "light"

c)

Hiển thị "dark"

d)

Hiển thị "undefined"

6.

Đoạn mã nào dưới đây đúng cách sử dụng useContext với TypeScript để truyền user info?

a)

b)

c)

d)

7.

Với đoạn code sau, khi nhấn nút, component Child có bị render lại không?

a)

Có, vì handleClick là hàm mới mỗi lần render

b)

Có, vì state count thay đổi

c)

Không, vì props không thay đổi

d)

Không, vì React.memo đã ngăn render

8.

Đoạn code nào sau đây là cách dùng đúng của useMemo?

a)

b)

c)

d)

9.

useCallback và useMemo khác nhau thế nào?

a)

useCallback ghi nhớ hàm, useMemo ghi nhớ giá trị trả về của hàm

b)

useCallback chỉ dùng với React.memo, còn useMemo không

c)

Cả hai ghi nhớ hàm giống nhau

d)

useCallback ghi nhớ giá trị trả về, useMemo ghi nhớ hàm

10.

Trường hợp nào không cần thiết dùng useCallback?

a)

Hàm được truyền xuống component con dùng React.memo

b)

Component chỉ render một lần duy nhất

c)

Hàm gọi API cần được gọi lại mỗi lần render

d)

Hàm là callback truyền xuống cho nhiều components

11.

Mỗi lần nhấn nút +, Child có render lại không?

a)

Có, vì count thay đổi

b)

Không, vì useMemo được dùng

c)

Không, vì props của Child không đổi

d)

Có, vì useState luôn làm render lại toàn bộ

12.

Giá trị double sẽ cập nhật khi nào?

a)

Khi value thay đổi

b)

Không bao giờ

c)

Khi có setTimeout

d)

Mỗi lần render

13.

Giá trị mới của count sau dispatch là gì?

a)

6

b)

5

c)

undefined

d)

"increment"

14.

Khi quản lý nhiều state dạng object, cách cập nhật dưới đây có gì sai?

a)

Sai vì làm mất các trường cũ như email, password

b)

Không sai, đây là cách cập nhật object

c)

Sai cú pháp JSX

d)

Sai vì không có setBirth

15.

Đâu là cách sử dụng useState đúng trong Functional Component?

a)

b)

c)

d)

16.

Trong functional component sau, giá trị nào sẽ được hiển thị nếu không truyền name?
Gọi component: <Info age={18} />

a)

undefined

b)

Không hiển thị gì

c)

" "

d)

Nguyen Van A

17.

Khi bạn gọi const [count, setCount] = useState(0);, biến count và hàm setCount lần lượt đại diện cho điều gì?

a)

count là số lần component render, setCount là hàm re-render

b)

count là giá trị ban đầu của state, setCount dùng để thay đổi biến thường

c)

count là state hiện tại, setCount là hàm dùng để cập nhật giá trị state

d)

count là props, setCount là hàm thay đổi props

18.

Trong React, tại sao không nên gán trực tiếp giá trị cho biến state như sau?

a)

Vì email không thể chứa kiểu chuỗi

b)

Vì React không nhận ra state đã thay đổi => không render lại

c)

Vì email chỉ được cập nhật từ props

d)

Vì JSX không hỗ trợ gán giá trị trực tiếp