Setup: Shape Class & Export
Part of the Object Oriented Programming section of Coddy's JavaScript journey — lesson 39 of 56.
Challenge
In this project, we'll build a simple shape rendering system that demonstrates key Object-Oriented Programming concepts. We'll create different shapes that can describe themselves, practice inheritance, and organize our code using modules.
Your task:
- In `Shape.js`, create a `Shape` class with:
- A constructor that takes one parameter:
color - A method called
describe()that returns:"A ${color} shape"
- A constructor that takes one parameter:
- Export the class using
export - In
main.js, import the class using:import { Shape } from './Shape.js';
Try it yourself
// TODO: Import the Shape class from './Shape.js';
// Test the Shape class
const myShape = new Shape('blue');
console.log(myShape.describe()); // Outputs: "A blue shape"
All lessons in Object Oriented Programming
1Objects & The this Keyword
Quick Review: ObjectsAdding Methods to ObjectsUnderstanding the this KeywordConstructor FunctionsThe new KeywordRecap Challenge7 Inheritance & The extends Key
InheritanceThe "is-a" RelationshipThe extends KeywordThe super() MethodInheriting Properties&MethodsRecap Challenge2Organizing Code
What are Modules?Exporting with exportImporting with importDefault vs. Named Exports8Organizing OOP Code
Organize Classes into Modules11Project: A Shape Renderer
Setup: Shape Class & ExportCircle Class Inheritance
Overriding & Area MethodStatic Shape Counter9Static Methods & Properties
Class-Level vs. Instance-LevelStatic PropertiesStatic Utility MethodsRecap challenge