Matthew Bodily
Lecture Slides for DevMountain's Web Development Course
Classes can be seen as syntactical sugar for constructor functions. Classes are a newer way to create blueprints for creating objects.
class Car {
}
const myCar = new Car();
To create a class, we use the 'class' keyword, and give the class a name(with a capital first letter). To create new objects based on the class, use the 'new' keyword.
To build an object blueprint, like you would with a constructor function, use the 'constructor' keyword. The constructor function sits inside of the class.
class Car {
constructor(make, model, year){
this.make = make;
this.model = model;
this.year = year;
}
}
const myCar = new Car('Tesla', 'Model X', 2020);
Parameters
Passing in Arguments
Object structure
Prototype methods can be added directly into the class. To create a prototype method, place it underneath the constructor function.
class Car {
constructor(make, model, year){
this.make = make;
this.model = model;
this.year = year;
}
honk(){
alert(`Your ${this.make} honked!`);
}
}
Prototype methods in classes don't use the function keyword. They are also not rewritten onto each new object, but each new object inherits them.
Classes are able to 'extend' from other classes, to inherit their properties and methods. To do this, use the extends keyword.
class Animal {
constructor(name, type){
this.name = name;
this.type = type;
}
talk(saying){
console.log(`${this.name} says: ${saying}`)
}
}
class Fish extends Animal {
};
Extends from the Animal Class
When extending from another class, the 'keyword' can be used to invoke the parent classes constructor function.
class Animal {
constructor(name, type){
this.name = name;
this.type = type;
}
talk(saying){
console.log(`${this.name} says: ${saying}`)
}
}
class Fish extends Animal {
constructor(name){
super(name, 'Fish');
}
};
A closure function is an inner function that has been returned from an outer function but relies on the outer functions scope.
You right now -->
Let's see an example
function counter(){
let count = 0;
function addOne(){
return count += 1;
};
return addOne;
};
Closure Function
Relies on lexically scoped variable
Lexically scoped variable
Returning the function
function counter(){
let count = 0;
function addOne(){
return count += 1;
};
return addOne;
};
const countOne = counter();
To use the closure function, save the outer function, invoked, to a new variable. This will return the value returned from 'addOne' to the variable.
Note that you can create as many variables based off of this function as you need!
function modulePattern() {
let privateVariable = 'I am private';
let privateFunction = function() {
console.log(privateVariable)
}
return {
changeVar: function(str) {
privateVariable = str;
},
readVar: function() {
privateFunction();
}
}
}
The module pattern refers to creating 'private' variables and functions, and then returning functions that are able to access those private values.
By Matthew Bodily