In JavaScript, what is an isomorphic application?
An isomorphic application (aka Universal JavaScript) means that the application can run both on the server and on the client. This can be used to render on the server so that the client can display the content more or less immediately.
What is hoisting in JavaScript?
During the compilation phase of JavaScript execution, keywords (var, let, const, function, class) are allocated locations in memory.
If not assigned an explicit value, declarations with the var keyword also initialized and assigned the value “undefined.” During the execution phase, var-declared variables are available to the parser anywhere within the function scope (if declared within a function) or at the global level if declared outside a function.
All that means that a variable referenced lexically prior to its own declaration is valid and will be executed without error.
What is the difference between var, let, and const?
All are reserved keywords used for declaring variables.
var: the var keyword declares and initializes a variable at the top of its function scope (or in the global scope if declared outside a function).
let and const, on the other hand, declare block-scoped variables (i.e., anything within curly braces { } ). In a sense, variables declared with let and const are also “hoisted” (in that they are allocated space in memory during the compilation phase), but they are not initialized until execution—with var you get “undefined”; with let/const you get “X is not defined.”
What is the practical difference between let and const?
const: const-declared variables cannot have their base value type overwritten.
- For example, if you declare an object using const (e.g., const myObj = {}), myObj can never be changed to an array, a string, a boolean, a number, etc.*
- The properties of myObj can be added to, altered, or removed, by myObj will forever remain an object.*
let: variables declared with let can be changed and updated as needed (for example, during iterations).
What are the basic hooks available in ReactJS?
useEffect - Accepts a function that contains imperative, possibly effectful code.
useState - Returns a stateful value, and a function to update it.
useContext - Accepts a context object (the value returned from React.createContext) and returns the current context value for that context. The current context value is determined by the value prop of the nearest above the calling component in the tree.
What are the three main phases of the React component lifecycle?
- Mounting
- Updating
- Unmounting
What is the useReducer hook?
An alternative to useState. Accepts a reducer of type (state, action) => newState, and returns the current state paired with a dispatch method. (If you’re familiar with Redux, you already know how this works.)
What are the most common React component lifecycle methods?
No. 1
- Constructor() - needed to…
- Set initial values for state
- Bind the keyword “this” to refer to the current object in non-lifecycle methods
What are the most common React component lifecycle methods?
No. 2
- render()
* Renders component to the UI
What are the React component lifecycle methods?
No. 3
- componentDidMount( )
Triggered automatically after a component is successfully mounted and rendered for the first time. Often used to fetch application data.
What are the React component lifecycle methods?
No. 4
- componentDidUpdate( )
Triggered automatically after a component is successfully updated.
What are the React component lifecycle methods?
No. 5
- componentWillUnmount( )
Triggered automatically right before the component is unmounted and destroyed.
What are the three types of scope in JavaScript?
- Global - variables and expressions declared outside of a function have global scope (even when declared with let or const)
- Function (or Local) - variables and expressions can only be accessed from within the function
- Block (via let and const in es6) -
What are the three types of scope in JavaScript?
- Global - variables and expressions declared outside of a function have global scope (even when declared with let or const)
- Function (or Local) - variables and expressions can only be accessed from within the function
- Block (via let and const in es6) -
True or False
In “Strict Mode” undeclared variables are automatically global in scope.
False.
What is the definition of scope in JavaScript (according to MDN)?
The current context of execution. The context in which values and expressions are “visible” (aka available) and can be successfully referenced. If a variable or expression is not “in the current scope,” it is unavailable for use.
What are the different categories of HTTP headers?
- Request headers - contain information about requested resource or about the client itself
- Response headers - contain information about the response or about the server doing the responding
- Representation headers - contain information about the response body (MIME type, for example) or about applied encoding and/or compression
- Payload headers - contain representation-independent information about the payload data (e.g., its length, its transport encoding)
Why is scope important?
- Ownership. Scope limits what parts of the app can change/interact with other parts of the code.
- Avoiding name collisions. Without clear boundaries, all variables would need to have unique names. This is impractical and undesirable. Scope boundaries prevent collisions. Imagine having to come up with a unique name for every iterator in every for loop.
- Garbage collection. Cleary-defined scopes allow the JavaScript compiler to know where and when to perform garbage collection
What are the different categories of HTTP headers?
- Request headers - contain information about requested resource or about the client itself
- Response headers - contain information about the response or about the server doing the responding
- Representation headers - contain information about the response body (MIME type, for example) or about applied encoding and/or compression
- Payload headers - contain representation-independent information about the payload data (e.g., its length, its transport encoding)
What are some ways to make your components more reusable/sharable?
- Keep UI logic and feature-specific logic separate; should never be bound together
- Pass mandatory params by name, but also allow for extended props (object)
- The component should be flexible—agnostic about where it may end up. Host parent can implement restraints as necessary
- Keep the component as dumb as possible, push logic upwards whenever possible
- Allow for easy style overrides (except as dictated by a common design language)
What are some disadvantages of css-in-js?
- Learning curve
- Added complexity (may not be worth the hassle)
- Less readable code
- Potential performance hit (if your components pull in external CSS dependencies, or if there’s a lot of css-in-js since JS is slower to parse than CSS)
What are the advantages of css-in-js (with libraries like Styled Components, Linaria, or Emotion)?
- Local scoping.
- Independence. Component can run on its own without reliance on an external stylesheet
- Encapsulation. Expose the API, hide implementation details
- Portability.
- Dynamic functionality. Add complex JS logic to your styles.
- Potential performance gains as over against a traditionally-loaded external stylessheet.
What are the steps in HTTP request-response life cycle?
- User inputs or generates an information query
- Client forms a Request message with any necessary request headers and sends specified request to the server
- Server interprets the request, uses a route handler to do a DB lookup, generates a response message and sets response status
- Client uses representational and any payload headers to parse the data correctly (assuming a successful response)
- Client renders new data to a data structure or the UI or whatever
What are the three main components of the HTTP protocol?
- User-agent: Any mechanism that acts on behalf of the user—most commonly, a web browser
- Web server: Serves information to fulfill the requests of the user-agent.
- Proxies: An intermediary between the user-agent and the web server (perform things like caching, filtering, load balancing, authentication, logging).
