Class Basics
- Important notes on
- It is common to capitalize the first letter of the class name to make clear it is a
class and not afunction - A
constructor(value, value)function is used to initialize and asign properties to theclass
class MyClassName() { constructor()}
↓ Examples ↓
class Passenger {
constructor(firstName, lastName, frequentFlyerNumber) {
this.firstName = firstName;
this.lastName = lastName;
this.frequentFlyerNumber = frequentFlyerNumber;
}
}
let passenger = new Passenger('Tiana', 'Simian', 1234);
console.log(passenger); // RESULT: Passenger4 {firstName: "Tiana", lastName: "Simian", frequentFlyerNumber: 1234}
let passenger2 = new Passenger('John', 'Daily', 5678);
console.log(passenger); // RESULT: Passenger4 {firstName: "John", lastName: "Daily", frequentFlyerNumber: 5678}
Class Iheritance
- Two important focuses when creating
- Reusability - Don't Repeat Yourself (D.R.Y)
- IS-A - "Is this a that?", this is the basic thinking through of the relationship between parent and child Objects. If two Objects are different versions of one thing, there will likely be common properties and functions. These can be held in a parent
class . If parents are different versions of something, a parentclass for them can house common items. With this, it is important to be sure the property or function is actually used by another before assuming. Just because two items are similar does not automatically mean the common items will get used by both.
NOTE: When super() must be used to invoke the parent
↓ Example ↓
class BMW {
constructor(make, model, year) {
this.make = make;
this.model = model;
this.year = year;
}
// Functions can be made available to all child Objects
start() {
console.log('Start Engine');
}
stop() {
console.log('Stop Engine');
}
}
class ThreeSeries extends BMW {
// Adding one parameter that does not exist on the parent
constructor(make, model, year, cruiseControlEnable) {
// This is needed to invoke the parent class' constructor
super(make, model, year);
this.cruiseControlEnable = cruiseControlEnable;
}
}
class FiveSeries extends BMW {
// Adding one parameter that does not exist on the parent
constructor(make, model, year, parkingAssistEnabled) {
// This is needed to invoke the parent class' constructor
super(make, model, year);
this.parkingAssistEnabled = parkingAssistEnabled;
}
// Override a parent function
start() {
console.log('Remote Start');
}
}
// Create both ThreeSeries and a FiveSeries object
let threeSeries = new ThreeSeries('BMW', '328', 2018, true);
let fiveSeries = new FiveSeries('BMW', '535', 2018, true);
// Display full
console.log(threeSeries); // RESULT: ThreeSeries {make: "BMW", model: "328", year: 2018, cruiseControlEnable: true}
console.log(fiveSeries); // RESULT: FiveSeries {make: "BMW", model: "535", year: 2018, parkingAssistEnabled: true}
// Display individual properties
console.log(threeSeries.make);
// RESULT: "BMW"
console.log(threeSeries.model);
// RESULT: "328"
console.log(threeSeries.year);
// RESULT: 2018
console.log(threeSeries.cruiseControlEnable);
// RESULT: true
// Display individual properties
console.log(fiveSeries.make);
// RESULT: "BMW"
console.log(fiveSeries.model);
// RESULT: "535"
console.log(fiveSeries.year);
// RESULT: 2018
console.log(fiveSeries.parkingAssistEnabled);
// RESULT: true
// Invoke parent functions
threeSeries.start();
// RESULT: "Start Engine"
threeSeries.stop();
// RESULT: "Stop Engine"
fiveSeries.start();
// RESULT (different because class overwrote parent): "Remote Start"
fiveSeries.stop();
// RESULT: "Stop Engine"
One Reply to “Classes in JavaScript”