Array, Statements, Declarations Flashcards

1
Q

filter() Method

A
creates a new array with all elements that pass the test implemented by the provided function.
ex: const result = words.filter(word => word.length > 6);
sytanx:
var newArray = arr.filter(callback(element[, index[, array]])[, thisArg])
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

While loop

A
repeat a block of code until a condition is met:
ex: var n = 0;
while (n < 3) {
  n++;
}
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

Difference between do and while and just a while loop

A
A do/while loop runs at least once and then checks condition:
do {
  i = i + 1;
  result = result + i;
} while (i < 5);
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

.shift()

A

removes the first element of an array

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

get the length of an array

A

.length

ex: array.length

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

unshift()

A

adds elements to front of array:

ex: arr.unshift(element1[, …[, elementN]])

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

reverse an array

A
The reverse() method reverses an array in place.
ex: a.reverse()
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Map method

A
The map() method creates a new array with the results of calling a provided function on every element in the calling array.
ex: const map1 = array1.map(x => x * 2)
var new_array = arr.map(function callback(currentValue[, index[, array]]) {
    // Return element for new_array
}[, thisArg])
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

concat()

A

Concat method is used to merge two or more arrays. This method does not change the existing arrays, but instead returns a new array.
ex:
var new_array = old_array.concat([value1[, value2[, …[, valueN]]]])
ex: array1.concat(array2)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

every() method

A
The every() method tests whether all elements in the array pass the test implemented by the provided function.
ex: function isBelowThreshold(currentValue) {
  return currentValue < 40;}
var array1 = [1, 30, 39, 29, 10, 13];
console.log(array1.every(isBelowThreshold));
// expected output: true
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

Find() method

A
The find() method returns the value of the first element in the array that satisfies the provided testing function. Otherwise undefined is returned.
ex: var found = array1.find(function(element) {
  return element > 10;
});
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

forEach() method

A
The forEach() method executes a provided function once for each array element.
ex:
array1.forEach(function(element) {
  console.log(element);
});
syn:
arr.forEach(callback[, thisArg]);
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

includes() method

A
The includes() method determines whether an array includes a certain value among its entries, returning true or false as appropriate.
ex: array1.includes(2)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

join() method

A

The join() method creates and returns a new string by concatenating all of the elements in an array (or an array-like object), separated by commas or a specified separator string. If the array has only one item, then that item will be returned without using the separator.

elements.join(‘’), elements.join(), elements.join(‘-‘)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

pop() method

A
The pop() method removes the last element from an array and returns that element. This method changes the length of the array.
ex: arr.pop()
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

push() method

A

The push() method adds one or more elements to the end of an array and returns the new length of the array.

ex: animals.push(‘cows’)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

reduce() method

A

The reduce() method executes a reducer function (that you provide) on each member of the array resulting in a single output value.

ex: const array1 = [1, 2, 3, 4];
const reducer = (accumulator, currentValue) => accumulator + currentValue;
// 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

slice() method

A

The slice() method returns a shallow copy of a portion of an array into a new array object selected from begin to end (end not included). The original array will not be modified.

ex: arr.slice([begin[, end]])
animals. slice(2, 4) or just animals.slice(2)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

sort() method

A

The sort() method sorts the elements of an array in place and returns the array. The default sort order is built upon converting the elements into strings, then comparing their sequences of UTF-16 code units values.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

splice() method

A
The splice() method changes the contents of an array by removing or replacing existing elements and/or adding new elements.
ex: array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

toString() method

A

The toString() method returns a string representing the specified array and its elements.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

continue statement

A

The continue statement terminates execution of the statements in the current iteration of the current or labeled loop, and continues execution of the loop with the next iteration.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

debugger statement

A

The debugger statement invokes any available debugging functionality, such as setting a breakpoint. If no debugging functionality is available, this statement has no effect.
ex:
function potentiallyBuggyCode() {
debugger;
// do potentially buggy stuff to examine, step through, etc.
}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

for loop

A

The for statement creates a loop that consists of three optional expressions, enclosed in parentheses and separated by semicolons, followed by a statement (usually a block statement) to be executed in the loop.
ex:
var str = “”;
for (var i = 0; i < 9; i++) {
str = str + i;
}
console.log(str); // expected output: “012345678”

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

for…in statement

A
The for...in statement iterates over all non-Symbol, enumerable properties of an object.
ex:
var string1 = "";
var object1 = {a: 1, b: 2, c: 3};
for (var property1 in object1) {
  string1 += object1[property1];
}
console.log(string1); // expected output: "123"
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

for…of statement

A
The for...of statement creates a loop iterating over iterable objects, including: built-in String, Array, Array-like objects (e.g., arguments or NodeList), TypedArray, Map, Set, and user-defined iterables. It invokes a custom iteration hook with statements to be executed for the value of each distinct property of the object.
ex:
let iterable = [10, 20, 30];
for (const value of iterable) {
  console.log(value);
}
// 10
// 20
// 30
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

function declaration

A
The function declaration (function statement) defines a function with the specified parameters.
function calcRectArea(x, y) {
  return x* y;}
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

return statement

A

The return statement ends function execution and specifies a value to be returned to the function caller.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

switch statement

A

The switch statement evaluates an expression, matching the expression’s value to a case clause, and executes statements associated with that case, as well as statements in cases that follow the matching case.

use when you have a lot of else if statements

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

throw statement

A

The throw statement throws a user-defined exception. Execution of the current function will stop (the statements after throw won’t be executed), and control will be passed to the first catch block in the call stack. If no catch block exists among caller functions, the program will terminate.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

try…catch

A

The try…catch statement marks a block of statements to try, and specifies a response, should an exception be thrown.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

arrow function expression

A

An arrow function expression is a syntactically compact alternative to a regular function expression, although without its own bindings to the this, arguments, super, or new.target keywords. Arrow function expressions are ill suited as methods, and they cannot be used as constructors.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

Default function parameters

A
Default function parameters allow named parameters to be initialized with default values if no value or undefined is passed.
function multiply(a, b = 1) {
  return a * b;
}
console.log(multiply(5, 2));// expected output: 10
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

constructor method

A

The constructor method is a special method for creating and initializing an object created within a class.

A constructor can use the super keyword to call the constructor of a parent class.

If you do not specify a constructor method, a default constructor is used.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
35
Q

extends keyword

A
The extends keyword is used in class declarations or class expressions to create a class which is a child of another class.
ex:
class formatDate extends Date {
  constructor(dateStr) {
    super(dateStr); }
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
36
Q

Function arguments

A
arguments are values that are passed into functions that receive them as parameters.. (arg= 2,4)
ex: 
function add(a,b){ 
 return a + b;
} 
add(2, 4)
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
37
Q

Function parameters

A
function add(a,b){ 
 return a + b;
} 
parameters are a &amp; b in add function above
arguments are values that are passed into functions that receive them as parameters. What matters the most for parameters is the order in which they were received.
38
Q

return in a block of code within a function

A

anything written after a return statement will not execute. This is because the return statment will terminate the function after running the line of statements within it.

39
Q

Function Declaration Hoisting

A

two-pass compiler. Function declarations are defined in the first pass. It means that function declarations can be invoked before they are defined!

// This code is valid above the definition!
console.log(add(2,4)) // 6 
function add(a,b){ 
 return a + b;
}
40
Q

which functions does hoisting not apply to?

A

function expressions or arrow functions.

41
Q

Function expressions differences against function declarations

A
  1. A variable is used to store the function for later use
  2. Anonymous functions are used
  3. Function expressions are not hoisted. They can only be invoked after a definition has been placed in the execution stack.
42
Q

An ex of function expression?

A
const add = function(a,b){ 
 return a + b;
} 
console.log(add(2,4)) // 6
43
Q

Why is function expressions and not use a function declaration?

A

more control over our code now. Our function expression cannot be hoisted so we can tell it when to do its job easier. We also gain the syntactical sugar of an anonymous function. We can place functions within functions easier without having to name them.

44
Q

syntactical sugar

A

is syntax within a programming language that is designed to make things easier to read or to express

45
Q

What are Arrow functions and what do they look like?

A

fancy looking function expressions with a major feature removed, the this keyword.

ex: const add = (a,b) => { 
 return a + b;
} 
console.log(add(2,4)) // 6
46
Q

arrow function vs expression function

A
// function expression syntax
// const add = function(a,b) { 
//  return a + b;
// } 
// arrow function expression syntax
const add = (a,b) => { 
 return a + b;
} 
console.log(add(2,4)) // 6
47
Q

When not to use arrow functions

A
  1. Event handlers (Unless they are inside a class constructor!)
  2. Object methods
  3. Prototype methods
  4. Anytime you need to use arguments Object
48
Q

difference between:
let
const
var

A

let can be re-assigned but not overridden

const is immutable and can never be re-assigned

var can be re-assigned and overridden.

49
Q

Create an object literal

A
const myPersonalObject = {  
firstName: 'Fred',  
lastName: 'Flintstone',  
};
50
Q

How are Object properties(stored data) organized?

A

Key:value pairing

51
Q

Dot Notation and bracket notation for referencing properties in object

A

dot:
mypersonObject.firstName

Bracket:
mypersonObject[“firstName”]

52
Q

changing a value in an object

A

just like a variable. reference what we want to change and set = to it
ex: mypersonObj.firstName = ‘wilma’
This changes the key firstName’s value in the obj to wilma

53
Q

Are object’s values mutable even though object names start with const?

A

yes, the values on the obj. It will never point to another object but we can change the props

54
Q

What does Object.keys()

A

Gives us an array back of the Object’s properties/keys
ex:
const keys = Object.keys(myPersonalObject);
returns [‘firstName’, ‘lastName’];

55
Q

What does Object.values()

A

Gives us an array back of all the Object’s values
ex:
const values = Object.values(myPersonalObject)
returns [‘Wilma’, ‘Flintstone’];

56
Q

What does Object.entries()

A

Gives us back an array of the Object’s key/value pairs as a tuple
ex:
const entries = Object.entries(myPersonalObject);
returns [ [ ‘firstName’, ‘Wilma’ ], [ ‘lastName’, ‘Flintstone’ ] ]​​​​​

57
Q

An array under the hood might look something like this:

A
Arrays have a special 0 based indexing (organizational) ability.
array: {  
'0': 'firstValue',  
'1': 'secondValue,  
}
58
Q

Closure statement developers need to ask

A

“What data do I currently have access to in my program

59
Q

Two types of scope

A

Global scope and local

60
Q

What happens when a function is declared and created? in terms of socope

A

a new scope is created. Variables declared within functions scope will be enclosed in lexical/private scope.
it is important to remember, that functions look outward for context. If some variable isn’t defined in a function’s scope, the function will look outside the scope chain and search for a variable being referenced in the outer scope.

61
Q

What are callback functions

A

callback functions are just functions that are passed into other functions as arguments. That function is then invoked inside the outer function and does some action.

 function sayHello(name) {
    console.log(`Hello, ${name}`);
  }
  function callSayHelloWithName(callback) {
    const innerName = 'Lars';
    callback(innerName);
  }

callSayHelloWithName(sayHello);

62
Q

difference in .forEach and .map

A

We technically could do whatever we want with that data, but remember that .forEach doesn’t return us anything like .map does.

63
Q

The three things you’d get back from a callback passed to Map

A

The current item of the array state
The current index of the current item index
The entire array data

const mappedCityStates = data.map((state, index, data) => {
  return {'city': state.city, 'state': state.state};
});
64
Q

simple for loop add data together

A
let statePopulations = 0;
for(let i = 0; i < data.length; i++) {
  statePopulations += data[i].population;
}
65
Q

Detailed definition of functions and how closure works

A

The key to remember is that when a function gets declared, it contains a function definition and a closure. The closure is a collection of all the variables in scope at the time of creation of the function.

When a function gets created and passed around or returned from another function, it carries a backpack with it. And in the backpack are all the variables that were in scope when the function was declared.

66
Q
Equivalent in reg function: 
let c = 4
const addX = x => n => n + x
const addThree = addX(3)
let d = addThree(c)
console.log('example partial application', d)
A
let c = 4
function addX(x) {
  return function(n) {
     return n + x
  }
}
const addThree = addX(3)
let d = addThree(c)
console.log('example partial application', d)
67
Q

Good way to think of this keyword and its relationship to objects

A

a Pointer to an object. For example: you can use the this keyword to reference an object without having to refer to that object’s name.

68
Q

window/global Object binding: scope for this what does this point to?

A

this will be the window/console Object

function sayName(name) {
  console.log(this);
  return name;
}
sayName("D'Artagnan");
69
Q

Implicit Binding

A

Whenever a function is called by a preceding dot, the object before that dot is this.

const myObj = {
  greeting: 'Hello',
  sayHello: function(name) {
    console.log(`${this.greeting} my name is ${name}`);
    console.log(this);
  }
};
myObj.sayHello('Ryan');
70
Q

What is a constructor function?

A

A constructor function is a function that returns an object. It’s an object creator. When we call it we have to use the new keyword.

71
Q

Explicit binding

A

Whenever JavaScript’s call or apply method is used, this is explicitly defined.

72
Q

Prototype mechanism

A

prototype as an object that objects use to hold onto values that can be passed down to other objects. We use it all the time in inheritance.

73
Q

What does a class function look like and declare an instance of the class

A
class Rectangle {
  constructor(height, width) {
    this.height = height;
    this.width = width;
  }
} *
Declaring a new Rectangle
const newRect = new Rectangle(400, 800);
console.log(newRect);
74
Q

What do classes return

A

objects

75
Q

What binds our classes together for Inheritance with a class

A

extends and supper(), which bind classes together to achieve some simple object inheritance.

76
Q

Class inheritance, what does extends do?

A

The ‘extends’ keyword is used to extend a parent object. A clue to find out if a class is a sub-class is to look for extends.

class Dog extends Animal {
  constructor(name) {
    super(name);
  }
77
Q

Class inheritance, what does super() do?

A

super() is used to tell a parent’s constructor to be concerned with the child’s attributes vis versa and abstracts away the Object.create(this, Class) syntax that is really tricky to sink one’s teeth into.

78
Q

All methods attached to the class body will be stored where?

A

on the Objects prototype in a special way. There is a bit more magic here than just Object.create(Foo.prototype); and Class.call(this, attrs); But now that we know this, we can accept that the class keyword does this gloriously for us.

79
Q

If you use extends what else needs to be called

A

super() needs to be called from within the constructor function. This is to pass any new attributes back up to the constructor of the parent object.

80
Q

What is the DOM (Document Object Model)

A

The Document Object Model is an object representation of the html elements of a webpage. It gives an interface to interact with and manipulate the page, changing document structure, content, and styling.

81
Q

What data structure is the DOM

A

The object model is a tree structure with each DOM element therefore being a tree node, containing all the same property keys as each other node. Some of these node properties are informational while others are methods that we can use for interaction. The DOM , creating and propagating event objects, which hold information about the event type and target, up the tree.

82
Q

Selecting DOM elements

A

document.getElementsByTagName(‘p’)
It will return an array-like object called an HTMLCollection containing all the elements that contain the element name supplied.

document.getElementById(‘idName’);
This method will take a single string as an argument containing the id of an element,

document.getElementsByClassName('className');
This method will take a single string as an argument containing the class of the elements you want to select. It will return an array-like object called an HTMLCollection
83
Q

What do querySelector Methods do?

A

These methods give us the opportunity to select element(s) based on CSS style selectors (remember . is class, # is id, etc). Each method takes a string containing the selectors and returns the element(s). Note - We can select by element, id, class or others with both methods.

84
Q

document.querySelector(‘.custom-style’); vs document.querySelectorAll(‘queryString’);

A

selector: This method will search for and return the first element that matches the value passed into the method.

selectorAll: This method will search for and return ALL elements matching the query string. returns these elements in an array-like object called a NodeList

85
Q

The Difference between HTMLCollection, NodeList, and Array

A

They both have numerical zero-based indices, and the length property but that is all they share with an Array.

NodeList does take it one step further, and has access to .forEach. There is no .reduce or .map or any other array method.

86
Q

How to create an array from an array-like object

A

.from()

Array.from(arrayLikeObject)

87
Q

Why is it necessary to use document in front of querySelector()?

A

because querySelector is a method of the document object

88
Q

What are callback functions

A

come from functional programming. A function is passed as a parameter to another function.

89
Q

what does the this keyword do?

A

Pronoun to use in place of an object
gives you the object’s context
nothing to do where the function is written, but where and when the function is called
Four Principles of this?

90
Q

Explain event delegation

A

which you add a single event handler to a parent element in order to avoid having to add event handlers to multiple child elements.`