Skip to content

Instantly share code, notes, and snippets.

@jim-clark
Last active January 30, 2020 19:38
Show Gist options
  • Select an option

  • Save jim-clark/5d66a759b3842b4a06659d1d73da25b6 to your computer and use it in GitHub Desktop.

Select an option

Save jim-clark/5d66a759b3842b4a06659d1d73da25b6 to your computer and use it in GitHub Desktop.

Revisions

  1. jim-clark revised this gist Jan 30, 2020. 1 changed file with 9 additions and 9 deletions.
    18 changes: 9 additions & 9 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -78,7 +78,7 @@
    <br><br>

    ```js
    var cohort = {
    const cohort = {
    id: 'SEI',
    students: ['Mary', 'Toni', 'Fred'],
    instructors: ['Susan', 'Phil'],
    @@ -87,7 +87,7 @@ var cohort = {
    this.students.push(name);
    },
    pickRandomStudent: function() {
    var rndIdx = Math.floor(Math.random() * this.students.length);
    let rndIdx = Math.floor(Math.random() * this.students.length);
    return this.students[rndIdx];
    }
    };
    @@ -133,7 +133,7 @@ var cohort = {
    - In JS, we create objects using the `new` keyword when invoking (instantiating) the class:

    ```js
    var v1 = new Vehicle();
    let v1 = new Vehicle();
    ```
    Let's use _repl.it_ to try out the minimal `Vehicle` class

    @@ -153,7 +153,7 @@ var cohort = {
    }
    }

    var plane = new Vehicle('X123Y', 'Boeing');
    let plane = new Vehicle('X123Y', 'Boeing');
    ```

    ---
    @@ -174,7 +174,7 @@ var cohort = {
    - Test it out by instantiating another object like this:

    ```js
    var car = new Vehicle('A1234', 'Toyota', 'Camry');
    let car = new Vehicle('A1234', 'Toyota', 'Camry');
    ```

    ---
    @@ -273,7 +273,7 @@ var cohort = {

    - Before classes arrived via ES2015, we used _constructor functions_ to do the exact same thing as classes.

    - Because of the newness of ES2015, most of the code out there is written using constructor functions, however, most new code today is likely to be written as classes.
    - Because of the newness of ES2015, much of the code out there is written using constructor functions, however, most new code today is likely to be written as classes.

    - It's important that you be able to recognize _constructor functions_, so let's look at how the `Vehicle` class can be written as a constructor function...

    @@ -293,7 +293,7 @@ Vehicle.prototype.start = function() {
    };
    // other 'prototype' (instance) methods defined like above

    var car = new Vehicle('A1234', 'Toyota', 'Camry');
    let car = new Vehicle('A1234', 'Toyota', 'Camry');
    ```

    - Note that constructor functions are similar to the constructor methods in a class. Also note how instance methods are defined on the function's prototype object.
    @@ -393,7 +393,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    - Now we can create instances of `Plane` like this:

    ```js
    var spyPlane = new Plane('secret', 'Lockheed', 'SR-71', 'USA');
    let spyPlane = new Plane('secret', 'Lockheed', 'SR-71', 'USA');
    ```

    - Note how the additional arguments used to initialize subclasses are always provided after those intended for the superclass(es).
    @@ -414,7 +414,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    - Test it out by instantiating it like this:

    ```js
    var fastCar = new Automobile('TS123Z', 'Tesla', 'P100D', 4);
    let fastCar = new Automobile('TS123Z', 'Tesla', 'P100D', 4);
    ```

    - Hint: It's okay to copy and paste your own code (but make sure you understand what it does)
  2. jim-clark revised this gist Jul 30, 2019. 1 changed file with 1 addition and 3 deletions.
    4 changes: 1 addition & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -260,10 +260,8 @@ var cohort = {

    ---
    ### Review Questions
    <br>

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>Some questions before moving on:

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>Some questions before moving on:<br><br>
    1. **What is the JS keyword used to define a class?**
    2. **What is the name of the method in a class that is automatically called when we instantiate a class?**
    3. **What is the main purpose of this method?**
  3. jim-clark revised this gist Jul 30, 2019. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -263,6 +263,7 @@ var cohort = {
    <br>

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>Some questions before moving on:

    1. **What is the JS keyword used to define a class?**
    2. **What is the name of the method in a class that is automatically called when we instantiate a class?**
    3. **What is the main purpose of this method?**
  4. jim-clark revised this gist Jul 30, 2019. 1 changed file with 6 additions and 8 deletions.
    14 changes: 6 additions & 8 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -179,7 +179,6 @@ var cohort = {

    ---
    ### Object Instantiation
    <br>

    - When we invoke the class prefaced with the `new` keyword, behind the scenes:
    - JS creates a shiny new object (empty) and assigns it to the `this` keyword.
    @@ -202,7 +201,6 @@ var cohort = {

    ---
    ### Defining Methods in a Class
    <br>

    - Let's add a `start` method to our `Vehicle` class:

    @@ -236,7 +234,7 @@ var cohort = {

    - Thanks to another OOP principle called _inheritance_, **subclasses** inherit methods from their parent classes.

    - JS is different from class-based languages like Java or Python in that it's inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [check out the docs here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).
    - JS is different from class-based languages like Java or Python in that its inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [check out the docs here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).

    - In JS, virtually every object inherits from the `Object` class and thus inherits it's methods, such as `toString`:

    @@ -264,11 +262,11 @@ var cohort = {
    ### Review Questions
    <br>

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>A few questions before moving on:
    - **What is the JS keyword used to define a class?**
    - **What is the name of the method in a class that is automatically called when we instantiate a class?**
    - **What is the main purpose of this method?**
    - **What character(s) separate the methods in a class definition?**
    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>Some questions before moving on:
    1. **What is the JS keyword used to define a class?**
    2. **What is the name of the method in a class that is automatically called when we instantiate a class?**
    3. **What is the main purpose of this method?**
    4. **What character(s) separate the methods in a class definition?**

    ---
    ### Constructor Functions - B.C. (before classes 😀)
  5. jim-clark revised this gist Jul 30, 2019. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -141,7 +141,7 @@ var cohort = {
    ### The _<span style="text-transform:lowercase">constructor</span>_ Method
    <br>

    - When a class is being instantiated, the special `constructor` method in the class will automatically be called:
    - When a class is being instantiated, the special `constructor` method in the class will **automatically** be called:

    ```js
    class Vehicle {
    @@ -181,8 +181,8 @@ var cohort = {
    ### Object Instantiation
    <br>

    - When we invoke the class prefaced with the `new` keyword:
    - Behind the scenes, JS creates a shiny new object (empty) and assigns it to the `this` keyword.
    - When we invoke the class prefaced with the `new` keyword, behind the scenes:
    - JS creates a shiny new object (empty) and assigns it to the `this` keyword.
    - The `constructor` method is called with the arguments we provided when invoking the class. Remember, the `constructor` method is where we create/initialize properties on the new object assigned to `this`.
    - After the `constructor` is finished executing, the class automatically returns the shiny new object.

  6. jim-clark revised this gist Jul 30, 2019. 1 changed file with 3 additions and 13 deletions.
    16 changes: 3 additions & 13 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -139,6 +139,7 @@ var cohort = {

    ---
    ### The _<span style="text-transform:lowercase">constructor</span>_ Method
    <br>

    - When a class is being instantiated, the special `constructor` method in the class will automatically be called:

    @@ -155,25 +156,14 @@ var cohort = {
    var plane = new Vehicle('X123Y', 'Boeing');
    ```

    - **The purpose** of the `constructor` method is to initialize the data properties of the new object being created (represented by `this`).

    ---
    ### The _<span style="text-transform:lowercase">constructor</span>_ Method
    <br>

    - If you don't have any properties to initialize, the `constructor` method is optional (a hidden default constructor is called).
    - **The purpose** of the `constructor` method is to initialize the data properties of the new object being created (represented by `this`).

    - For example, classes can be used to simply expose static methods (discussed in a bit):
    - If there are no properties to initialize, the `constructor` method is optional (a hidden default constructor is called).

    ```js
    class Math {
    static abs(n) {
    return n < 0 ? n * -1 : n;
    }
    }

    Math.abs(-123); // returns 123
    ```

    ---
    ### Practice - Add a Property
  7. jim-clark revised this gist Jul 30, 2019. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -147,7 +147,8 @@ var cohort = {
    constructor(vin, make) {
    this.vin = vin;
    this.make = make;
    // return is not needed - the new object is returned by default
    // return is not needed
    // because the new object is returned by default
    }
    }

  8. jim-clark revised this gist Jul 30, 2019. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -37,7 +37,7 @@

    ---
    ### What Are <em>Classes</em>?
    <br>lockheed
    <br>

    <img src="https://i.imgur.com/Pjxlpjs.jpg" width="600">

  9. jim-clark revised this gist Apr 30, 2019. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -166,9 +166,9 @@ var cohort = {

    ```js
    class Math {
    static abs(n) {
    return n < 0 ? n * -1 : n;
    }
    static abs(n) {
    return n < 0 ? n * -1 : n;
    }
    }

    Math.abs(-123); // returns 123
  10. jim-clark revised this gist Apr 24, 2019. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -79,7 +79,7 @@

    ```js
    var cohort = {
    id: 'WDI',
    id: 'SEI',
    students: ['Mary', 'Toni', 'Fred'],
    instructors: ['Susan', 'Phil'],
    addStudent: function(name) {
  11. jim-clark revised this gist Jan 29, 2019. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -37,7 +37,7 @@

    ---
    ### What Are <em>Classes</em>?
    <br>
    <br>lockheed

    <img src="https://i.imgur.com/Pjxlpjs.jpg" width="600">

    @@ -405,7 +405,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    - Now we can create instances of `Plane` like this:

    ```js
    var spyPlane = new Plane('secret', 'Lockhead', 'SR-71', 'USA');
    var spyPlane = new Plane('secret', 'Lockheed', 'SR-71', 'USA');
    ```

    - Note how the additional arguments used to initialize subclasses are always provided after those intended for the superclass(es).
  12. jim-clark revised this gist Dec 11, 2018. No changes.
  13. jim-clark revised this gist Dec 11, 2018. 1 changed file with 4 additions and 6 deletions.
    10 changes: 4 additions & 6 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -408,7 +408,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    var spyPlane = new Plane('secret', 'Lockhead', 'SR-71', 'USA');
    ```

    - Note how the additional arguments used to initialize derived classes are always provided after those intended for the superclass(es).
    - Note how the additional arguments used to initialize subclasses are always provided after those intended for the superclass(es).

    ---
    ### Inheritance
    @@ -429,17 +429,15 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    var fastCar = new Automobile('TS123Z', 'Tesla', 'P100D', 4);
    ```

    - Hint: It's okay to copy and paste your own code :)
    - Hint: It's okay to copy and paste your own code (but make sure you understand what it does)

    ---
    ### Final Notes on Classes
    <br>

    - Classes can also be defined as _class expressions_.
    1. Unlike function declarations, class declarations are not _hoisted_ - they must be declared before using them to create objects.

    - Unlike function declarations, class declarations are not _hoisted_ - they must be declared before using them to create objects.

    - It's possible to subclass JS's built-in "classes"! For example:
    2. It's possible to subclass JS's built-in "classes"! For example:

    ```js
    class Stack extends Array {
  14. jim-clark revised this gist Dec 11, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -358,8 +358,8 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    this.x = x;
    this.y = y;
    }
    static about() {
    console.log('Position is: ' + this.x + ', ' + this.y);
    static getPosition() {
    return [this.x, this.y];
    }
    }
    ```
  15. jim-clark revised this gist Dec 11, 2018. 1 changed file with 8 additions and 8 deletions.
    16 changes: 8 additions & 8 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -61,7 +61,7 @@

    - **Encapsulation** is a key principle of Object Oriented Programming.

    - Encapsulation is the concept of bundling data (properties) and related behavior (methods) within an object.
    - Encapsulation is the concept of bundling data (properties/attributes) and related behavior (methods) within an object.

    - Here comes a graphic depicting this principle...

    @@ -190,9 +190,9 @@ var cohort = {
    ### Object Instantiation
    <br>

    - When we invoke the class prefaced with `new`:
    - When we invoke the class prefaced with the `new` keyword:
    - Behind the scenes, JS creates a shiny new object (empty) and assigns it to the `this` keyword.
    - The `constructor` method is called with the arguments we provided when invoking the class. Remember, `constructor` method is where we create/initialize properties on the new object (`this`).
    - The `constructor` method is called with the arguments we provided when invoking the class. Remember, the `constructor` method is where we create/initialize properties on the new object assigned to `this`.
    - After the `constructor` is finished executing, the class automatically returns the shiny new object.

    - Although the `constructor` method is _special_ because it's called automatically, there's nothing special about how it's defined, other methods are defined the same way...
    @@ -243,9 +243,9 @@ var cohort = {
    ### Overriding Methods
    <br>

    - Thanks to another OOP principle called _inheritance_, we inherit methods from parent classes.
    - Thanks to another OOP principle called _inheritance_, **subclasses** inherit methods from their parent classes.

    - JS is different from class-based languages like Java or Python in that it's inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [here's a good place to start](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).
    - JS is different from class-based languages like Java or Python in that it's inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [check out the docs here](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).

    - In JS, virtually every object inherits from the `Object` class and thus inherits it's methods, such as `toString`:

    @@ -267,7 +267,7 @@ var cohort = {
    this.make + ' model ' + this.model;
    }
    ```
    and test it out.
    Test it out.

    ---
    ### Review Questions
    @@ -287,7 +287,7 @@ var cohort = {

    - Because of the newness of ES2015, most of the code out there is written using constructor functions, however, most new code today is likely to be written as classes.

    - It's important that be able to recognize _constructor functions_, so let's look at how the `Vehicle` class can be written as a constructor function...
    - It's important that you be able to recognize _constructor functions_, so let's look at how the `Vehicle` class can be written as a constructor function...

    ---
    ### Constructor Functions
    @@ -308,7 +308,7 @@ Vehicle.prototype.start = function() {
    var car = new Vehicle('A1234', 'Toyota', 'Camry');
    ```

    - Note that constructor functions are similar to the constructor methods in a class. Also note how methods are defined on the function's prototype object.
    - Note that constructor functions are similar to the constructor methods in a class. Also note how instance methods are defined on the function's prototype object.

    - Invoking a class and a constructor function works identically.

  16. jim-clark revised this gist Dec 10, 2018. 1 changed file with 3 additions and 1 deletion.
    4 changes: 3 additions & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -49,7 +49,9 @@

    - So why do we need classes and/or constructor functions?

    - Because... The number of a certain type of object needed by an application often varies at runtime; and classes/constructors provide a convenient way to dynamically create objects as needed.
    - Because the number of a certain type of object needed by an application often varies at runtime; and...

    - Classes/constructors provide a convenient way to dynamically create objects as needed.

    ---
    ## Encapsulation in OOP
  17. jim-clark revised this gist Dec 10, 2018. 1 changed file with 5 additions and 3 deletions.
    8 changes: 5 additions & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -33,7 +33,7 @@

    - **Classes** (as well as their predecessor, **constructor functions**) are used to create objects.

    - Think of classes as little factories that manufacture objects...
    - Think of classes as the blueprints used to create objects of a certain "type"...

    ---
    ### What Are <em>Classes</em>?
    @@ -45,9 +45,11 @@
    ### Why Use <em>Classes</em>?
    <br>

    - We've already been creating objects using object ___________s, so why do we need classes and/or constructor functions?
    - We've already been creating JS objects using object ___________ notation.

    - Because the number of a certain type of object needed by an application often varies; and classes/constructors provide a convenient way to dynamically create objects as needed.<br>**Can you think of any applications where the number of objects could vary?**
    - So why do we need classes and/or constructor functions?

    - Because... The number of a certain type of object needed by an application often varies at runtime; and classes/constructors provide a convenient way to dynamically create objects as needed.

    ---
    ## Encapsulation in OOP
  18. jim-clark revised this gist Sep 18, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -122,11 +122,11 @@ var cohort = {

    - **instance**: An object created by a class

    - **instantiate**: To create an object using a class
    - **instantiate**: We instantiate a class to create an object

    - **instantiation**: The process of creating an object

    - In JS, we **instantiate** (create) objects using the `new` keyword when invoking the class:
    - In JS, we create objects using the `new` keyword when invoking (instantiating) the class:

    ```js
    var v1 = new Vehicle();
  19. jim-clark revised this gist Sep 15, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -404,7 +404,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    var spyPlane = new Plane('secret', 'Lockhead', 'SR-71', 'USA');
    ```

    - Note how the additional arguments used to initialize derived classes are always provided after those intended for the superclass.
    - Note how the additional arguments used to initialize derived classes are always provided after those intended for the superclass(es).

    ---
    ### Inheritance
  20. jim-clark revised this gist Sep 15, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -393,7 +393,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    }
    ```

    - In a derived class, the `super` keyword represents the parent class and must be called before the `this` keyword can be used in the constructor.
    - In a derived class, the `super` keyword represents the parent superclass and must be called before the `this` keyword can be used in the constructor.

    ---
    ### Inheritance
    @@ -404,7 +404,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    var spyPlane = new Plane('secret', 'Lockhead', 'SR-71', 'USA');
    ```

    - Note how the additional arguments used to initialize derived classes are always provided after the parent class'.
    - Note how the additional arguments used to initialize derived classes are always provided after those intended for the superclass.

    ---
    ### Inheritance
  21. jim-clark revised this gist Sep 15, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -374,7 +374,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');
    ### Inheritance
    <br>

    <img src="https://i.imgur.com/MvXw4nD.gif" width="600">
    <img src="https://i.imgur.com/MvXw4nD.gif" width="800">

    ---
    ### Inheritance
  22. jim-clark revised this gist Sep 15, 2018. 1 changed file with 9 additions and 3 deletions.
    12 changes: 9 additions & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -344,7 +344,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');

    - **Is there anything a class can implement that can't be done using constructor functions?**

    - **When using constructor functions, what object are the instance methods defined on?**
    - **When using constructor functions, how are instance methods defined?**

    - **What's wrong with the following code?**

    @@ -366,9 +366,15 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');

    - Earlier we spoke briefly about _inheritance_.

    - In OOP, inheritance is when a "specialized" class is derived from another (parent) class, and thus inherits it's properties and methods.
    - In OOP, inheritance is when a "specialized" **subclass** is derived from a parent **superclass**, and thus inherits it's properties and methods.

    - For example, a `Payment` _base_ class could have `CreditCard` & `Cash` subclasses derived from it.
    - For example, a `Payment` class could have `CreditCard` & `Cash` subclasses derived from it.

    ---
    ### Inheritance
    <br>

    <img src="https://i.imgur.com/MvXw4nD.gif" width="600">

    ---
    ### Inheritance
  23. jim-clark revised this gist Sep 15, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -324,7 +324,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');

    ```js
    static about() {
    alert("I'm a Vehicle class!");
    alert("I'm the Vehicle class!");
    }
    ```
    Yup, the only difference is the `static` keyword
    @@ -344,7 +344,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');

    - **Is there anything a class can implement that can't be done using constructor functions?**

    - **When using constructor functions, where are the methods defined?**
    - **When using constructor functions, what object are the instance methods defined on?**

    - **What's wrong with the following code?**

  24. jim-clark revised this gist Sep 15, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -314,7 +314,7 @@ var car = new Vehicle('A1234', 'Toyota', 'Camry');

    - Again, _static methods_ are methods that are callable on the class itself - not on its instances.

    - Think of them as methods that would not pertain to a particular instance. For example, we could design the `Vehicle` class so that it tracks every vehicle it creates. We could then write static methods that return how many vehicles have been created, search for vehicles by their make, etc.
    - Static methods are used typically to implement behavior that does not pertain to a particular instance. For example, we could design the `Vehicle` class so that it tracks every vehicle it creates. We could then write static methods that return how many vehicles have been created, search for vehicles by their make, etc.

    ---
    ### Static Methods
  25. jim-clark revised this gist Sep 15, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -304,7 +304,7 @@ Vehicle.prototype.start = function() {
    var car = new Vehicle('A1234', 'Toyota', 'Camry');
    ```

    - Note that constructor functions are pretty much the same as constructor methods in a class and that methods are defined on the function's prototype object.
    - Note that constructor functions are similar to the constructor methods in a class. Also note how methods are defined on the function's prototype object.

    - Invoking a class and a constructor function works identically.

  26. jim-clark revised this gist Sep 15, 2018. 1 changed file with 3 additions and 3 deletions.
    6 changes: 3 additions & 3 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -271,19 +271,19 @@ var cohort = {

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>A few questions before moving on:
    - **What is the JS keyword used to define a class?**
    - **What is the name of the method in a class that is automatically called when we instantiate the class?**
    - **What is the name of the method in a class that is automatically called when we instantiate a class?**
    - **What is the main purpose of this method?**
    - **What character(s) separate the methods in a class definition?**

    ---
    ### Constructor Functions - B.C. (before classes 😀)
    <br>

    - Before classes brought to us by ES2015 we used _constructor functions_ to do the exact same thing as classes.
    - Before classes arrived via ES2015, we used _constructor functions_ to do the exact same thing as classes.

    - Because of the newness of ES2015, most of the code out there is written using constructor functions, however, most new code today is likely to be written as classes.

    - You need to be able to recognize _constructor functions_, so let's look at how the `Vehicle` class can be written as a constructor function...
    - It's important that be able to recognize _constructor functions_, so let's look at how the `Vehicle` class can be written as a constructor function...

    ---
    ### Constructor Functions
  27. jim-clark revised this gist Sep 15, 2018. 1 changed file with 4 additions and 4 deletions.
    8 changes: 4 additions & 4 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -183,7 +183,7 @@ var cohort = {
    ```

    ---
    ### Class Instantiation
    ### Object Instantiation
    <br>

    - When we invoke the class prefaced with `new`:
    @@ -241,7 +241,7 @@ var cohort = {

    - Thanks to another OOP principle called _inheritance_, we inherit methods from parent classes.

    - JS is different from class-based languages like Ruby or Java in that it's inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [here's a good place to start](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).
    - JS is different from class-based languages like Java or Python in that it's inheritance implementation is _prototype-based_. We won't go into prototypes during this lesson, but if you want to learn more, [here's a good place to start](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain).

    - In JS, virtually every object inherits from the `Object` class and thus inherits it's methods, such as `toString`:

    @@ -270,8 +270,8 @@ var cohort = {
    <br>

    - You've just learned how to define a class and add prototype methods to it. This represents about 80% there is to know about classes - congrats!<br><br>A few questions before moving on:
    - **What is the keyword used to define a class?**
    - **What is the name of the method that is automatically called when we call the class prefaced the `new` keyword?**
    - **What is the JS keyword used to define a class?**
    - **What is the name of the method in a class that is automatically called when we instantiate the class?**
    - **What is the main purpose of this method?**
    - **What character(s) separate the methods in a class definition?**

  28. jim-clark revised this gist Sep 14, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -102,12 +102,11 @@ var cohort = {
    ### Defining Classes in JS
    <br>

    - Here's a minimal class definition that does nothing but create empty objects:
    - Here's a minimal class definition that's good for nothing but creating empty objects:

    ```js
    class Vehicle {
    // Code to define the class's properties and methods
    // return is not needed - the new object is returned by default
    }
    ```

    @@ -144,6 +143,7 @@ var cohort = {
    constructor(vin, make) {
    this.vin = vin;
    this.make = make;
    // return is not needed - the new object is returned by default
    }
    }

  29. jim-clark revised this gist Sep 14, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion js-classes.md
    Original file line number Diff line number Diff line change
    @@ -70,7 +70,8 @@
    ---
    ### Encapsulation in OOP

    - Here's a code example of encapsulating data (attributes/properties) & behavior (methods):<br>
    - Here's a code example of encapsulating data (attributes/properties) & behavior (methods):
    <br><br>

    ```js
    var cohort = {
  30. jim-clark revised this gist Sep 14, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions js-classes.md
    Original file line number Diff line number Diff line change
    @@ -59,7 +59,7 @@

    - Encapsulation is the concept of bundling data (properties) and related behavior (methods) within an object.

    - Here comes a graphic depicting this...
    - Here comes a graphic depicting this principle...

    ---
    ### Encapsulation in OOP
    @@ -70,7 +70,7 @@
    ---
    ### Encapsulation in OOP

    - Here's a code example of encapsulating data (attributes/properties) & behavior (methods):
    - Here's a code example of encapsulating data (attributes/properties) & behavior (methods):<br>

    ```js
    var cohort = {