LFZ Flashcards
Where do you put non-visible content about the HTML document?
head element
Where do you put visible content about the HTML document?
body element
Where do the head and body tags go in a valid HTML document?
html element
What is the purpose of a !DOCTYPE declaration?
clarify version of html for compatibility
Give five examples of HTML element types.
h1, p, a, img, form, span, div
What is the purpose of HTML attributes?
modify or add functionality to elements
Give an example of an HTML entity (escape character).
& copy reg pound yen lt gt ;
How do block-level elements affect the document flow?
newline, take up full horizontal space
How do inline elements affect the document flow?
they do not, and adopt the width and height of their contents
What are the default width and height of a block-level element?
100% width
content-size height
What are the default width and height of an inline element?
content size
What is the difference between an ordered list and an unordered list in HTML?
ordered lists default to numbered,
unordered defaults to bullets
Is an HTML list a block element or an inline element?
block element
What HTML tag is used to link to another website?
a
What is an absolute URL?
a complete path to the location of a resource, often to external servers
What is a relative URL?
a partial url based on the filepath of the hosting server
How do you indicate the relative link to a parent directory?
../
How do you indicate the relative link to a child directory?
./child/
How do you indicate the relative link to a grand parent directory?
../../
How do you indicate the relative link to the same directory?
./
What is the purpose of an HTML form element?
to receive inputs and information from end users, UI to interact with website
Give five examples of form control elements.
label input button option select textarea
Give three examples of type attribute values for HTML input elements.
button checkbox date email image radio search url time
Is an HTML input element a block element or an inline element?
inline-block by default
What are the six primary HTML elements for creating tables?
thead tbody tfoot th tr tf td
What purpose do the thead and tbody elements serve?
they allow different formatting for header first row
Give two examples of data that would lend itself well to being displayed in a table.
high dimensional numerical data
long text comparison between options
What are the names of the individual pieces of a CSS rule?
selector declarations
In CSS, how do you select elements by their class attribute?
.class {
}
In CSS, how do you select elements by their type?
type {
}
In CSS, how do you select an element by its id attribute?
#id {
}Name three different types of values you can use to specify colors in CSS.
RGB(a)
HSL(a)
#hexcode
What CSS properties make up the box model?
width height margin padding box-sizing
Which CSS property pushes boxes away from each other?
margin
Which CSS property add space between a box’s content and its border?
padding
What is a pseudo-class?
a keyword modifier to a css selector that activates on specific states
What are CSS pseudo-classes useful for?
reactivity to user input
Name two types of units that can be used to adjust font-size in CSS.
px em %
What CSS property controls the font used for the text inside an element?
font-family: fontname, backups;
What is the default flex-direction of a flex container?
flex-direction: row
What is the default flex-wrap of a flex container?
flex-wrap: nowrap;
Why do two div elements “vertically stack” on one another by default?
they are block elements
What is the default flex-direction of an element with display: flex?
flex-direction: row
What are the four components of “the Cascade”.
inheritance
source order
specificity
!important
What does the term “source order” mean with respect to CSS?
the order in which the rulesets are being read
How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?
it happens by default for some elements
List the three selector types in order of increasing specificity.
element
class
id
Why is using !important considered bad practice?
it breaks the cascade and leads to unpredictable hard to maintain behavior
What is the default value for the position property of HTML elements?
static
How does setting position: relative on an element affect document flow?
it does not
How does setting position: relative on an element affect where it appears on the page?
it can get shifted relative to where it ought have been in static
How does setting position: absolute on an element affect document flow?
it does not
How does setting position: absolute on an element affect where it appears on the page?
it goes to the topleft of any nonstatic elements
How do you constrain an absolutely positioned element to a containing block?
contain it inside of a position:relative
What are the four box offset properties?
top bottom left right
What is the purpose of variables?
to hold data
How do you declare a variable?
let const var
How do you initialize (assign a value to) a variable?
let a = 3;
What characters are allowed in variable names?
most, but varnames cannot start with numbers or non $ special characters
What does it mean to say that variable names are “case sensitive”?
name != NAME
What is the purpose of a string?
hold text data
What is the purpose of a number?
hold numeric data
What is the purpose of a boolean?
hold true-false data
What does the = operator mean in JavaScript?
assignment operator
How do you update the value of a variable?
var = newval;
What is the difference between null and undefined?
null is intentionally empty, or placeholder for missing data
undefined is yet to be declared
Why is it a good habit to include “labels” when you log values to the browser console?
console logs are meant to be read and it lets you know what you’re looking at
Give five examples of JavaScript primitives.
int string bool bigint null undefined
What data type is returned by an arithmetic operation?
either a number or a bigint
What is string concatenation?
combining two strings into a new string
What purpose(s) does the + plus operator serve in JavaScript?
string concatenation, addition operator
What data type is returned by comparing two values (, ===, etc)?
bool
What does the += “plus-equals” operator do?
x += 1
x = x + 1
What are objects used for?
store similar data / related functions together
What are object properties?
properties are the key to the unordered key:value pairs of objects;
Describe object literal notation.
object = {
property: value,
property2: value2
}
How do you remove a property from an object?
delete object.property;
What are the two ways to get or update the value of a property?
object.dotNotation
object[‘bracketNotation’]
What are arrays used for?
ordered list of data
Describe array literal notation.
array = [primitiveor, object]
How are arrays different from “plain” objects?
the keys default to a 0-start index
ordered nature
What number represents the first index of an array?
[0]
What is the length property of an array?
the number of objects inside of an array
How do you calculate the last index of an array?
array.length - 1
What is a function in JavaScript?
a codeblock with an optional name, optional parameters, and optional return
Describe the parts of a function definition.
function keyword
parameters for input
brackets for codeblocks
Describe the parts of a function call.
functionName( argument, argument2 );
When comparing them side-by-side, what are the differences between a function call and a function definition?
the call is a reference that sets up the codeblock that the definition uses
What is the difference between a parameter and an argument?
parameters are the inputs for definitions
arguments are the inputs for calls
Why are function parameters useful?
they can give clarity and hold preset values
What two effects does a return statement have on the behavior of a function?
it breaks from the containing codeblock
it returns the value following the return keyword
Why do we log things to the console?
for testing and understanding
What is a method?
a function that is an object property
How is a method different from any other function?
it must be called on an object, or the object must exist
How do you remove the last element from an array?
.pop()
How do you round a number down to the nearest integer?
Math.floor(x)
How do you generate a random number?
Math.random()
How do you delete an element from an array?
.splice(index, 1)
How do you append an element to an array?
.push()
How do you break a string up into an array?
.split(delim)
Do string methods change the original string? How would you check if you weren’t sure?
no, console.log()
Roughly how many string methods are there according to the MDN Web docs?
roughly 20-30
Is the return value of a function or method useful in every situation?
no
Roughly how many array methods are there according to the MDN Web docs?
roughly 20-30
What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?
mdn js
mdn css
Give 6 examples of comparison operators.
=== == != !== <= >=
What data type do comparison expressions evaluate to?
boolean
What is the purpose of an if statement?
execute code based on the result of a conditional
Is else required in order to use an if statement?
no
Describe the syntax (structure) of an if statement.
if (condition) {
return code;
}
What are the three logical operators?
AND &&
OR ||
NOT !
How do you compare two different expressions in the same condition?
chaining them with a logical operator
