The Single Responsibility Principle is the development philosophy that each element of code (in this case, React components) should only have one overall purpose, and elements should be combined or divided accordingly.
A “static” model of an app renders elements based on the data model and design documents, but does not have the functionality(does not implement any interactions between the components, like passing state data)
The move from static to dynamic models starts with determining which kinds of data need to be stored as states. Criteria to rule out state includes:
Is the data passed down from a parent component?
Does the value of the data change?
Can other props or states of that component already give you access to the data you’d need?
Identifying which component should possess a particular state requires assessing the ancestry of other components (to ensure proper data flow down through descendants) or creating a new component if no existing component is appropriate.
A higher-order function is a function that inputs or outputs other functions.
The example higher-order function:
function greaterThan(n) {return m => m > n;}
takes in the parameter n
and outputs a function that compares its own parameter to the original n
argument to compare the values. (as there is no return defined, the output function should evaluate to a boolean which is determined by the compared values)
The map
method takes in an array and another function as its parameters, then applies the argument function to map
’s other argument by passing each element of the argument array into the functional argument. The return is a new array composed of the respective returns from map
’s argument function.