Top những câu hỏi phỏng vấn React thường gặp - Phần 7

byHiju Blog -
0


Top những câu hỏi phỏng vấn React thường gặp - Phần 7



thumbnail





Tiếp tục chuỗi bài viết về Top những câu hỏi phỏng vấn React thường gặp, đây
sẽ là phần 7. 



Bây giờ hãy bắt đầu nào!




1. Redux Thumk là gì?



Redux Thunk middleware cho phép bạn viết các action creators trả về một hàm
thay vì một action. Thunk có thể được sử dụng để trì hoãn việc gửi một hành
động hoặc chỉ dispatch nếu một điều kiện nhất định được đáp ứng. Hàm bên trong
nhận các phương thức lưu trữ dispatch() và getState() làm tham số.




2. Sự khác nhau giữa redux-saga và redux-thunk?



Cả Redux Thunk và Redux Saga đều xử lý các tác dụng phụ. Trong hầu hết các
tình huống, Thunk sử dụng Promises để giải quyết chúng, trong khi Saga sử dụng
Generators. Thunk dễ sử dụng và Promise quen thuộc với nhiều nhà phát triển,
Sagas/Generators mạnh hơn nhưng bạn sẽ cần tìm hiểu chúng. Nhưng cả hai
middleware có thể cùng tồn tại, vì vậy bạn có thể bắt đầu với Thunks và giới
thiệu Sagas khi/nếu bạn cần chúng.



3. Redux DevTools là gì?



Redux DevTools là môi trường du hành thời gian chỉnh sửa trực tiếp dành cho
Redux với tính năng hot reloading, phát lại hành động và giao diện người dùng
có thể tùy chỉnh. Nếu bạn không muốn bận tâm đến việc cài đặt Redux DevTools
và tích hợp nó vào dự án của mình, hãy cân nhắc sử dụng Redux DevTools
Extension cho Chrome và Firefox.



4. Các tính năng của Redux DevTools là gì?





Dưới đây là một số tính năng chính của Redux DevTools,



  • Cho phép bạn kiểm tra mọi state và action payload.

  • Cho phép bạn quay ngược thời gian bằng cách cancelling actions.


  • Nếu bạn thay đổi reducer code, mỗi hành động theo giai đoạn sẽ được đánh
    giá lại.


  • Nếu reducers throw, bạn sẽ thấy điều này đã xảy ra trong hành động nào
    và lỗi là gì.


  • Với công cụ cải thiện lưu persistState(), bạn có thể duy trì các phiên
    gỡ lỗi trong các lần tải lại trang.







5. Redux selectors là gì và tại sao nên sử dụng chúng?




Selectors là các hàm lấy trạng thái Redux làm đối số và trả về một số dữ
liệu để chuyển đến components.



Ví dụ: để lấy chi tiết người dùng từ trạng thái:






const getUserData = (state) => state.user.data;






Selectors này có hai lợi ích chính,




  • Selectors có thể tính toán dữ liệu dẫn xuất, cho phép Redux lưu trữ
    trạng thái tối thiểu có thể.


  • Selectors không được tính toán lại trừ khi một trong các đối số của nó
    thay đổi.






6. React Form là gì?



Redux Form hoạt động với React và Redux để cho phép một form trong React sử
dụng Redux để lưu trữ tất cả trạng thái của nó. Redux Form có thể được sử dụng
với các đầu vào HTML5 thô, nhưng nó cũng hoạt động rất tốt với các UI
frameworks phổ biến như Material UI, React Widget và React Bootstrap.



7. Các tính năng chính của Redux Form là gì?



Một số tính năng chính của Redux Form là:



  • Field values tồn tại qua Redux store.

  • Redux store (đồng bộ hóa/không đồng bộ) và submission.

  • Định dạng, phân tích cú pháp và chuẩn hóa các field values.







8. Làm thế nào để add multiple middlewares vào Redux?



Bạn có thể sử dụng applyMiddleware().




Ví dụ: bạn có thể thêm redux-thunk và logger chuyển chúng làm
đối số cho applyMiddleware():






import { createStore, applyMiddleware } from "redux";
const createStoreWithMiddleware = applyMiddleware(
  ReduxThunk,
  logger
)(createStore);





9. Cách set initial state trong Redux?



Bạn cần chuyển trạng thái ban đầu làm đối số thứ hai cho createStore:





const rootReducer = combineReducers({
  todos: todos,
  visibilityFilter: visibilityFilter,
});

const initialState = {
  todos: [{ id: 123, name: "example", completed: false }],
};

const store = createStore(rootReducer, initialState);




10. Relay khác với Redux như thế nào?



Relay tương tự như Redux ở chỗ cả hai đều sử dụng một single store. Sự khác
biệt chính là relay chỉ quản lý trạng thái bắt nguồn từ máy chủ và tất cả
quyền truy cập vào trạng thái được sử dụng thông qua truy vấn GraphQL (để đọc
dữ liệu) và đột biến (để thay đổi dữ liệu). Relay lưu trữ dữ liệu vào bộ nhớ
cache cho bạn và tối ưu hóa việc tìm nạp dữ liệu cho bạn, bằng cách chỉ tìm
nạp dữ liệu đã thay đổi và không có gì khác.



11. Một action trong Redux là gì?




Các actions là các đối tượng JavaScript đơn giản hoặc payloads thông tin gửi
dữ liệu từ ứng dụng của bạn đến store của bạn. Họ là nguồn thông tin duy
nhất cho store. Các actions phải có thuộc tính loại cho biết loại actions
đang được thực hiện.




Ví dụ: hãy thực hiện một actions đại diện cho việc thêm một mục việc cần làm
mới:




{
  type: ADD_TODO,
  text: 'Add todo item'
}




Kết luận

Vậy là mình đã tổng hợp thêm một số câu hỏi thường gặp khi phỏng vấn React ở phần 6 này. Mình sẽ tiếp tục thu thập nhiều hơn các câu hỏi và chia sẽ đến với mọi người. Các bạn hãy theo dõi Trang để không bỏ lỡ các bài viết tiếp theo nhé. 


Tags

Hiju Blog

I'm HiJu

You may like these posts

Post a Comment

Previous Post Next Post