Chapter 2 Flashcards

(35 cards)

1
Q

What are examples of ES6 module-loading?

A

import and `script type=”module”

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

Module:

A

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

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

Delimit:

A

surround, separate, define

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

what are the two forms of values in JS?

A

primitives and objects

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

what are the primitive value types in JS?

A

strings, numbers, symbols, booleans, null, undefined

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

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

A

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

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

what are object values?

A

objects, arrays and functions

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

In what ways can typeof be unreliable?

A
null returns "object"
function returns "function" but array returns "object"
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Coercion:

A

converting one value type to another

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

what is the difference between let and var?

A

var has function scoping; let uses block scoping

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

function declaration example

A
function myFunDeclaration() {
}
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

function expression example

A
let myFunExpresion = function() {
}
How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

what does the === operator do?

A

disallows type coercion

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

when does the === operator lie?

A

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

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

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

A

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

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

what should we start calling the == operator?

A

coercive equality

17
Q

what types does == prefer to compare via coercion?

A

primitive number types

18
Q

what are the relational operators in js?

19
Q

how do relational operators work

A

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

20
Q
var x = "10";
var y ="9";
x < y;
A

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

21
Q

What are the two major ways of organizing js code?

A

classes and modules

22
Q

Class:

A

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

23
Q

How do you define a class?

A
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();

24
Q

What does polymorphism in regards to classes mean?

A

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

25
how can polymorphism exist in classes?
the super keyword allows us to access the inherited class methods
26
what is inheritance a powerful tool for?
organizing data/behavior in separate logical units but allowing child classes to cooperate with the parent by accessing its behavior and data.
27
Class inheritance example:
``` 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 ```
28
classic module (pre es6)
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
29
classic module example
``` 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; }
30
differences between class and classic modules
- 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
31
ESM
ES Modules
32
ES Modules and classic module differences
- 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
33
what does it mean that ESM's are singletons?
there is only once instance created in a program, all other imports after the original get a reference to the original.
34
If you need multiple-instantiation what type of organization would be best? why/why not?
use classic modules (or classes) not ES Modules as there will only ever be one instance
35
mixed ESM and classic module and why would we do this?
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 ```