JavaScript Fundamentals Flashcards
What is a variable?
A container to store information or data
Why are variables useful?
Can reuse them, assign value to them
Readability
What two special characters can a variable begin with?
$
_
How do you declare a variable?
var variableName;
How do you assign a value to a variable?
Using the assignment operator (=)
Are variables case sensitive?
Yes
Which words cannot be used as variable names?
Any JS keywords
What is a string?
Form of data stored inside quotation marks
What is the string concatenation operator?
+
What is the difference when it comes to using single quotes or double quotes ( ‘ ‘ or “ “ )?
There is no difference, but must be consistent and use only one kind
How do you escape quotation characters?
\
What is type coercion?
Automatic conversion of values from one data type to another
What is a number in JavaScript?
Any number (integer and floating point)
What is an arithmetic operator?
Mathematical operators that can be used to calculate numbers
Name four of the arithmetic operators.
Addition Subtraction Division Multiplication Increment Decrement Modulo
What is the order of execution? (reference to mathematical operators)
Multiplication and division will come before addition and subtraction UNLESS you place addition and subtraction inside parentheses
What is a boolean?
Datatype of true or false
What is a comparison operator?
Compares two values and returns a boolean
What is the difference between undefined and null?
Undefined - absence of value
Null - intentional absence of value
What is a function?
Set of instructions to complete a task, reusable
Why are functions useful?
Reusable, don’t need to repeat yourself
How do you call a function?
functionName(arguments);
What are the parts of a function definition?
function functionName(parameters) {
// code block
}What is the difference between a parameter and an argument?
Parameter - variables when declaring a function
Argument - what you pass in when calling or invoking a function
Why is it important to understand truthy and falsy values?
To understand how they can be used in conditionals and how it will affect the result/return value
Why is the typeof null an object?
Bug in JavaScript creation
Why do you always use === for comparisons?
To make sure the values being compared in data type and value
Do all if statements require an else statement?
No
What is the proper syntax for using the or operator?
condition1 || (dual pipes) condition2
Why do you want to avoid using == for comparison?
Type coercion, don’t let JavaScript decide what type to make the value
What is the primary use case for switches?
Checks an expression against multiple cases, then executes the code of a matching case
Does the default case have to be at the bottom of the switch statement?
No
What happens if there is no break statement between cases?
The next case will be executed even if the evaluation does not match the case
What is an object in JavaScript?
Grouping mechanism
Collection of related data to store key:value pairs & methods
How do you create an object literal?
var objectName = {}
var objectName = new Object();What is a property in relation to JavaScript objects?
They are variables on an object
When should you use bracket notation over dot notation with objects?
- The irregular property name (has spaces or starts with a number)
- Subbing in a variable (with a string value) because dot notation doesn’t allow for substitution
How do you remove a property from an object?
delete objectName.propertyName
* not super common
What is an array in JavaScript?
Way to store data as lists
How do you create an array literal?
[]
What are the keys for the values inside an array?
Numbers starting at 0 indexing
Arrays have a property named length. Because arrays have a properties, what other data structure are they similar to?
Objects - Array is a type of object
What are some good use cases for using objects inside arrays?
If you have a collection of data on similar/related items that you want to store in a list
Ex. Items in a grocery store
var itemsSoldInStore = [ ]
{
name: apple,
price: 1,
inStock: true
}
What is the primary advantage to storing your selected elements in a variable?
Easier to access, more efficient, reusable
Why might you need JavaScript to modify the DOM after the page loads?
Any user interaction with the webpage
Allows you to update the webpage in a more efficient way
How can you better prepare when writing HTML for DOM manipulation in your JavaScript code?
Semantic HTML so easier to select elements More intuitive or distinctive class names *Easier to access the elements we are looking for
What are the differences between innertext and textContent?
innerText - reads CSS rules, may be slower, may not be supported on all browsers, only shows “human-readable” text
textContent - ignores markup inside text element, gets text from ALL elements
What datatype are the values you remove from a text input?
String
Why is it so important to be able to dynamically update text?
If user interacts with websites, want to be able to show that a change happened
- way to communicate with user
- Dynamic website
What are some of the drawbacks of HTML Event Handler Attributes?
Separate JS from HTML
Why is the Window.event property useful for finding an element which was interacted with?
Can use the window.event.target property and other information to view what element was interacted with
Can access it this way
Why is the Window.event property to be avoided in new code?
Not handled by all browsers
Does a callback function require a name?
No, can be anonymous but most cases will have name
What is the difference between the getElementById() method and the querySelector() method?
getElementById - can only get by ID
querySelector - can get any by type, like classes, elements, ids, and CSS selectors but less efficient
Who passes in the event object into the handleClick callback function?
JavaScript
What is the purpose of a loop?
While a condition is true, run this block of code,
redo multiple actions
Why might there be different kinds of loops?
Based on whether you know how many times you need to loop through the code
for - variable trying to increment
What is the purpose of a conditional expression as it relates to loops?
The loop will check to see if condition is true. If true, it will continue to run until condition is false.
Could a loop potentially go on forever?
Yes, if condition is never false
Could a loop never start?
Yes, if condition is never met or true
How does a for loop differ from a while loop?
For loop - initialization, condition, and final-expression are all together (has an end)
While loop - will run until condition is false
What potential use cases are there for for loops?
Looping through arrays and counting
Which pieces of information provided in the parentheses for a for loop are mandatory?
None are
What is a for in loop?
Variation of for loop, used to walk through object properties
How do you target the value of a property in an object?
[ ] or dot notation
When should you use a for in loop?
When you need to iterates over every property in an object
What is the difference between the parentNode and parentElement properties?
Mostly the same except for when the parentNode is not element (ex. parentNode is the DOM = parentElement is null)
Why is it important to be able to traverse the DOM?
If an item doesn’t have a class or ID, still need to be able to select it
Easier to access and see how elements are related
**To get to other elements based on what elements you’re currently on
What kind of information is useful to store in custom attributes?
Can store information regarding the DOM
*hold data in regards to JavaScript
What are two ways to target elements on the DOM?
querySelectorAll, getElementByID
What is another way to add a text node to an element other than using textContent.
innerText (stripes whitespace), innerHTML(avoid using this)
**document.createTextNode(text)
BUT textContent is best to add text (95% of the time)
How do you create a HTML element using vanilla Javascript?
document.createElement(elementName)
Why is using loops and arrays for creating multiple dom elements preferable to creating them one at a time?
Keeps code DRY
Why are arrays preferred over objects for the functionality referenced in question 1?
Because there are indexes and this sequence that will be the same order every time
Why is it important to be able to retrieve and use data from inputs?
Handling user input
Why is it dangerous to assume you have the correct data when creating elements?
People might try to hack your website
How would you alter the game to make the choice from 1 - 500?
Math.floor(Math.random() * 500) + 1
What are the disadvantages of inline styling via JavaScript?
Not separating our concerns
What things do you have to consider when building a reset game function?
- Clearing all the previous inputs
- Removing all added HTML classes (if any) or CSS styling
What is event bubbling?
Event propagation starts at most specific then flows outward towards least specific (default)
What is the difference between event.target and event.currentTarget.
event. currentTarget = target where event handler is attached
event. target = target that triggered the event handler
What is the first argument the function setTimeout takes?
anonymous or callback function
If the second argument is not passed into the setTimeout function, what is the default value?
0
What are some scenarios where setTimeout can be useful?
When we want to change the look of something after a while
Modal pop up after inactivity
What does the setInterval function return?
interval ID (number)
What argument does the clearInterval function take?
ID returned by setInterval function
What are some scenarios where setInterval can be useful?
Alternating between two images, colors
Timers
What is the event loop?
Looks at call stack and looks at the event queue
If stack is empty, will push the event queue onto the callstack
What does the term blocking mean?
slow code on the call stack that prevents code in task queue from running
What is the call stack?
data structure (or mechanism) used to keep track of where in the program we are
Which elements in a website are useful to create dynamically?
anything relies on outer source of data
Why should you not create all elements dynamically?
Slow down code
**If you can create it with HTML, use HTML
