Chapter 2

Question 1

What are examples of ES6 module-loading?

Answer 1

import and `script type=”module”

Question 2

Module:

Answer 2

a collection of state and publicly exposed methods to operate on that state

Question 3

Delimit:

Answer 3

surround, separate, define

Question 4

what are the two forms of values in JS?

Answer 4

primitives and objects

Question 5

what are the primitive value types in JS?

Answer 5

strings, numbers, symbols, booleans, null, undefined

Question 6

in JS what is better to use for empty values and why?

Answer 6

undefined; because undefined === undefined but null is an object and has some hidden complexity

Question 7

what are object values?

Answer 7

objects, arrays and functions

Question 8

In what ways can typeof be unreliable?

Answer 8

null returns "object"
function returns "function" but array returns "object"

Question 9

Coercion:

Answer 9

converting one value type to another

Question 10

what is the difference between let and var?

Answer 10

var has function scoping; let uses block scoping

Question 11

function declaration example

Answer 11

function myFunDeclaration() {
}

Question 12

function expression example

Answer 12

let myFunExpresion = function() {
}

Question 13

what does the === operator do?

Answer 13

disallows type coercion

Question 14

when does the === operator lie?

Answer 14

NaN and -0
ie:
-0 === 0 // true
NaN === NaN // false

Question 15

that is the difference in strict operand (===) equality checks for primitives and for objects?

Answer 15

for primitives, it uses structural equality — checking the value or content is the same; for objects, it uses identity equality —checking the reference is the same

Question 16

what should we start calling the == operator?

Answer 16

coercive equality

Question 17

what types does == prefer to compare via coercion?

Answer 17

primitive number types

Question 18

what are the relational operators in js?

Answer 18

> ,=, <=

Question 19

how do relational operators work

Answer 19

they use numeric comparisons except for when both values are strings, in which case they will use an alphabetical comparison

Question 20

var x = "10";
var y ="9";
x < y;

Answer 20

true
relational operators use numeric comparisons except for when both values are strings, in which case they will use an alphabetical comparison

Question 21

What are the two major ways of organizing js code?

Answer 21

classes and modules

Question 22

Class:

Answer 22

a definition of a type of custom data structure that defines how such a data structure works.

To get a concrete value that you can use, you must instantiate it with the new keyword

Question 23

How do you define a class?

Answer 23

class Animal {
    constructor (name, sound) {
         this.name = name;
         this.sound = sound;
    }

speak() {
   console.log(this.sound);
} }

class Zoo {
    constructor () {
         this.animals = [];
    }

    addAnimal(name, sound) {
       const animal = new Animal(name, sound);
       this.animals.push(animal);
    }

    greet() {
       this.animals.forEach((animal) => {
          animal.speak();
       });
    }
}

const greatCanadianZoo = new Zoo();
greatCanadianZoo.addAnimal(‘tiger’, ‘RAWR’);
greatCanadianZoo.greet();

Question 24

What does polymorphism in regards to classes mean?

Answer 24

that both inherited and overridden methods can have the same name and co-exist

Question 25

how can polymorphism exist in classes?

Answer 25

the super keyword allows us to access the inherited class methods

Question 26

what is inheritance a powerful tool for?

Answer 26

organizing data/behavior in separate logical units but allowing child classes to cooperate with the parent by accessing its behavior and data.

Question 27

Class inheritance example:

Answer 27

class Publication {
    constructor(title,author,pubDate) {
        this.title = title;
        this.author = author;
        this.pubDate = pubDate;
    }

    print() {
        console.log(`
            Title: ${ this.title }
            By: ${ this.author }
            ${ this.pubDate }
        `);
    }
}

class Book extends Publication {
    constructor(bookDetails) {
        super(
            bookDetails.title,
            bookDetails.author,
            bookDetails.publishedOn
        );
        this.publisher = bookDetails.publisher;
        this.ISBN = bookDetails.ISBN;
    }

    print() {
        super.print();
        console.log(`
            Publisher: ${ this.publisher }
            ISBN: ${ this.ISBN }
        `);
    }
}

class BlogPost extends Publication {
    constructor(title,author,pubDate,URL) {
        super(title,author,pubDate);
        this.URL = URL;
    }

    print() {
        super.print();
        console.log(this.URL);
    }
}

var YDKJS = new Book({
    title: "You Don't Know JS",
    author: "Kyle Simpson",
    publishedOn: "June 2014",
    publisher: "O'Reilly",
    ISBN: "123456-789"
});

YDKJS.print();
// Title: You Don't Know JS
// By: Kyle Simpson
// June 2014
// Publisher: O'Reilly
// ISBN: 123456-789

var forAgainstLet = new BlogPost(
    "For and against let",
    "Kyle Simpson",
    "October 27, 2014",
    "https://davidwalsh.name/for-and-against-let"
);

forAgainstLet.print();
// Title: For and against let
// By: Kyle Simpson
// October 27, 2014
// https://davidwalsh.name/for-and-against-let

Question 28

classic module (pre es6)

Answer 28

an outer function (that is run at least once) and returns an instance or the module with one or more functions exposed that can run on the module instance’s internal/hidden data

Question 29

classic module example

Answer 29

function Publication(title,author,pubDate) {
    var publicAPI = {
        print() {
            console.log(`
                Title: ${ title }
                By: ${ author }
                ${ pubDate }
            `);
        }
    };

return publicAPI; }

function Book(bookDetails) {
    var pub = Publication(
        bookDetails.title,
        bookDetails.author,
        bookDetails.publishedOn
    );

    var publicAPI = {
        print() {
            pub.print();
            console.log(`
                Publisher: ${ bookDetails.publisher }
                ISBN: ${ bookDetails.ISBN }
            `);
        }
    };

return publicAPI; }

function BlogPost(title,author,pubDate,URL) {
    var pub = Publication(title,author,pubDate);

    var publicAPI = {
        print() {
            pub.print();
            console.log(URL);
        }
    };

return publicAPI; }

Question 30

differences between class and classic modules

Answer 30

• no need for new keyword when using it
• classic modules can keep data private by not exposing it via the returned data where as using a class all data and methods are public
• classic modules have all data on scoped variable and class has data on instances accessed using the ‘this’ keyword

Question 31

ESM

Answer 31

ES Modules

Question 32

ES Modules and classic module differences

Answer 32

• ES Modules have no function wrapper —the page is the wrapper
• you don’t “instantiate” an ES module, you just import it to use its single instance
• you don’t interact with a module’s “API” explicitly, but rather use the export keyword to add a variable or method to its public API definition

Question 33

what does it mean that ESM’s are singletons?

Answer 33

there is only once instance created in a program, all other imports after the original get a reference to the original.

Question 34

If you need multiple-instantiation what type of organization would be best? why/why not?

Answer 34

use classic modules (or classes)

not ES Modules as there will only ever be one instance

Question 35

mixed ESM and classic module and why would we do this?

Answer 35

We need the mix of ESM and classic modules because we need to use multiple-instantiation which ESM cannot do

—–publication.js:

function printDetails(title,author,pubDate) {
    console.log(`
        Title: ${ title }
        By: ${ author }
        ${ pubDate }
    `);
}

export function create(title,author,pubDate) {
    var publicAPI = {
        print() {
            printDetails(title,author,pubDate);
        }
    };

return publicAPI; }

——-blogpost.js:

import { create as createPub } from “publication.js”;

function printDetails(pub,URL) {
    pub.print();
    console.log(URL);
}

export function create(title,author,pubDate,URL) {
    var pub = createPub(title,author,pubDate);

    var publicAPI = {
        print() {
            printDetails(pub,URL);
        }
    };

return publicAPI; }

——main.js:

import { create as newBlogPost } from “blogpost.js”;

var forAgainstLet = newBlogPost(
    "For and against let",
    "Kyle Simpson",
    "October 27, 2014",
    "https://davidwalsh.name/for-and-against-let"
);

forAgainstLet.print();
// Title: For and against let
// By: Kyle Simpson
// October 27, 2014
// https://davidwalsh.name/for-and-against-let