W7D2 Flashcards
What are higher order functions?
They can define and return function or accept callbacks as arguments. They can also do both.
What are callbacks?
They are functions that are passed as arguments to higher order functions
What are Closures?
Closures are functions that use variables that are defined outside of its scope.
What are free variables?
Free Variables are variables defined outside of its scope.
What type of scope is closures?
Closures use lexical scoping
What are composing functions?
Composing Functions use currying. The outermost function receives an initial value, but has a nested composing function. This composing function take 2 functions that do something to the initial value that was received.
Wrote a composing function?
const compose = function (f, g) {
return function (x) {
return f(g(x));
};
};What is middleware?
Middleware is software that intercepts a process either to redirect it or generate some side effect.
How is middleware initiated?
When a dispatch is made.
How does middleware work?
Middleware works when a dispatch is made, the middleware intercepts the action, before it reaches the reducer. When the action is intercepted, middleware will test if the action is a function. If so, it will invoke the action, otherwise it will pass the action along.
What are the 4 things middleware can do?
- It can resolve the action
- It can pass along the action if it is not a function
- Generate a side effect
- send another dispatch
What are the 3 arguments that createStore takes? Say it in the correct order
- reducer
- preloadedState
- enhancer
What is the logger middleware?
Logger prints the store’s state before and after the action is processed.
What is a function signature?
A function signature is the set of inputs and outputs of a function.
What is the function signature of middleware? And why is important for middleware conform to a particular function signature?
Every middleware must receive the ‘store’ as an argument and returns a function that takes the ‘next link’ in the middleware chain as an argument. The nested function with the argument of the next link returns another function that receives the ‘action’ as an arguments. In the final function, it will either trigger any side effects before returning the next(action).
Write the middleware function signature. const middleware = ...
const middleware = store => next => action => {
const result = next(action);
return result
};What are all the things that the logger middleware can do?
It can receive the store as its only argument.
It can return a function that receives the next middleware.
It also return a function receiving the action.
Write the logger middleware’s function signature.
const logger = state => next => action => {
console. log(‘Action received: ‘, action);
console. log(‘State pre-dispatch:’, store.getState());
let result = next(action);
console.log(‘State post-dispatch:’ ,store.getState());
return result;
}
What do want the source to every change to our app state be?
Action creator
What is the purpose of thunk middleware?
Thunk middleware allows you to write action creators that return a function instead of an action. Thunks can be used to delay the dispatch of an action or to dispatch only if a certain condition is met.
Write thunk function source code
function createThunkMiddleware(extraArg) {
return({dispatch, getState}) => next => action{
if(typeof(action === 'function') {
return action(dispatch, getState, extraArg);
}
return next(action) } }
const thunk = createThinkMiddleware(); thunk.withExtraArg = createThunMiddleware;
export default thunk;
What part of the store does thunk middleware receive?
dispatch and getState
Write thunk function
const thunk = ({ dispatch, getState }) => next => action => {
if (typeof action === 'function') {
return action(dispatch, getState);
}
return next(action);
};
export default thunk;
Why do pass getState function to thunk?
In case our async action creators need access to our application state.
