JavaScript - Senior Flashcards
What is a code block? What are some examples of a code block?
within { } Loops / Functions / Conditionals
What does block scope mean?
Within that code block only
What is the scope of a variable declared with const or let?
Within that code block only
What is the difference between let and const?
const is a value which you do not plan on changing, let is a variable which you plan to change
Why is it possible to .push() a new value into a const variable that points to an Array?
Because the name is constant, not the contents
How should you decide on which type of declaration to use?
Favor const, unless you plan to reuse the variable
What is destructuring, conceptually?
Taking properties from an object or values from an array and assigning them to variables
What is the syntax for Object destructuring?
const { property list } = obj
What is the syntax for Array destructuring?
const [var 1, var2] = array
How can you tell the difference between destructuring and creating Object/Array literals?
Literals: const name = { }
Destructure: const { } = nameWhat is the syntax for defining an arrow function?
( ) if 0 args or 2 +, => { } / sometimes optional
When an arrow function’s body is left without curly braces, what changes in its functionality?
Needs to be an expression. Will return that expression
How is the value of this determined within an arrow function?
At definition time. Will exit any arrow functions and look outside of those
What is Node.js?
An asynchronous JavaScript runtime where many connections can be handled concurrently.
What can Node.js be used for?
Back-end, Command-line app, or any kind of automation that developers wish to perform.
What is a REPL?
Read eval print loop, like a console, it prints any expression given
When was Node.js created?
2009
What back end languages have you heard of?
Ruby PHP Java C# Python C C++ Swift (not common for back end though feasible) Objective C (not common for back end though feasible) JavaScript Perl Go Erlang Elixir
What is a CLI?
Command Line Interface
What is a GUI?
Graphical User Interface
Give at least one use case for each of the commands listed in this exercise. man cat ls pwd echo touch mkdir mv rm cp
man = manuals cat = printing contents of a file ls = lists the folders and files pwd = prints the current directory echo = prints touch = creates a file if it doesn't exist mkdir = makes a directory mv = moves or renames directory rm = remove file or directory cp = copy a file
What is a computer process?
The execution of instructions
Why should a full stack Web developer know that computer processes exist?
To be able to tie things together
What is the process object in a Node.js program?
An object that contains info about a node process
How do you access the process object in a Node.js program?
process / globally available
What is the data type of process.argv in Node.js?
array of strings
What is a JavaScript module?
a single JS file
What values are passed into a Node.js module’s local scope?
exports, require, module, __filename, __dirname
Give two examples of truly global variables in a Node.js program.
global / process
What is the purpose of module.exports in a Node.js module?
This is what the module returns when being called with require / Alternatively you can use a named export (exports.add)
How do you import functionality into a Node.js module from another Node.js module?
require( path )
What is the JavaScript Event Loop?
It controls the Queue and puts things back onto the stack
What is different between “blocking” and “non-blocking” with respect to how code is executed?
Blocking means that nothing else can take place during this request, while non-blocking means that it sends it off and other things can happen in the meantime
What is a directory?
folder
What is a relative file path?
doesn’t start with /
What is an absolute file path?
starts with slash, at the root
What module does Node.js include for manipulating the file system?
fs
What is NPM?
CLI for sharing code / Website / Registry
What is a package?
A folder that has at least one file with a package.json file
How can you create a package.json with npm?
npm init –yes
What is a dependency and how do you add one to a package?
npm install name…
What happens when you add a dependency to a package with npm?
it adds it to your package.json and it downloads it into the node modules folder
How do you add express to your package dependencies?
npm install express
What Express application method starts the server and binds it to a network PORT?
.listen( )
How do you mount a middleware with an Express application?
app.use( )
Which objects does an Express application pass to your middleware to manage the request/response lifecycle of the server?
req / res
What is the appropriate Content-Type header for HTTP messages that contain JSON in their bodies?
application/json
What is the significance of an HTTP request’s method?
semantics / you can make it do whatever you like, although we would want to stick to convention
What does res.status(403).end() accomplish?
Sets the status and closes the response
What does res.status(400).send(‘Bad Request’) accomplish?
Sets the status and sends back data
What does the express.json() middleware do and when would you need it?
It converts json to objects, you would need if you are trying to access the data in form of objects
What are the three states a Promise can be in?
pending / fulfilled / rejected
How do you handle the fulfillment of a Promise?
promise.then(callback)
How do you handle the rejection of a Promise?
promise.catch(callback)
What is Array.prototype.filter useful for?
To filter out specific values based on a function and add them to a new array
What is Array.prototype.map useful for?
To perform an operation on each element based on a function and add them to a new array
What is Array.prototype.reduce useful for?
To get one value out of all the elements in the array
What can arguments.length be used for?
To check whether optional parameters were supplied in a function call
What is “syntactic sugar”?
Makes code easier with same functionality
What is the typeof an ES6 class?
function
Describe ES6 class syntax.
class Name {
constructor(params) { }
func( )
}What is “refactoring”?
Rewriting code to simplify, same functionality
What is Webpack?
Something that bundles together all your code for better performance
How do you add a devDependency to a package?
npm install packagename –save-dev
What is an NPM script?
you assign an alias for a command prompt to be used as a shortcut
How do you execute Webpack with npm run?
npm run scriptAlias
How are ES Modules different from CommonJS modules?
Different syntax “import from etc”
What kind of modules can Webpack support?
CommonJS / AMD / ES modules
How do you export with ES modules
If named export (not default) then with name and { } where importing
If default, then doesn’t need { } and you can use any name you want
What is React?
A JavaScript library for UI
What is a React element?
An object
How do you mount a React element to the DOM?
ReactDom.render( )
What is Babel?
A tool which can be used to convert your code to alternate syntax
What is a Plug-in?
A addition to a piece of software which adds functionality
What is a Webpack loader?
Loaders are transformations that are applied to the source code
How can you make Babel and Webpack work together?
Babel loader
What is JSX?
An XML-type syntax as an extension to JavaScript
Why must the React object be imported when authoring JSX in a module?
Because in order to render the JSX it needs to create a React element
How can you make Webpack and Babel work together to convert JSX into valid JavaScript?
babel loader with a jsx plug-in
What is a React component?
function or a class which returns a React component
How do you define a function component in React?
function Component (Must start with uppercase)
How do you mount a component to the DOM?
ReactDom.render(element, container)
What is the difference between a library and a framework?
with a library you tell it what and when to do, with a framework it decides when to run your code etc
What are props in React?
An objects which has properties
How do you pass props to a component?
With a property name
How do you write JavaScript expressions in JSX?
{ }
How do you create “class” component in React?
class Name extends React.Component render()
How do you access props in a class component?
this.props
What does bind mean?
To have a function store “this” from where it is at right now even though it is called somewhere else (in a callback)
What does lexical scope mean?
That inner functions have access to variables in outer function
What does closures mean?
That inner functions still have access to variables in outer function even if they are called somewhere else (callback functions)
What is the purpose of state in React?
To keep track of changes and update the UI
How to you pass an event handler to a React element?
onClick = { eventHandler }
What is the purpose of state in React?
To keep track of the current status and watch out for change
How do you pass an event handler to a React element?
onClick= { }
What does virtual DOM mean?
React keeps a copy of the DOM and only rerenders the part that it needs to
What are controlled components?
When the react component that renders a form also controls what happens in that form on subsequent user input.
What two props must you pass to an input for it to be “controlled”?
value =
onChange { handler }
What Array method is commonly used to create a list of React elements?
array.map
What is the best value to use as a “key” prop when rendering lists?
The best way to pick a key is to use a string that uniquely identifies each list item. Often you would use IDs from your data as keys:
What does express.static() return?
A function that can handle requests to serve files in that path
What is the local __dirname variable in a Node.js module?
The folder that contains the module
What does the join() method of Node’s path module do?
combine fragments of a path
What does fetch() return?
A Promise that resolves to a Response object.
What is the default request method used by fetch()?
Get
How do you specify the request method (GET, POST, etc.) when calling fetch?
{ method: post } as second argument
What does res.json( ) do?
Reads the body until completion / then parses the response
When does React call a component’s componentDidMount method?
When it renders the first time
Name three React.Component lifecycle methods.
constructor > render > componentdidmount
How do you pass data to a child component?
via props
How does the && operator work?
It returns the first falsy value or the last truthy
What is props.children?
Any thing that you put in between custom React elements
