JavaScript Flashcards
what is the purpose of variables?
to store data
how do you declare a variable?
with the keyword var
how do you initialize a variable?
with the assignment operator
what characters are allowed in variable names?
letters, numbers, _, $. can NOT start with number
what does it mean to say that variable names are “case sensitive”
name must be exact including if a letter is uppercase or lowercase
what is the purpose of a string?
storing and manipulating text.
what is the purpose of a number?
to perform calculations
what is the purpose of a boolean?
to determine what is run in JS
what does the = operator mean in JavaScript?
assignment operator
how do you update the value of a variable?
reassign using assignment operator
what is the difference between null and undefined?
undefined is not defined.
null was purposely set to null
why is it a good habit to include labels when you log values to the console?
to keep track of what you’re logging.
give 5 examples of JavaScript primitives
string, number, boolean, undefined, null
what data type is returned by an arithmetic operation
a number
what is a string concatenation
joining two or more strings.
what purpose(s) does the + plus operator serve in JavaScript?
addition and concatenation
what data type is returned by comparing two values?
a boolean
what does the += plus equals operator do?
adds then assigns new value
what are objects used for?
to group variables and functions
what are object properties?
variables within an object
describe object literal notation
{ key:value, key:value}
how do you remove a property from an object?
keyword delete & dot notation or square bracket notation
what are the two ways to get or update the value of a property?
dot notation and square bracket notation
what are arrays used for?
storing a list of values
describe array literal notation
[value, value]
how are arrays different from ‘plain’ objects?
the key for each value is an index
what number represents the first index of an array?
0
what is the length property of an array?
.length
how do you calculate the last index or an array.
subtract 1 from the length
what is a function in javascript?
a block of code designed to perform a particular task.
describe the parts of a function definition
function keyword, function name, parameters, code block.
describe the parts of a function call
function name, arguments.
when comparing side by side what are the differences between a function call and a function definition?
call has arguments, definition has parameters and code block.
what is the difference between a parameter and an argument
parameters are placeholders within definition, arguments are to pass into a function call.
why are function parameters so useful?
to use a function multiple times with different arguments.
what 2 effects does a return statement have on the behavior of a function?
causes a value to be produced from function, ends the function
why do we log things to the console?
to check if the code is working properly
what is a method?
a function stored within an object
how is a method different from a function
a method is attached to an object
how do you remove the last element from an array?
.pop()
how do you round a number down to the nearest integer?
Math.floor()
how do you generate a random number?
Math.random()
how do you delete an element from an array?
.splice(start, amount)
how do you append an element to an array?
.unshift, .push, .splice
how do you break a string up into an array?
.split(onCharacter)
do string methods change the original string? how would you check if you weren’t sure?
No, strings are immutable. you could check in the console.
roughly how many string methods are there according to the MDN Web docs?
roughly 40
is the return value of a function or method always useful?
no
roughly how many array methods are there according to the MDN Web docs?
roughly 40
what 3 letter acronym should you always include in your google search about javascript method and css property?
MDN
give 6 examples of comparison operators
, ===, !==, >=, <=
what data type do comparison expressions evaluate to?
boolean
what is the purpose of an if statement?
to determine what code runs
describe the syntax of an if statement
if keyword (condition statement) { code block }
what are the 3 logical operators?
&&, ||, !
how do you compare 2 different expressions in the same condition?
&& or ||
what is the purpose of a loop?
to repeat behavior
what is the purpose of a condition in a loop?
to check if the loop keeps going or ends.
what does iteration mean in the context of loops?
each time the code in the loop runs
when does the condition expression of a while loop get evaluated?
before each loop iteration
when does the initialization expression of a for loop get evaluated?
before everything. only once
when does the condition of a for loop get evaluated?
before each loop iteration
when does the final expression of a for loop get evaluated?
after the code block runs during each loop iteration.
besides a return statement, which keyword exits a loop before its condition expression evaluates to false?
break
what does the ++ increment operator do?
increments by 1
how do you iterate through the keys of an object?
for…in loop
what is a ‘model’
a copy
which ‘document’ is being referred to in the phrase Document Object Model
HTML
what is the word ‘object’ referring to in the phrase Document Object Model
the node
give 2 examples of document methods that retrieve a single element from the DOM
document.querySelector, document.getElementByID
give one example of a document method that retrieves multiple elements from the DOM at once
document.querySelectorAll
why might you want ti assign the return value of a DOM query to a variable
to easily access it later
what console method allows you to inspect the properties of a DOM element object
console.dir
why would a script tag need to be placed at the bottom of the HTML content instead of the top?
the browser needs to parse all elements before the javascript can access them
what does document.querySelector take as its argument, and what does it return?
takes a selector, returns an HTML element object
what does document.querySelectorAll take as its argument, and what does it return?
takes a selector, returns a node list
what is the purpose of events and event handling?
to make the webpage react with user interaction
what do [] square brackets mean in function and method syntax documentation?
optional
what method of element objects lets you set up a function to be called when a specific type of event occurs
.addEventListener
what is a callback function?
a function passed into another function as an argument
what object is passed into an event listener callback when the event fires?
event object
what is the event target?
the element that triggers the event
what is the difference between element.addEventListener(‘click’, handleClick)
and element.addEventListener(‘click’, handleClick())
parenthesis indicate that the function should run when the page is loaded, and the one without parenthesis runs when the event is fired
what is the className property of element objects?
gets and sets the value of the class attribute of a specified element
how do you update the css class attribute of an element using javascript?
assigning a string value to element.className
what is the textContent property of element objects?
represents the text content of a node and its descendants
how do you update the text within an element using javascript?
element.textContent = ‘’
why is storing information about a program in variables better than only storing in the DOM?
to easily access them later
what event Is fired when a user places their cursor in a form control?
blur
what event is fired when a users cursor leaves a form control?
blur
what event is fired when a user changes the value of a form control?
input
what event is fired when a user clicks the submit button within a form
submit
what does the event.preventDefault method do?
tells the browser that if the event does not get explicitly handled, its default action should not be taken as it normally would be
what does submitting a form without event.preventDefault do?
prevents the browser from auto reloading the page
what property of a form element object contains all of the form controls?
elements
what property of a form control object gets and sets its value?
value
does the document.createElement method insert a new element onto a page?
no
how do you add an element as a child to another element?
.appendChild
what do you pass as the arguments to the element.setAttribute method?
selector, value
what steps do you need to take in order to insert a new element into the page?
createElement, appendChild
what is the textContent property of an element object for?
to access or set the text of an element object
name two ways to set the class attribute of a DOM element
.setAttribute, .className, .classList
what are two advantages of defining a function to create something (like the work of creating a DOM tree)
to easily create multiple, or add more later easily
what is event.target?
where the event was fired from
why is it possible to listen for events on one element that actually happen on its descendant?
bubbling
what DOM element property tells you what type of element it is?
tagName
what does the element.closest method take as its argument and what does it return?
takes selector, returns element which is the closest ancestor to the selected element
how can you remove an element from the DOM?
.remove()
what is the affect of setting an element to display:none?
not visible, document flows as if it doesn’t exist
what does the element.matches method take as its argument and what does it return?
takes selector, returns boolean
how can you retrieve the value of an elements attribute?
getAttribute method
what is JSON?
a text based data interchange format used to send and store information in computer systems
what are serialization and deserialization
serialization is converting a JSON string into an object and deserialization is converting an object into a JSON string
why are serialization and deserialization useful?
for when you want to transmit data across a network.
how do you serialize a data structure into a JSON string using javascript?
JSON.stringify
how do you deserialize a JSON string into a data structure?
JSON.parse
how do you store data in localStorage
.setItem
how do you retrieve data from localStorage?
.getItem
what datatype can localStorage save in the browser?
strings
when does the ‘beforeunload’ event fire on the window object?
then the window, document, and its resources are about to be unloaded
what is a method?
a function within an object
how can you tell the difference between a method definition and a method call?
definition has code block. call does not
describe method definition syntax
methodName(parameters) {code block}
describe method call syntax
methodName(arguments);
how is a method different from any other function?
a method is attached to an object
what is the defining characteristic of Object Oriented Programming?
it can contain both data and behavior
what are the four principals of Object Oriented Programming?
abstraction, encapsulation, inheritance, polymorphism
what is ‘abstraction’?
being able to work with (possibly) complex things in simple ways
what does API stand for?
Application Programming Interface
what is the purpose of an API?
it simplifies programming by abstracting the underlying implementation and only exposing object or actions the developer needs.
what is this in JavaScript?
an implicit parameter of all JavaScript functions
what does it mean to say that this is an ‘implicit’ parameter?
available in a function code block even though it wasn’t in parameter or declared with var
when is the value of this determined in a function?
at call time
what kind of inheritance does the JavaScript programming language do?
an object that contains properties and methods that can be used by other objects
how is it possible to call methods on strings, arrays, and numbers even though those methods don’t actually exist on objects, arrays, and methods?
methods are defined on a prototype object & they borrow those methods when needed.
if an object does not have its own property or methods by a given key, where does JavaScript look for it?
the __proto__ property
what does the new operator do?
creates a blank JavaScript object, adds __proto__, binds created object to this.
what property of JavaScript functions can store shared behavior for instances created with new?
__proto__
what does the instanceof operator do?
tests to see if the prototype property of a constructor function appears anywhere in the prototype chain of an object
what is a ‘callback’ function
a function passed into another function as an argument
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
how can you set up a function to be called repeatedly without a loop?
setInterval
what is the default time delay if you omit the delay parameter from setTimeout or setInterval?
0
what do setTimeout and setInterval return?
timeout id, and interval id. (number)
what is a client?
service requester
what is a server?
provider of resource or service
which HTTP method does a browser issue to a web server when you visit a URL?
GET
what 3 things are on the start-line of an HTTP request method?
an HTTP method, the request target, the HTTP version
what 3 things are on the start line of an HTTP response?
protocol version, status code, status text
what are HTTP headers?
they let the client and server pass additional information with an HTTP request or response
where would you go if you wanted to learn more about a specific HTTP header?
MDN
is a body required for a valid HTTP request or response message?
no
what is AJAX?
it allows you to request data from a server and load it without having to refresh the entire page
what does the AJAX acronym stand for?
Asynchronous JavaScript and XML
which object is built into the browser for making HTTP requests in JavaScript?
XMLHttpRequest
what event is fired by XMLHttpRequest objects when they are finished loading the data from the server?
load
what is a code block? what are some examples of a code block?
a chunk of code grouped together within curly braces. function code block, if code block, loop code block
what does block scope mean?
exists only within that block
what is the scope of a variable declared with const or let?
block scope
what is the difference between const and let
const variables can not be reassigned
why is it possible to .push() a new value into a const variable that points to an array?
the value of the variable can be manipulated, just not directly reassigned
how should you decide which declaration to use?
if you are not reassigning the value use const, if you are use let
what is the syntax for writing a template literal?
` ${ }`
what is ‘string interpolation’
in javascript, when js automatically replaces expressions with their values in template literals
what is the syntax for Object Destructuring?
const { property: varName} = origVarName
what is the syntax for Array Destructuring?
const [varName1, varName2] = origVarName
how can you tell the difference between Destructuring and creating Object/Array literals?
{ } or [] on left side for destructuring
what is the syntax for defining an arrow function?
const VarName = (parameters) => { code}
when an arrow functions body is left out what changes in its functionality?
can only have one expression, no statements or loops
how is the value of this determined with an arrow function?
it is determined within the function code block