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.
