Part 1

Question 1

Must you explicitely type variables?

Answer 1

No,

var i = 0;

OR

i = 0;

OR

i = { }

which means you can assign them to another type.

Question 2

how is var scoped

Answer 2

Function unless there is no function in which case it is global

Question 3

how is let scoped

Answer 3

Block as in between the curly braces

Question 4

let i = 10;

if (i == 10) {
 let i = 5;
 console.log(i);
{

console.log (i);

What is the output from this?

Answer 4

5
10

because the let in side the curly braces is scoped within the curly braces.

Question 5

Is “let” hoisted inside a function?

Answer 5

No, if it is referenced before it is declared, you get an error.

Question 6

Example of Tagged Templates. (note back ticks)

Assume
let harry = ` Mr. and Mrs. Dursley next door `
let fred = ` Mr. and Mrs. Baggins the other next door `
let betty = ` Mr. and Mrs. Bilbo across the street`

let lines = [harry, fred, betty] ;

using a function buildHTML

Answer 6

function buildfHTML(strings, expr, expr1, exprLines) {
console.log(strings);
console.log(expr);
console.log(expr1);
console.log(exprLines);
}

const result = buildHTML${ lines[0] }, ${ lines[1] }, ${ exLines }

Question 7

What are REST parameters?

Answer 7

indicates the “rest of” the parameters :-)

Input: function example( first, last, …details);

This is the opposite of “Spread” parameters.

Question 8

What are spread parameters?

Answer 8

The opposite of REST parameters, the Spread the argument out in a statement as here:

function example(message, ...parms) { \<-- parms is rest here
 console.log(message, ...parms); \<-- parms is spread here

Question 9

Show an example of a tail call?

Answer 9

If the last line of a function (the return statement) calls yet another function ( or recurses ) and then further manipulates the return from the call before returning, this is not a tail call and requires additional stack for the call.

If it does NOT manipulate the results of the call before returning, TCO (Tail call optimization) just reuses the existing call stack with out any further stack allocation.

Question 10

Given variables a and b and then an array: ara = [‘first’, ‘second”],

show a destructured assignment leaving a = ‘first’, and b= ‘second’.

Answer 10

[a, b] = …ara;

OR

[a, b] = [‘first’, ‘second’]

[a, b, …rest] = [‘first, ‘second’, 30, 40, 50];
here rest becomes [30, 40, 50]

Question 11

What happens in ES6+ for the following destructuring of variables from objects?

var course = { name: “French”, publisher: “Louis” };

function crsDetails( course ) {
 let { name, publisher, price } = course;
...

Answer 11

ES6+ at least recognizes it as an error since price can’t be set.

Question 12

Show how to mark a parameter is optional in a destructured expression that follows: (price is optional)

let { name, publisher, price } = c;

Answer 12

let { name, publisher, ?price } = c;

Question 13

Difference between for .. of and for .. in operators.

Answer 13

for …of use to iterate over interables (arrays).

for …in use to iterate over properties of an object.

Question 14

How to retrieve value(s) from a generator such as:

function \* generatorFunction( ) {
 yield 'a';
 yield 'b';
 return 'c';
 yield 'd';
 }

What happens when it is called four times.

Answer 14

Calling

var x = generatorFunction( );

will return ‘a’, then ‘b’, then returns with the done property set to true.

Question 15

What type of object is returned by a generator function?

Answer 15

{ value: any, done: boolean }

Question 16

let s = new Set( [10, 20, 30] );

s.add( 20 );

What will happen?

Answer 16

20 will not be added again because it is already there.

Question 17

How to remove entry ‘20’ from a set ‘s’.

Answer 17

s.delete( 20 );

Question 18

Show using a Map iterator to get map entry contents.

Answer 18

m.set( ‘0’, ‘foo’ );
m.set( 1, ‘bar’ );
const iterator = m.keys();
console.log(iterator.next().value ); // “0”
console.log(iterator.next().value ); // 1

m.size; // 2

Question 19

Show how to set a map entry.

Console.log( show if value was set );

Answer 19

myMap = new Map();
... myMap.set( name**,**'first' );

console.log( myMap.has(keyvalue) ); // true of false

Question 20

show how to empty a map.

Answer 20

map.clear( );

Question 21

show how to delete a specific map entry

Answer 21

map.delete( key );

Question 22

Show how to get the value of a map given a key

Answer 22

myValue = map.get( key );

Question 23

Show how to test for a specific key value in a map.

Answer 23

map.has( key );

Question 24

show how to interate over a map and show the key, value, and map.

Answer 24

var m = new Map( );

m. set( ‘a’, 1 );
m. set( ‘b’, 2 )

m. forEach ( (k, v, m) =>
console. log( **key: ${ k } value: ${ v } map: ${ m }** ) )

// key:1 value:a map:[object Map]
// key:2 value:b map:[object Map]

Question 25

show using for .. of to iterate a map showing key and value

Answer 25

for ( [key,value] of m )
console.log( key + ‘=’ + value )

// a=1
// b=2

Question 26

Show how to use an map iterator to obtain the entries.

Answer 26

var m = new Map( )

m. set( ‘a’, 1 )
m. set( ‘b’, 2 )

var iter = m.**keys**( )
obj = iter.next(); // obj: {value: "a", done: false}
obj = iter.next(); // obj: {value: "b", done: false}
obj = iter.next(); // obj: {value: undefined, done: true}

Question 27

Show how to use an iterator with a Map to obtain the values.

Answer 27

var m = new Map( )

m. set( ‘a’, 1 )
m. set( ‘b’, 2 )

var iter = m.**values**( )
obj = iter.next(); // obj: {value: "a", done: false}
obj = iter.next(); // obj: {value: "b", done: false}
obj = iter.next(); // obj: {value: undefined, done: true}

Question 28

Describe a MAP function

Answer 28

Objects have been used as maps (key value pairs).

Keys can be any type and are placed in the order they were inserted.

Diff between Map and Object

Objects must be string keys, Maps any type
Objects are now ordered, but you must find the keys and then iterate.

Maps have a size function.

Example Map:
let contacts = new Map()
 contacts.set('Jessie', {phone: "213-555-1234", address: "123 N 1st Ave"})
 contacts.has('Jessie') // true
 contacts.get('Hilary') // undefined
 contacts.set('Hilary', {phone: "617-555-4321", address: "321 S 2nd St"}) contacts.get('Jessie') // {phone: "213-555-1234", address: "123 N 1st Ave"}
 contacts.delete('Raymond') // false
 contacts.delete('Jessie') // true
 console.log(contacts.size) // 1

Question 29

Show example of jQuery and AJAX. ( commonly used pre ES6 )

Answer 29

$.ajax(“http://services.odata.org/v4/Northwind/Northwind.svc/”, {

success: function(data) {
console. log(data.value);
* *} ,**
error: function( ) {
console. log(“failed to fetch data”) ;
* *}**
* *} ) ;**

Question 30

Show example of using ES6+ fetch method.

Answer 30

fetch( “http://services/odata.org/V4/Northwind/Northwind.svc/”, {
method: ‘get’ } ) . then( function(response) {
return response.json() ;
} ) . then( function(data) {
console.log( data.value) ;
} ) . catch( function( ) {
console.log(“failed to fetch data) ;
} ) ;

Question 31

Show a promise constructor.

Answer 31

function add_positivenos_async(n1, n2)
{
let p = new Promise(function (resolve, reject) {
if (n1 >= 0 && n2 >= 0) { //do some complex work
resolve(n1 + n2) }
else
reject(‘NOT_Postive_Number_Passed’)

} )
return p;
}

add_positivenos_async(10, 20)

• *.**then(successHandler) // if promise resolved
• *.**catch(errorHandler);// if promise rejected

add_positivenos_async(-10, -20)

• *.**then(successHandler) // if promise resolved
• *.**catch(errorHandler);// if promise rejected

function errorHandler(err) {
 console.log('Handling error', err)
}

function successHandler(result) {
 console.log('Handling success', result)
}

Question 32

Show using promise to wrap a jQuery Ajax pattern.

Answer 32

var promise = new Promise( resolve, reject ) {

$.ajax( “http://services.odata.org/V4/Northwind/Northwind.svc/”, {
success: function (data) {
resolve(data);
} ,
error: function( ) {
reject(“Error”);
}
}

promise.then (function (result) {
console.log( result );
} , function ( err ) {
console.log( err );
} ) ;

Question 33

Show example of string repeat

Answer 33

var stg = “SkillBakery “.repeat(2);

stg is “SkillBakery SkillBakery “;

Question 34

String contains has been deprecated. Show how to determine if a string contains a substring.

Answer 34

result: bool = “ World “.includes( “rl” ) ;

true

Question 35

What is the method to test the starting of a string.

Answer 35

var x:bool = “SkillBakery ES6” . startsWith( “Skill” ) ;

true

Question 36

What is the method to test the ending of a string.

Answer 36

var x:bool = “SkillBakery ES6” . endsWith( “Bakery” ) ;

false

Question 37

Iterate over a string.

Answer 37

for ( var ch of ‘SkillBakery’) {
console.log( ch ) ;
}

Question 38

Show each:
how to get the part of the number that left of decimal

test if the number IS a number or not

test if a number if finite or not.

Answer 38

Math.trunc(39.7) // 39

Number.isNaN(45) // false

Number.isFinite(-Infinity) // false

Question 39

How to search an array of strings for a specific entry?

Answer 39

var result = [“skill”, “bakery”, “es6”, “course”]. find(x => x == “Bakery”);

Question 40

Show how to create an Array using the characters in a string.

Answer 40

var myA = Array.from(“this is a test”);

Question 41

Show creating an array using passed arguments.

Answer 41

var A = Array.of(42, 16, 20);

Question 42

Show how to overwrite an array from a starting position.

Answer 42

[0, 0, 0] . fill( 7, 1 ) starts at position 1: [0, 7, 7]

Question 43

Find the index of an entry in an Array.

Answer 43

[1, 2, 3, 4, 5] . findIndex(x => x == 2)

result is 1

Question 44

Show how to copy (overwriting) an array within.

Answer 44

[1, 2, 3, 4, 5, 6] . copyWithin( 3, 1 )

says find the entry with value ‘3’ and begin copying AFTER that using the source starting with index == 1 (value ‘2’).

result: [1, 2, 3, 2, 3, 4]

Question 45

Show combining one or more source objects.

Answer 45

var destination = { start: 0 };
var source\_mid = { interval: 10, duration: 20 } ;
var source\_end = { distance: 40 };

Object.assign( destination, source_mid, source_end ) ;

destination is the concatenation of itself and the other arguments.

subsequent changes to sources, do not affect the new destination entries.

Question 46

What is a “template literal”?

Answer 46

ES5 they were called template strings.

They are string literals showing embedded expressions.

string text

string text line 1 string text line 2

string text ${expression} string text

tagstring text ${expression} string text

If there is an expression preceding the template literal (tag here), this is called a tagged template. In that case, the tag expression (usually a function) gets called with the template literal, which you can then manipulate before outputting.