Loops

Question 1

Do a block. Then Continue doing it while a condition is true

Answer 1

do {
}
while ( )

Question 2

If a condition is true keep doing a block with local scope conditional and variables

Answer 2

for (let i = 0; i < 4; i ++) {

}

Question 3

If a condition is true, do a block. Continue if still true

Answer 3

while ( ) {

}

Question 4

Do a function for each array element (method)

Answer 4

myArray.forEach(element => )

Question 5

Return a new array based off another’s elements and a callback function (arrays, not array like objects).

What’s the one for array-like objects?

Answer 5

myArray.map(element => )

Array.from() is the one for array-like objects

Question 6

End a loop
Stop and loop and return something
Skip to the next loop iteration

Answer 6

break
return
continue

Question 7

Return the type of data
(will return a string)

Answer 7

typeof input

Question 8

Return boolean whether argument is an array or not

Answer 8

Array.isArray( )

Question 9

Do a block with every element in an array or character in string.

Answer 9

for (let (…element) of …)
for (let variableName of iterableArrayOrFunction) {
statement
}

Question 10

Do a block with each key in an array, object, or function

Answer 10

for (let (…key) in …

Question 11

What elements of:
for (let i = 0; i < 4; i ==) {
}
Can be skipped

Answer 11

all of them, you can do:
for (;;) {
}
it will just loop endlessly

Question 12

Expected output // 1, then 3, 5, 7, 9
Both of these will give the output:

for (let i = 0; i < 10; i++) {
   if (i % 2 == 0) continue;
   alert(i);
}

vs

for (let i = 0; i < 10; i++) {
   if (i % 2) {
     alert( i );
   }

}

But which should you use and why?

Answer 12

The first one is nicer because it reduces nesting

nesting bad because it can be hard to read??

Question 13

What does break do here?

for (let i = 0; i < 3; i++) {

for (let j = 0; j < 3; j++) {

let input = prompt(`Value at coords (${i},${j})`, '');

break;   } }

Answer 13

only breaks from first loop

Question 14

Break from multiple nested loops.

Answer 14

Use labels:
outerLabel: for (let i = 0; i < 3; i++) {  //(*)

for (let j = 0; j < 3; j++) {

let input = prompt(`Value at coords (${i},${j})`, '');

    // if an empty string or canceled, then break out of both loops
    if (!input) break outerLabel; // (*)

    // do something with the value...
  }
}
alert('Done!');

Question 15

Can you use arbitary expressions in switch statements?
For example:
switch () {
  case b + 1 :
  console.log('etc');
  break;
}

Answer 15

Yes

Question 16

Do switch statements use equality or strict equality?

Answer 16

Strict

Question 17

What is returned from:

(i > 5) ? alert(i) : continue;

Answer 17

It throws an error its not a loop so continue doesn’t do anything

Question 18

What’s the difference between:
for (let… in …)
for (let… of …)
for (let …)

Answer 18

for (let… in …) - The for…in statement iterates over all enumerable properties of an object that are keyed by strings (ignoring ones keyed by Symbols), including inherited enumerable properties.
for (let variableAsString in object) {
statement
}

for (let... of ...) -  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.
for (variable of iterable) {
  statement
}
for (let (...element) of ...)
for (let variableName of iterableArrayOrFunction) {
  statement
}

for (let …) - 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.
for ([initialization]; [condition]; [final-expression])
statement
can do:
for (;;) {
}

Question 19

What is logged to console from:

let myObject = {
  1: 1,
  2: 2,
  3: 3,
}

for (value of myObject) {
console.log(value);
}

Answer 19

Error,

myObject is not iterable

Question 20

What must a value have for it to be iterable (by the for of loop for instance)?

Answer 20

It must have the ‘next’ method
a Symbol.iterator key that returns an object with the next() method that returns an object { done: true or false, value: the value }

Question 21

What is the algorithm for the for of loop? (4 steps)

Answer 21

1. When for..of starts, it calls that method:
   range[Symbol.iterator] = function() {
   return Iterator object…
   once (or errors if not found). The method must return an iterator – an object with the method next.
2. Onward, for..of works only with that returned object.
3. When for..of wants the next value, it calls next() on that object.
4. The result of next() must have the form {done: Boolean, value: any}, where done=true means that the loop is finished, otherwise value is the next value.

Question 22

Create an iterable object that will receive the values 1 through 5 from this object:
let range = {
  from: 1,
  to: 5
};

Answer 22

let range = {
from: 1,
to: 5
};

// 1. call to for..of initially calls this
range[Symbol.iterator] = function() {       
  // ...it returns the iterator object:

// 2. Onward, for..of works only with the iterator object below, asking it for next values
return {
current: this.from,
last: this.to,

    // 3. next() is called on each iteration by the for..of loop
    next() {

      // 4. it should return the value as an object {done:.., value :...}
      if (this.current <= this.last) {
        return { done: false, value: this.current++ };
      } else {
        return { done: true };
      }
    }
  };
};

// now it works!
for (let num of range) {
  alert(num); // 1, then 2, 3, 4, 5
}

Question 23

The following is incorrect.
T or F

let range = {
from: 1,
to: 5
};

range[Symbol.iterator] = function() {
return {
current: this.from,
last: this.to,

    next() {
      if (this.current <= this.last) {
        return { done: false, value: this.current++ };
      } else {
        return { done: true };
      }
    }
  };
};

Answer 23

False
An iterator is created by the call to the Symbol.iterator method
For the iteration to continue the symbol.iterator method has to return an object with the next() method on it.

Question 24

Adding Symbol.iterator inside an object does not make the object properties iterable. But instead calls upon another object to set the rules of iteration
T or F

Answer 24

True
BUT The iterator looks for the next() method in whatever object is returned from myObject.Symbol.iterator.
So you can return the outer object in range.Symbol.iterator (return this) and have the next() method there.

let range = {

from: 1,
to: 5,

Symbol.iterator {
this.current = this.from;
return this;
},

  next() {
    if (this.current <= this.to) {
      return { done: false, value: this.current++ };
    } else {
      return { done: true };
    }
  }
};

for (let num of range) {
alert(num); // 1, then 2, 3, 4, 5
}

The downside is that now it’s impossible to have two for..of loops running over the object simultaneously: they’ll share the iteration state, because there’s only one iterator – the object itself. But two parallel for-ofs is a rare thing, even in async scenarios.

Question 25

You can’t have infinite iterables in an object

T or F

Answer 25

False

For instance, the range becomes infinite for range.to = Infinity.

Question 26

You can’t run a for of loop on a string

T or F

Answer 26

False

Question 27

Call an iterator on this string manually using while(true) and then controlling everything else with the string's iterator.
let str = "Hello";
(reverse card for hint. Then scroll down for solution)

Answer 27

hint: 
Set a variable to str's iterator function (to the object that contains next())
Set a variable to  the value of next() (the {done:  value:}  object)
Set a conditional based on 'done' to break the loop.
Then do whatever you want to happen for each character
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
.
let iterator = str[Symbol.iterator]();

while (true) {
  let result = iterator.next();
  if (result.done) break;
  alert(result.value); // outputs characters one by one
}

Question 28

What’s the difference between an iterable and an array-like object?

Answer 28

Iterables are objects that implement the Symbol.iterator method, as described above.
Array-likes are objects that have indexes and length, so they look like arrays.

Question 29

Strings are iterable and array-like objects

T or F

Answer 29

True. Strings are both iterable (for..of works on them) and array-like (they have numeric indexes and length).

Question 30

What makes an object Array-like?

Answer 30

They have indexes and length, so they look like arrays.

Question 31

What makes an object iterable?

Answer 31

They implement the Symbol.iterator method and have the next() method

Question 32

“range” is iterable and array-like
T or F
let range = {
  from: 1,
  to: 5
};

range[Symbol.iterator] = function() {
return {
current: this.from,
last: this.to,

    next() {
      if (this.current <= this.last) {
        return { done: false, value: this.current++ };
      } else {
        return { done: true };
      }
    }
  };
};

Answer 32

False

range is iterable but not array-likebecause it does not have indexes or length

Question 33

arrayLike is array-like
T or F

let arrayLike = {
 0: "Hello", 
 1: "World", 
 length: 2 
}

Answer 33

True. It has indexes and length

Question 34

Array.from() can be used on each of the following T or F:

let arrayLike = {
  0: "Hello",
  1: "World",
  length: 2
};

let arrayLike2 = {
  0: "Hello",
  1: "World",
};

let arrayLike3 = {
  from: 1,
  to: 5,
arrayLike3[Symbol.iterator] = function() {
  return {
    current: this.from,
    last: this.to,
    next() {
      if (this.current <= this.last) {
        return { done: false, value: this.current++ };
      } else {
        return { done: true };
      }
    }
  };
};

Answer 34

T
F
T

Array.from() works on anything iterable and/or array-like

Question 35

What kinds of objects can Array.from() work with?

Answer 35

Array.from() works on anything iterable or array-like

Question 36

When you call for of on an object, what is it looking for?

Answer 36

1. First of all it looks for a [Symbol.iterator] key
2. Then it looks for an object to be returned from that key. So [Symbol.iterator] has to be the key for a function that can return objects [Symbol.iterator] = function() {
3. Then it looks for and calls the next() method on that object.
4. Then it looks for an object to be return from that method with this format: { done: whether the iteration ought to stop, value: the value to return }

Question 37

Why do we want to reduce nesting?

Answer 37

Reducing nesting results in
 more readable code, 
which leads to discoverable bugs, 
faster developer iteration, 
and increased stability.

Question 38

When do you want to put Symbol.iterator on an object, ?

Answer 38

when you want to run an iteration method on it and return a series of values.

Question 39

What happens with this code?
Why?

let myObject = {
  apple: 'one',
  [Symbol.iterator]() {
    return {
      end: 0,
     next() {
        if (this.end < 2) {
          this.end++;
          return {done: false, value: this.end}
       }
       return {done: true, value: this.end}
      }
    }
  }
}

console.log(…myObject);

Answer 39

logs: 1, 2

spread syntax spreads the iterable values.

Question 40

Access the input in this function
aFunction('apple', 'pear', 'orange');
function aFunction() {
  //only change code in here
{

Answer 40

aFunction('apple', 'pear', 'orange');
function aFunction() {
  argument[0],
 argument[1]
 argument[2]
{

Question 41

What is the argument variable?

Answer 41

a special array-like object named arguments that contains all arguments by their index
Better to just use rest operator

Question 42

What is the downside to the ‘argument’ variable? (2 things)

Answer 42

1. But the downside is that although arguments is both array-like and iterable, it’s not an array. It does not support array methods, so we can’t call arguments.map(…) for example.
2. Also, it always contains all arguments. We can’t capture them partially, like we did with rest parameters.

So when we need these features, then rest parameters are preferred.

Question 43

What happens when you use the arguments variable inside an arrow function?

Answer 43

If we access the arguments object from an arrow function, it takes them from the outer “normal” function.

function f() {
let showArg = () => alert(arguments[0]);
showArg();
}

f(1); // 1

Question 44

What happens with this code?

let str = “Hello”;

alert( […str] );

Answer 44

// H,e,l,l,o

The spread syntax works on iterators

Question 45

What is alerted?
let obj = { a: 1, b: 2, c: 3 };

let objCopy = { …obj };

alert(JSON.stringify(obj) === JSON.stringify(objCopy));

alert(obj === objCopy);

obj.d = 4;
alert(JSON.stringify(obj));
alert(JSON.stringify(objCopy));

Answer 45

// true
// false (not same reference)
// {"a":1,"b":2,"c":3,"d":4}
// {"a":1,"b":2,"c":3}