Tan's Notes

setState is asynchronous action - If you need to use the updated state to do something, you should use a callback function in setState , so it will call after the state is updated: this.setState({data: newData}, () => console.log(this.state.data)) - If you wanna update the state with anything else, for example, set the '"title" to be "Hello", you can use the object in setState function, like this: this.setState({title: 'Hello'}) - But if you have to take the current state and use it to evaluate what to update, you should pass a function to setState function, so you will have access to the previous state and previous props. It will guarantees that you always get the latest update of the state or props: this.setState((prevState, prevProps) => {     return {count: prevState.count + 1}   } )

You can not bind arrow function They automatically get what called lexical scoping - which mean, they bind " this " context to the place where they were defined in the first place It's easier to write class method by using arrow function, so you can stop worry about bind " this "

Caveat: If you .fill() an Array with an object, all elements refer to the same instance (i.e., the object isn’t cloned) So if you do something like: let a = Array(3).fill([]) // create an array named a and fill it with 3 empty array a[2].push('poop') // push new value to the element array at index 2 expect [ [], [], [2]] But because all element refer to the same instance, so the result is: [[2], [2], [2]] More details here:  https://2ality.com/2018/12/creating-arrays.html

"Recursion is when a function calls itself until it doesn't" Là một hàm gọi chính nó cho tới khi dừng. Vậy khi nào nó dừng? Khi nó thỏa điều kiện và không gọi chính nó nữa! (Duh? I'm I a joke to you) Vâng đúng là như vậy. Trong Recursion nó hai phần chính: - Base case: Trường hợp cơ bản - Tại case này, hàm sẽ không gọi lại chính nó nữa => Recursion sẽ dừng lại. - Recursive case: Trường hợp recursive - Như tên gọi, case này thì hàm sẽ tiếp tục gọi (recursive) chính nó tiếp. Ví dụ: Bằng bài toàn tìm giai thừa (factorial) function factorial(num) { if (num === 1 ) return 1 // Base case return num * factorial(num - 1 ) // Recursive case } console.log(factorial( 4 )) // 24 Để hiểu hơn, hãy xem Call stack của hàm trên: 4. factorial(1) | return 1 3. factorial(2) | return 2 * factorial(1) 2. factorial(3) | return 3 * factorial(2) 1. factorial(4) | return 4 * factorial(3) Như vậy sau khi hàm dừng recursive thì Call

Redux giúp mình State management  - Quản lý State dễ thở hơn. Nếu bạn đã truyền (passing) props giữa các component thì chắc bạn sẽ gặp 1 lúc mà việc pass đi như vậy phức tạp và rườm rà nếu tụi nó nest nhau quá nhiều tầng, hoặc nhiều component cùng dùng chung một cái state ở đẩu đâu đó, việc passing props vậy đúng là cực hình, phải truyền từng tầng từng tầng một  => code nhiều => thì chắc chắn sẽ nhiều bug hơn (không code thì không bug =)) ). Mà bug này là khóc luôn. Kiểu phải truyền xuống từng tầng một này hay gọi là  Props drilling (also called "threading"). Redux với ý tưởng là sẽ tạo 1 cái " store " to bự chảng, chứa tất cả state mà app bạn cần dùng (share giữa nhiều component). Bạn cứ hiểu như nó là một cái component nằm ở đỉnh tree node của app. mấy cái node dưới sẽ là con nên sẽ access đến store được, chỉ cần connect vào là xong. Cái nào cần dùng thì sẽ " connect " vào cái " store " và dùng state đó thông qua props như thô

Là một function mà ta truyền vào trong một function khác (như tham số - as an argument) fucntion( function() { ... }) {...}