JavaScript Flashcards
JS-primitives-and-variables
What is the purpose of variables?
= To store data/information that needs to do its job, and give that job a keyword(name), so that it can be used later on.
JS-primitives-and-variables
How do you declare a variable?
= var keyword, declare variable name, followed by semicolon
ex. var coding;
JS-primitives-and-variables
How do you initialize (assign a value to) a variable?
use assignment operator ( = ), and give variable a value, followed by semicolon. ( ex. quantity = 3;)
JS-primitives-and-variables
What characters are allowed in variable names?
= Letter, $ sign, or (_) underscore.
= Cannot start with a number. (but can have number in var names)
= Do not use dash (-) or a period (.)
= Cannot use keywords or reserved keywords (such as var, let, const, etc)
= Use camel case (ex. firstName)
= letters(upper or lowercase), numbers(not start with the numbers), and $ sign
JS-primitive-and-variables
What does it mean to say that variable names are “case sensitive”?
= “Score” and “score” will be treated as different variable names.
= Computers treat uppercase and lowercase as they have no relationship.
JS-primitives-and-variables
What is the purpose of a string?
= To work with any kinds of texts
= Store or manipulate text.
JS-primitives-and-variables
What is the purpose of a number?
= To work with numeric data types
= For math: calculate, holding numeric values
JS-primitives-and-variables
What is the purpose of a boolean?
= Give a value of true or false. Script to run either or options
= Binary logic: on/off, true/false, yes/no
JS-primitives-and-variables
What does the = operator mean in JavaScript?
= it assigns a value to a variable.
JS-primitives-and-variables
How do you update the value of a variable?
=Set a new value using the assignment operator.
** Var const, let, keyword is not required for updating the value
JS-primitives-and-variables
What is the difference between null and undefined?
= Null: can only exist when assigned. Null cannot be created by js.(purposeful emptiness = we’re gonna fill it later, or just for a purpose.)
= Undefined: js tells when value is empty. Js creates undefined. Developers don’t assign undefined.
JS-primitives-and-variables
Why is it a good habit to include “labels” when you log values to the browser console?
= to help you debug easily by looking for a label.
A console log “label” is simply a short string that describes the variable or value being logged.
= To easily find where the problem is happening.
JS-primitives-and-variables
Give five examples of JavaScript primitives.
= Sting = Number = Boolean = Null = Undefined
JS-operators-and-expressions
What data type is returned by an arithmetic operation?
=Numeric value (number)
JS-operators-and-expressions
What is string concatenation?
= Connecting strings, variables, or functions to log in a single line
= Addition for strings to variable.
= strings are immutable (cannot be edited) after created.
= Concatenation makes a new string, not changing the string.
JS-operators-and-expressions What purpose(s) does the + plus operator serve in JavaScript?
= Addition of values(number, string, etc) to the existing variable’s value
= Concatenation of a string to a value.
JS-operators-and-expressions
What data type is returned by comparing two values (greater than sign, less than sign, === etc)?
= Boolean value: True or false
JS-operators-and-expression
What does the += “plus-equals” operator do?
= Adds whatever the value is on the right side of the operand.
= adds the value of the right operand to a variable and assigns the result to the variable.
a += b means a = a + b
JS-objects
What are objects used for?
= Grouping/storing multiple variables and functions
= Multiple data to work together.
JS-objects
What are object properties?
= Variable within a certain boundary.
=You have to state where they are coming from. Properties tend to be group with other stuff.
= Properties are the values associated with a JavaScript object.
= Properties can usually be changed, added, and deleted, but some are read only.
JS-objects
Describe object literal notation.
= object name , assignment operator (=), followed by opening curly brace ({)
= And some variables (called keys/properties) with values separated with colon (:), and closed with closing curly brace (}), and semicolon (;).
var person = { name: ‘John’, age: 30, eyeColor: ‘blue’};
JS-objects
How do you remove a property from an object?
=delete objectname.key
= delete operator (delete)
delete Employee.firstname;
JS-objects
What are the two ways to get or update the value of a property?
= use . notation or bracket notation, but using dot notation is preferred.
person.name = ‘David’
JS-arrays
What are arrays used for?
=Storing ordered/unordered lists
JS-arrays
Describe array literal notation
=Square brackets [ values stored inside the bracket, separated by comma. ]
var coffees = [‘French Roast’, ‘Colombian’, ‘Kona’];
JS-arrays
How are arrays different from “plain” objects?
= Have orders, numbered indexes, stored in square brackets.
JS-arrays
What number represents the first index of an array?
= 0
var shopping = [‘coffee’, ‘bread’, ‘sugar’];
index of ‘coffee’ is 0
index of ‘bread’ is 1
index of ‘sugar’ is 2
JS-arrays
What is the length property of an array?
= counts the number of values/lists in the array
JS-arrays
how do you calculate the last index of an array?
= subtract 1 from the total length.
JS-functions
What is a function in JavaScript?
= Group of tasks that is repeatable / reusable block of code.
=a set of statements that performs a task or calculates a value
JS-functions
Describe the parts of a function definition.
= Function keyword, function name, followed by () for possible arguments, and opening { , code blocks to run when function is called, and followed by closing } , then semicolon ;
= Functions with receiving values and return result, or function to show result
JS-functions
Describe the parts of a function call.
= Function name, parentheses, inside parentheses, some/single argument/s, followed by semicolon ;
JS-functions
When comparing them side-by-side, what are the differences between a function call and a function definition?
= Function definition has the whole process of code (keyword, arguments, code block, etc), function call only has the function name with argument(s)
JS-functions
What is the difference between a parameter and an argument?
= Argument is the placeholder for a function(no value), and argument is the actual values passed in when calling a function.
JS-functions
Why are function parameters useful?
= Putting an empty value in the function so that the function can be later used with the real values(arguments) passed in for repetitive function.
“parameters allow us to pass in any data at any time. If you create a function definition with the values pre-programmed into it, it would only ever be usable with that one set of data. We want an empty box that we can fill with different values at will.”
JS-functions
What two effects does a return statement have on the behavior of a function?
= Executes the code block in the function.
= Exits the code block, and returns the value of the code block.
*Return = escape hatch
JS-methods
Why do we log things to the console?
= To see if the code is working as it is directed
= Intended to be used for debugging.
= 0 usage in production of code. (user will never see console.log) delete console.log when you’re done debugging
JS-methods
What is a method?
= Function saved in the object
= A function that is property of an object.
JS-methods
How is a method different from any other function?
= Methods are function that is stored in the object.
JS-methods
How do you remove the last element from an array?
= Using .pop()
JS-methods
How do you round a number down to the nearest integer?
= Use Math.floor() = chops the decimal, but negative number gets lower value
= Math.trunc() = real chopping decimal value w/o lowering value
JS-methods
How do you delete an element from an array?
= .splice() - remove or replace existing elements and/or add new elements in the array. (arbitrary removal)
JS-methods
How do you append an element to an array?
= .push() - adds element/s to the end of an array
JS-methods
How do you break a string up into an array?
= .split() = give a character/value where the string needs to be split
JS-methods
Do string methods change the original string? How would you check if you weren’t sure?
= They don’t change the original, and use console.log to check.
Roughly how many string methods are there according to the MDN Web docs?
= ~30 methods
JS-methods
Is the return value of a function or method useful in every situation?
No. (but they are designed to calculate possible outcomes
Roughly how many array methods are there according to the MDN Web docs?
= ~25
JS-if
Give 6 examples of comparison operators.
Greater than () Strictly equal to ( ===) Greater than or equal to (>=) Less than or equal to ( <=) Strict not equal to ( !==) Equal to ( ==) // never use!
JS-if
What data type do comparison expressions evaluate to?
= boolean(t/f)
JS-if
What is the purpose of an if statement?
= To create a conditional statement to code to do a decision
JS-if
Is else required in order to use an if statement?
= No. optional. If you have a fallback.
= If else is added , either of the code will run. (if statement or the else statement).else: something is always going to happen
JS-if
Describe the syntax (structure) of an if statement.
= if keyword, (conditions) { opening for code block, some code to run if the condition is true, and closing } for closing code block.
=If keyword, condition, set of curly braces to wrap a code block, if that condition is true.
JS-if
What are the three logical operators?
= && (and) operator,
= || (or) operator,
= ! (not) operator
JS-if
How do you compare two different expressions in the same condition?
= Use logical(&& or ||) operator.
JS-loops
What is a purpose of a loop?
= to perform (repeat) a code block based on a condition.
= typically return a boolean value.
= loop will run until the defined condition returns false.
JS-loops
What is the purpose of a condition expression in a loop?
= to give a condition when the code block should execute/stop.
** condition is a stop point for a loop
JS-loops
what does ‘iteration’ mean in the context of loops?
= one repetition of a code block.
= each time the computer runs through a loop.
JS-loops
When does the condition expression of a ‘while’ loop get evaluated?
=before executing the statement.
= before the code block runs
JS-loops
When does the initialization expression of a ‘for’ loop get evaluated?
= evaluated ‘once’ before the loop begins
= in the beginning, before anything in the loop.
JS-loops
When does the condition expression of a ‘for’ loop get evaluated?
= evaluated before each loop iteration.
= if evaluates true, statement in the code block is executed.
= if evaluates false, execution skips to the first expression following the for construct. (** condition test is optional)
JS-loops
when does the final expression of a ‘for’ loop get evaluated?
= at the end of each loop iteration. this occurs before the next evaluation of condition.
= generally used to update or increment (++) the counter variable(i).
= after the iteration. final expression happens after each iteration.
JS-loops
besides a ‘return’ statement, which exits its entire function block, which keyword exits a loop before its condition expression evaluates to ‘false’?
= break;
JS-loops
what does the ++ increment operator do?
= updates the counter variable(i), by adding 1.
= adds and assigns the value by 1.
JS-loops
how do you iterate through the keys of an object?
= using for…in loop
JS-DOM-querying
Why do we log things to the console?
= to check if the code is functioning as expected
= for debugging
JS-DOM-querying
What is a ‘model’?
= structure (car model, blueprint for house)
= HTML document
JS-DOM-querying
Which “Document” is being referred to in the phrase Document Object Model?
document = HTML document
JS-DOM-querying
What is the word “object” referring to in the phrase Document Object Model?
= Data type object in javascript
= DOM is a recreation of a data as js object, to interact with
= DOM is the intermediary, the middle man. Allows javascript to influence HTML and CSS.
JS-DOM-querying
What is a DOM Tree?
= Any HTML documents with nodes (elements, attribute, text)
= Element with all other child, parent elements
= a model of a web page
JS-DOM-querying
Give two examples of document methods that retrieve a single element from the DOM
= Use document.querySelector() => always works by element type, class name, element with certain class, overall it gives consistency to access. = Use document.getElementById()
JS-DOM-querying
Give one example of a document method that retrieves multiple elements from the DOM at once.
= getElementsByClassName()
= querySelectorAll()
JS-DOM-querying
Why might you want to assign the return value of a DOM query to a variable?
= If you want to access multiple times, so that you don’t have to code it out.
= You don’t need to search for it again.
JS-DOM-querying
What console method allows you to inspect the properties of a DOM element object?
= console.dir() dir method
JS-DOM-querying
Why would a script tag need to be placed at the bottom of the HTML content instead of at the top?
= So that HTML can run before JS runs.
= If script tag is in the beginning of body tag, then JS will run first before HTML
JS-DOM-querying
What does document.querySelector() take as its argument and what does it return?
= Takes CSS selector as argument, returns first element in the HTML that fits
JS-DOM-querying
What does document.querySelectorAll() take as its argument and what does it return?
=Takes CSS selector, and returns all of the elements in the nodeList.
- NodeList is an array like objects. Is not an array. Object with properties that are numbers.
- Reason for being object, it forces you to not to add new stuff into it.
DOM-events
What is the purpose of events and event handling?
= event: indicate which event on the selected node will trigger the js code. things that happen/ user control.
= event handling: to set up the whole procedure for js code to trigger. creating response to an event.
DOM-events
Are all possible parameters required to use a JavaScript method or function?
=No.
=Third parameter for addeventListener(), that’s (useCapture)boolean value, which is optional.
DOM-events
What method of element objects lets you set up a function to be called when a specific type of event occurs?
= addEventListener()
DOM-events
What is a callback function?
= Function definition passed in as an argument.
= In JS, function definitions are values that you can pass around as arguments in other functions. (AKA, callback function).
DOM-events
What object is passed into an event listener callback when the event fires?
= event object. (you can name other things, but event is much more clear). To indicate the function definition is for addEventListener()’s callback function.
DOM-events
What is the event.target? If you weren’t sure, how would you check? Where could you get more information about it?
= property on that event object , whose value is the element that where it (event) occurred. => where the event actually occurred. (not where the event is attached)
= event.target target: holds reference, where the event originated from (occurred).
DOM-events
What is the difference between these two snippets of code?
element. addEventListener(‘click’, handleClick) => CORRECT
element. addEventListener(‘click’, handleClick()) => INCORRECT
= Top one : handleClick is referenced.
= Bottom one: function handleClick() is being called.
**It will not function as an eventHandler, it will call the function, then it will not be a callback function. It will throw an error
DOM-manipulation
What is the className property of element objects?
= className property get or set the value of the class attribute of any element
DOM-manipulation How do you update the CSS class attribute of an element using JavaScript?
= className property, and assign the with new attribute.
DOM-manipulation
What is the textContent property of element objects?
= used to set text content for the HTML element or get the text content written inside that element.
DOM-manipulation
How do you update the text within an element using JavaScript?
= queryselector and get new value of the element and assign
= Use the textContent property to change the text of a span element
DOM-manipulation
Is the event parameter of an event listener callback always useful?
= no
DOM-manipulation
Would this assignment be simpler or more complicated if we didn’t use a variable to keep track of the number of clicks?
= Complicated: switching string to number through HTML is more complicated.
DOM-manipulation
Why is storing information about a program in variables better than only storing it in the DOM?
= Makes much easier to fix. JS can use that information to make adjustment.
JS-forms
What event is fired when a user places their cursor in a form control?
= focus
JS-forms
What event is fired when a user’s cursor leaves a form control?
= blur
JS-forms
What event is fired as a user changes the value of a form control?
= input event
JS-forms
What event is fired when a user clicks the “submit” button within a form element?
= submit event
JS-forms
What does the event.preventDefault() method do?
= Prevents default behavior from an event.
= Prevent from reloading the page.
JS-forms
What does submitting a form without event.preventDefault() do?
= Allows default behavior (refreshes/reload the entire page)
JS-forms
What property of a form element object contains all of the form’s controls?
= Elements property. Value of the element property is an object (representing form controls)
JS-forms
What property of a form control object gets and sets its value?
= Value property
= Value property store what’s currently stored
JS-forms
What is one risk of writing a lot of code without checking to see if it works so far?
= Hard to see/ find where the code went wrong
JS-forms
What is an advantage of having your console open when writing a JavaScript program?
= Console will show any errors.
= A way of communicating with javascript to fix any errors.
DOM-creation
Does the document.createElement() method insert a new element into the page?
= No. it only creates the element node.
DOM-creation
How do you add an element as a child to another element?
= Using appendChild() method
= elementName.appendChild(‘text or element that want to be appended’)
= Another option: append() => this lets append multiple elements.
= append(multiple elements)
DOM-creation
What do you pass as the arguments to the element.setAttribute() method?
= Name (name of the attribute), and value (value to assign to the attribute).
= Name of the attribute, value of the set attribute.
DOM-creation
What steps do you need to take in order to insert a new element into the page?
- First, create the element node
- Second, give the element a content, using createTextNode() method
- Third, append the text node to element node using appendChild()
- Fourth, find the position where the new element will be added.
- Last, append the element to DOM ( using appendChild() method.
- *** Parent is the method you call on, and child is the one you append it.
DOM-creation
What is the textContent property of an element object for?
= Assigns new text, or update text value
DOM-creation Name two ways to set the class attribute of a DOM element.
= ClassName property, and setAttribute method.
DOM-creation
What are two advantages of defining a function to create something (like the work of creating a DOM tree)?
= You can reuse that behavior
= You can give a name to a process, and recognize what it does.
DOM-delegation
What is the event.target?
= Whatever you click on
= element where the event is originally started from.
DOM-delegation
Why is it possible to listen for events on one element that actually happen its descendent elements?
= Because of the event bubbling.
** The process is called “bubbling”, because events “bubble” from the inner element up through parents like a bubble in the water.
DOM-delegation
What DOM element property tells you what type of element it is?
= tagName property = values are always string with all caps( ex. “BUTTON”)
DOM-delegation
What does the element.closest() method take as its argument and what does it return?
= Takes CSS selector as an argument,
= Returns the first ancestor that matches the pattern.
= Almost like a queryselector.
DOM-delegation
How can you remove an element from the DOM?
= Use .remove() method
= Call it on the element you want to remove, and use remove method
DOM-delegation
If you wanted to insert new clickable DOM elements into the page using JavaScript, how could you avoid adding an event listener to every new element individually?
= Use addEventListener to an ancestor element.
JS-view-swapping
What is the event.target?
= DOM object representing element where the event originally happened.
JS-view-swapping
What is the affect of setting an element to display: none?
= Makes element invisible.
JS-view-swapping
What does the element.matches() method take as an argument and what does it return?
= String of CSS selector
= Return boolean / whether the CSS selector matches the element you called on. (using matches() method to check it that matches)
JS-view-swapping
How can you retrieve the value of an element’s attribute?
= Using getAttribute() method with argument of (name/value of string, and return attribute)
JS-view-swapping
At what steps of the solution would it be helpful to log things to the console?
= EVERY SINGLE STEPS
JS-view-swapping
If you were to add another tab and view to your HTML, but you didn’t use event delegation, how would your JavaScript code be written instead?
= Add a eventlistener every single tab.
not recommended!
JS-view-swapping
If you didn’t use a loop to conditionally show or hide the views in the page, how would your JavaScript code be written instead?
= Separate conditional blocks for each separate page.
= Not recommended. For later adding pages : you will have to create every conditional blocks for additional pages.
JS and JSON
What is JSON?
JavaScriptObejctNotation
= JSON is Data interchanging format, not behavior changing format.
= text-based data format following JavaScript object syntax.
= JSON is a lightweight format for storing and transporting data
= JSON is often used when data is sent from a server to a web page
= JSON is “self-describing” and easy to understand
= JSON requires double quotes to be used around strings and property names. Single quotes are not valid other than surrounding the entire JSON string.
= Format that can be parsed out anywhere, interchangeable format, non serialized to serialized.
JS and JSON
What are serialization and deserialization?
= Serialization is the process of turning an object in memory into a stream of bytes so you can do stuff like store it on disk or send it over the network.
= Deserialization is the reverse process: turning a stream of bytes into an object in memory.
= S: takes data into one contiguous series of bytes (string)
= D: spread out the string to everywhere
JS and JSON
Why are serialization and deserialization useful?
= Serialization means transforming something (e.g. my dog Rex photo) into a series of 1s and 0s - which can be transported over the phone line, stored in memory. My friends overseas can then translate those 1s and 0s back into a perfect representation of a puppy photo (de-serialization) so they can enjoy Rex’s photo/image.
= Serialization to preserving the data
= D: make it easy to access data, manipulate the data. Using data
JS and JSON
How do you serialize a data structure into a JSON string using JavaScript?
= Store as a JS object, but put single quotes around the object/array and store properties with double quotes.
= JSON.stringify()
JS and JSON
How do you deserialize a JSON string into a data structure using JavaScript?
= Using JSON.parse()
JS-local-storage
How do you store data in localStorage?
= Using setItem() method
JS-local-storage
How do you retrieve data from localStorage?
= Using getItem() method
JS-local-storage
What data type can localStorage save in the browser?
= strings
JS-local-storage
When does the ‘beforeunload’ event fire on the window object?
= when the window, the document and its resources are about to be unloaded.
= Before the page loads. (anything that will make the current page go away, the ‘beforeunload’ event will fire.
JS-custom-methods
What is a method?
= A function saved in object as a property
JS-custom-methods
How can you tell the difference between a method definition and a method call?
= Method definition has a whole function definition with parameters, method call is just like dot notation with arguments
methodDefinition: actual function definition, stored as property of an object
Call method: named of the object with properties. (. notation)
JS-custom-methods
Describe method definition syntax (structure)
= Method name, colon, then method definition, opening { for code block, some code, then } for closing code block.
Ex: fullName: function() {
return this.firstName + “ “ + this.lastName;
JS-custom-methods
Describe method call syntax (structure).
= Object name, dot , and method name (just like dot notation in object property)
Ex.) name = person.fullName();
JS-custom-methods
How is a method different from any other function?
= It’s saved in the object as a property
= Use dot notation to call the method.
JS-custom-methods
What is the defining characteristic of Object-Oriented Programming?
= OOP is all about containing data as property and behavior
= Containing data and behavior saved in a same bubble
JS-custom-methods
What are the four “principles” of Object-Oriented Programming?
= Abstraction
= Encapsulation
= Inheritance
= Polymorphism
JS-custom-methods
What is “abstraction” in OOP?
= being able to work with (possibly) complex things in simple ways.
= Simplifying a complex process to a simple process without having to fully understand how that complex process works. (ex. Light switch, DOM API)
JS-custom-methods
What does API stand for
= Application Programming Interface
JS-custom-methods
What is the purpose of an API?
= Have connection between computers or computer programs.
= to simplify programming by abstracting the underlying implementation and only exposing objects or actions the developer needs.
JS-this
What is ‘this’ in JavaScript?
= In an object method, ‘this’ refers to the object. Alone, ‘this’ refers to the global object
JS-this
What does it mean to say that ‘this’ is an “implicit parameter”?
= Implicit parameter, we don’t need to specify, but it’s present.
= Implicit means implied, but assumed to be present.
= “this” is not physically present all the time, but implicitly present all the time.
JS-this
When is the value of ‘this’ determined in a function; call time or definition time?
= Call time
= ‘this’ carries no meaning UNTIL the method is called(invoked)
JS-this
How can you tell what the value of ‘this’ will be for a particular function or method definition?
= You can’t tell until you see the action
JS-this
How can you tell what the value of this is for a particular function or method call?
= Object to the left of the dot. When a method is called.
= If there is no dot, it’s window object.
= *** Don’t use ‘this’ in the global scope (window object). Only use ‘this’ in the object literal you created.
JS-prototypes
What kind of inheritance does the JavaScript programming language use?
= JavaScript includes a specific kind of inheritance known as prototype-based (or prototypal) inheritance. JavaScript objects give certain behaviors (methods) or data (properties) to other objects.
JS-prototypes
What is a prototype in JavaScript?
= It is a mechanism by which JavaScript objects inherit features from prototype.
= global property creating a channel to other behavior(methods)
JS-prototypes
How is it possible to call methods on strings, arrays, and numbers even though those methods don’t actually exist on strings, arrays, and numbers?
= Because they Inherit from the prototype object
JS-prototypes
If an object does not have its own property or method by a given key, where does JavaScript look for it?
= prototype
JS-constructors
What does the new operator do?
= new operator lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function.
= Creates a blank, plain JavaScript object.
= Adds a property to the new object (__proto__) that links to the constructor function’s prototype object
1. Make blank object nothing in it
2. Take prototype property into new object (__proto__)
3. Gives ‘this’ var a value
4. Return ‘this’
JS-constructors
What property of JavaScript functions can store shared behavior for instances created with ‘new’?
= prototype property
JS-constructors
What does the instanceof operator do?
= The instanceof operator tests to see if the prototype property of a constructor appears anywhere in the prototype chain of an object. The return value is a boolean value.
= The instanceof operator tests the presence of constructor.prototype in object’s prototype(prototypal) chain.
JS-timers
What is a “callback” function?
= Function passed in to a another function as an argument
JS-timers
Besides adding an event listener callback function to an element or the document, what is one way to delay the execution of a JavaScript function until some point in the future?
= setTimeout() = set up a time period, and execute AFTER the time
JS-timers
How can you set up a function to be called repeatedly without using a loop?
= Use setInterval() = a loop, doesn’t happen all at once, happens in a period of time (delay of each iteration)
JS-timers
What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?
= 0
JS-timers
What do setTimeout() and setInterval() return?
= Returns interval ID, to clearout the setInterval().
http-message
What is a client?
= Client is a service request
= Requesting something from somewhere. Consuming data from elsewhere, asking for something
http-message
What is a server?
= Client asks for data, and server provides data.
= computer program or device that provides a service to another computer program and its user(client)
http-message
Which HTTP method does a browser issue to a web server when you visit a URL?
= GET
http-message
What three things are on the start-line of an HTTP request message?
- HTTP method - like GET, POST,
- The request target, usually a URL, or the absolute path of the protocol, port, and domain are usually characterized by the request context.
- The HTTP version, which defines the structure of the remaining message, acting as an indicator of the expected version to use for the response.
http-message
What three things are on the start-line of an HTTP response message?
= Protocol version
= Status code
= Status text
http-message
What are HTTP headers?
= Lines of code after start-line of HTTP
= Meta data of HTTP - like head element in the HTML document
http-message
Is a body required for a valid HTTP request or response message?
= No.
= Ex: 201 message in HTTP. (201: data was created)
JS-ajax
What is AJAX?
= A technique for loading data into part of a page without having to refresh the entire page
JS-ajax
What does the AJAX acronym stand for?
= Asynchronous JavaScript And XML
JS-ajax
Which object is built into the browser for making HTTP requests in JavaScript?
= XMLHttpRequest()
JS-ajax
What event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
= ‘load’ event is fired
JS-ajax
An XMLHttpRequest object has an addEventListener() method just like DOM elements. How is it possible that they both share this functionality?
= They share the event target prototype
= Inheritance of prototype, is possible to share common prototype
ES6- const-and-let
What is a code block? What are some examples of a code block?
= Code block is denoted by curly braces ( { } )
= Examples are code blocks in function, loop, if statements, etc.
ES6- Const-and-let
What does block scope mean?
= Block scope means that variables defined within a block will not be accessible from outside of the block
ES6- Const-and-let
What is the scope of a variable declared with const or let?
= They are block scoped
ES6- Const-and-let
What is the difference between const and let?
= let can be mutated, but const cannot be mutated.
= const creates a read-only reference to a value.
ES6- Const-and-let
Why is it possible to .push() a new value into a const variable that points to an array?
= The value of const variable is showing the memory of the const, so the contents inside const can be updated, not the actual values.
= Usiung the methods to const is not re-assigning or re-declaring it, it’s just add/delete to the list that the const points to.
ES6- Const-and-let
How should you decide on which type of the declaration to use?
= depends on which value you’re assigning.
= if the values cannot be mutated, use const.
= if values will be updated later, use let.
= But in default, use const. If you need to update or change it later, then switch to let.
ES6-template-literals
What is the syntax for writing a template literal?
= Using a backtick ( ` ) to wrap a string, and use $ { } to express any variables or functions.
ES6 - template-literals
What is string interpolation?
= The ability to substitute part of the string for the values of variables or expressions.
ES6- destructuring
What is destructuring conceptually?
= unpack values from arrays, or properties from objects, into distinct variables.
ES6 - destructuring
What is the syntax for object destructuring?
= let { property1: variable 1, property2: variable2 } = object;
= The identifier before the colon ( : ) is the property of the object, and the identifier after the colon is the variable.
ES6 - destructuring
What is the syntax for array destructuring?
= let [ x, y, z ] = newArray;
ES6 - destructuring
How can you tell the difference between destructuring and creating object / array literals?
= destructuing: curly braces are on the left side ex| : const { title, author, id } = library; = assigning: curly braces are on the right side. ex| : const title1 = libaray.title;
ES6- arrow-functions
What is the syntax for defining an arrow function?
= Parentheses, possible parameters inside the parentheses, arrow, expression or statement in code block ( { } ).
ES6- arrow-functions
When an arrow function’s body is left without curly braces, what changes in its functionality?
= It will implicitly returns a value. Implying that the expression will return.
ES6- arrow-functions
How is the value of this determined within an arrow function?
= takes the value from the block(parent) scope.
note: It is a good practice to use arrow functions for callbacks and closures because the syntax of arrow functions is cleaner.
Command-line-basics
What is a CLI?
= Command-line interface, receive commands from a user in the form of lines of text.
= Anything you use in terminal is cli. (ex: git)
Command-line-basics
What is a GUI?
= Graphic user interface.
= applications that use a GUI are usually aimed at consumers of technology (end users), not producers of technology (developers).
= Operating system (ex: compter, application, etc. ) using graphic to interact with data.
Command-line-basics
man
= Manual to figure out how to use commands
= man is an interface to the on-line reference manuals.
Command-line-basics
cat
= Concatenate files and print on the standard output
= List multiple files, move stuffs to files
command-line-basics
ls (list segments)
= list directory contents.
= Sort entries alphabetically.
command-line-basics
pwd (print working directory)
= print the filename of the current working directory
command-line-basics
echo
= display a line of text (echos the string)
command-line-basics
touch
= change file timestamps
= Creates text file (blank file)
= update the access and modification times of each FILE to the current time.
command-line-basics
mkdir (make directories)
= Creates new directories
= After ls, anything starts with d represents directory.
= create the DIRECTORY(ies), if they do not already exist.
command-line-basics
mv (move)
= move (rename) files
= Rename files or folders, or move files or folders to new location.
command-line-basics
rm (remove)
**BE CAREFUL WITH THIS COMMAND, IT DELETES THINGS INSTANTLY, WITHOUT WARNING, AND CANNOT BE UNDONE.
= remove files or directories
command-line-basics
cp (copy)
= copy files and directories
= copy SOURCE to DEST, or multiple SOURCE(s) to DIRECTORY.
command-line-basics
history
= many programs read input from the user a line at a time. The GNU history library is able to keep track of those lines, associate arbitrary data with each line, and utilize information from previous lines in composing new ones.
Node-intro
What is Node.js?
= Server-side JavaScript runtime, set of libraries for JavaScript which allows it to be used outside of the browser.
= Allows us run js without browser
Node-intro
What can Node.js be used for?
= It is commonly used to build back ends for web applications, command-line programs, or any kind of automation that developers wish to perform.
Node-intro
What is a REPL?
= Read-eval-print-loop
= For testing code (sandbox playground)
Node-intro
When was Node.js created?
= May 27, 2009
Node-intro
What back end languages have you heard of?
= Ruby, Java, Python, PHP
Node-process-argv
What is the process object in a Node.js program?
= The process is a global that provides information about, and control over, the current Node.js process
** (global here means it can be accessed anywhere in the program). (each program running on a computer represents a process).
= Global object that contains information about node process.
Node-process-argv
How do you access the process object in a Node.js program?
= Just type process to access it.
Node-process-argv
What is the data type of process.argv in Node.js?
= Array.