generated from nighthawkcoders/teacher_portfolio
-
Notifications
You must be signed in to change notification settings - Fork 108
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #561 from Parallaxes/main
Finished JS Classes & Methods Lesson
- Loading branch information
Showing
4 changed files
with
538 additions
and
22 deletions.
There are no files selected for viewing
20 changes: 14 additions & 6 deletions
20
_notebooks/CSSE/Lessons/Classes_and_Methods/2024-10-27-classes-intro.ipynb
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
186 changes: 186 additions & 0 deletions
186
_notebooks/CSSE/Lessons/Classes_and_Methods/2024-11-04-classes-hw.ipynb
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,186 @@ | ||
{ | ||
"cells": [ | ||
{ | ||
"cell_type": "code", | ||
"execution_count": null, | ||
"metadata": { | ||
"vscode": { | ||
"languageId": "yaml" | ||
} | ||
}, | ||
"outputs": [], | ||
"source": [ | ||
"---\n", | ||
"comments: true\n", | ||
"layout: post\n", | ||
"title: JavaScript Classes & Methods Homework\n", | ||
"description: The JavaScript Classes & Methods Homework assignment for the JavaScript Fundamentals course.\n", | ||
"author: Lucas Masterson\n", | ||
"permalink: /csse/javascript/fundamentals/classes/hw/\n", | ||
"categories: [JavaScript Fundamentals]\n", | ||
"---" | ||
] | ||
}, | ||
{ | ||
"cell_type": "markdown", | ||
"metadata": {}, | ||
"source": [ | ||
"# Classes & Methods Homework\n", | ||
"****" | ||
] | ||
}, | ||
{ | ||
"cell_type": "markdown", | ||
"metadata": {}, | ||
"source": [ | ||
"## Homework!\n", | ||
"\n", | ||
"As you read through this, notice the new content introduced. We encourage you to do your own research (this can be Google, ChatGPT, documentation, etc.). Here, we introduce the `_` property (memory safety), `extends` keyword, and `super()` method.\n", | ||
"\n", | ||
"To complete the homework, implement the `TODO:` comments. The example usage should guide you and work if all implementation is done correctly. Have fun! \n", | ||
"\n", | ||
"*If anything simply cannot go wrong, it will anyway.*" | ||
] | ||
}, | ||
{ | ||
"cell_type": "code", | ||
"execution_count": null, | ||
"metadata": { | ||
"vscode": { | ||
"languageId": "javascript" | ||
} | ||
}, | ||
"outputs": [ | ||
{ | ||
"data": { | ||
"application/javascript": "\nclass Aircraft {\n constructor(model, capacity, range) {\n this._model = model;\n this._capacity = capacity;\n this._range = range;\n }\n\n // Getter for model\n get model() {\n return this._model;\n }\n\n // Setter for model\n set model(newModel) {\n this._model = newModel;\n }\n\n // Getter for capacity\n get capacity() {\n return this._capacity;\n }\n\n // Setter for capacity\n set capacity(newCapacity) {\n this._capacity = newCapacity;\n }\n\n // Getter for range\n get range() {\n return this._range;\n }\n\n // Setter for range\n set range(newRange) {\n this._range = newRange;\n }\n\n // Method to display aircraft details\n displayDetails() {\n return `Model: ${this._model}, Capacity: ${this._capacity}, Range: ${this._range} km`;\n }\n\n // Static method\n static compareRange(aircraft1, aircraft2) {\n return aircraft1.range - aircraft2.range;\n }\n}\n\n// Example usage\nlet boeing = new Aircraft('Boeing 747', 416, 13800);\nlet airbus = new Aircraft('Airbus A380', 853, 15700);\n\nconsole.log(boeing.displayDetails());\nconsole.log(airbus.displayDetails());\nconsole.log(`Range difference: ${Aircraft.compareRange(boeing, airbus)} km`);\nclass FighterJet extends Aircraft {\n constructor(model, capacity, range, speed) {\n super(model, capacity, range);\n this._speed = speed;\n }\n\n // Getter for speed\n get speed() {\n return this._speed;\n }\n\n // Setter for speed\n set speed(newSpeed) {\n this._speed = newSpeed;\n }\n\n // Method to display fighter jet details\n displayDetails() {\n return `Model: ${this._model}, Capacity: ${this._capacity}, Range: ${this._range} km, Speed: ${this._speed} km/h`;\n }\n}\n\n// Example usage\nlet f16 = new FighterJet('F-16', 1, 4220, 2400);\nlet f22 = new FighterJet('F-22', 1, 2960, 2410);\n\nconsole.log(f16.displayDetails());\nconsole.log(f22.displayDetails());\nconsole.log(`Range difference: ${Aircraft.compareRange(f16, f22)} km`);\n", | ||
"text/plain": [ | ||
"<IPython.core.display.Javascript object>" | ||
] | ||
}, | ||
"metadata": {}, | ||
"output_type": "display_data" | ||
} | ||
], | ||
"source": [ | ||
"%%js\n", | ||
"\n", | ||
"class Aircraft {\n", | ||
" // Constructor\n", | ||
" constructor(model, capacity, range) {\n", | ||
" this._model = model; // _model is a convention to indicate that it's a private property\n", | ||
" this._capacity = capacity; // _capacity is a convention to indicate that it's a private property\n", | ||
" this._range = range; // _range is a convention to indicate that it's a private property\n", | ||
" }\n", | ||
"\n", | ||
" // Getter for model\n", | ||
" get model() {\n", | ||
" return this._model;\n", | ||
" }\n", | ||
"\n", | ||
" // Setter for model\n", | ||
" set model(newModel) {\n", | ||
" this._model = newModel;\n", | ||
" }\n", | ||
"\n", | ||
" // Getter for capacity\n", | ||
" get capacity() {\n", | ||
" return this._capacity;\n", | ||
" }\n", | ||
"\n", | ||
" // Setter for capacity\n", | ||
" set capacity(newCapacity) {\n", | ||
" this._capacity = newCapacity;\n", | ||
" }\n", | ||
"\n", | ||
" // Getter for range\n", | ||
" get range() {\n", | ||
" // TODO: get the range\n", | ||
" }\n", | ||
"\n", | ||
" // Setter for range\n", | ||
" set range(newRange) {\n", | ||
" // TODO: set the range\n", | ||
" }\n", | ||
"\n", | ||
" // Method to display aircraft details\n", | ||
" displayDetails() {\n", | ||
" // TODO: display the details (model, capacity, range)\n", | ||
" }\n", | ||
"\n", | ||
" // Static method to compare range\n", | ||
" static compareRange(aircraft1, aircraft2) {\n", | ||
" return aircraft1.range - aircraft2.range;\n", | ||
" }\n", | ||
"}\n", | ||
"\n", | ||
"// Example usage\n", | ||
"let boeing = new Aircraft('Boeing 747', 416, 13800);\n", | ||
"let airbus = new Aircraft('Airbus A380', 853, 15700);\n", | ||
"\n", | ||
"console.log(boeing.displayDetails());\n", | ||
"console.log(airbus.displayDetails());\n", | ||
"console.log(`Range difference: ${Aircraft.compareRange(boeing, airbus)} km`);\n", | ||
"\n", | ||
"// New content in the HW! Lo and behold, the FighterJet class! \n", | ||
"// For 1) do research. What does the extend keyword do in JavaScript?\n", | ||
"// Here's a quick rundown if you're in a hurry: \n", | ||
"// the extends keyword creates a child class (FighterJet) that inherits from a parent class (Aircraft).\n", | ||
"class FighterJet extends Aircraft {\n", | ||
" constructor(model, capacity, range, speed) {\n", | ||
" super(model, capacity, range); // We call the parent class constructor with super\n", | ||
" this._speed = speed;\n", | ||
" }\n", | ||
"\n", | ||
" // TODO: Getter for speed\n", | ||
" // Remember to use the _speed property for memory safety\n", | ||
"\n", | ||
" // TODO: Setter for speed\n", | ||
" // Remember to use the _speed property and add a function paramater.\n", | ||
"\n", | ||
" // TODO: Method to display fighter jet details (model, capacity, range, speed)\n", | ||
"}\n", | ||
"\n", | ||
"// Example usage\n", | ||
"let f16 = new FighterJet('F-16', 1, 4220, 2400);\n", | ||
"let f22 = new FighterJet('F-22', 1, 2960, 2410);\n", | ||
"\n", | ||
"console.log(f16.displayDetails());\n", | ||
"console.log(f22.displayDetails());\n", | ||
"console.log(`Range difference: ${Aircraft.compareRange(f16, f22)} km`);" | ||
] | ||
}, | ||
{ | ||
"cell_type": "markdown", | ||
"metadata": {}, | ||
"source": [ | ||
"****\n", | ||
"\n", | ||
"*If you perceive that there are four possible ways in which a procedure can go wrong, and circumvent these, then a fifth way, unprepared for, will promptly develop.*\n", | ||
"\n", | ||
"*You have no purpose because you fear to seek one. That fear is your failure. Your fear brings you pain. We know pain. Our purpose is its end.*" | ||
] | ||
} | ||
], | ||
"metadata": { | ||
"kernelspec": { | ||
"display_name": "Python 3", | ||
"language": "python", | ||
"name": "python3" | ||
}, | ||
"language_info": { | ||
"codemirror_mode": { | ||
"name": "ipython", | ||
"version": 3 | ||
}, | ||
"file_extension": ".py", | ||
"mimetype": "text/x-python", | ||
"name": "python", | ||
"nbconvert_exporter": "python", | ||
"pygments_lexer": "ipython3", | ||
"version": "3.12.3" | ||
} | ||
}, | ||
"nbformat": 4, | ||
"nbformat_minor": 2 | ||
} |
Oops, something went wrong.