JavaScript 面向對象編程指的是將數據和功能作為對象的屬性和方法進行封裝,以實現更好的可維護性和可擴展性。下面將講解幾個常用的面向對象編程的概念和實現。
1. 類和實例
class Person { constructor(name, age) { this.name = name; this.age = age; } sayHi() { console.log(<code>Hi, my name is ${this.name}, I'm ${this.age} years old.</code>); } } const person1 = new Person('Alice', 18); person1.sayHi(); // Hi, my name is Alice, I'm 18 years old.
上述代碼中,Person 類有一個構造函數 constructor 和一個方法 sayHi,使用 new 操作符可以創建一個 Person 的實例 person1,并調用它的 sayHi 方法來輸出個人信息。
2. 繼承
class Animal { constructor(name) { this.name = name; } sayHi() { console.log(<code>Hi, I'm ${this.name}.</code>); } } class Dog extends Animal { constructor(name) { super(name); this.type = 'Dog'; } bark() { console.log('Wof Wof!'); } } const dog1 = new Dog('Coco'); dog1.sayHi(); // Hi, I'm Coco. dog1.bark(); // Wof Wof!
上述代碼中,Animal 類有一個構造函數 constructor 和一個方法 sayHi,Dog 類繼承自 Animal 類,并擴展了一個方法 bark。使用 super 關鍵字調用父類的構造函數,即 Animal 的構造函數,然后才能在子類中訪問父類的屬性和方法。
3. 多態
class Shape { constructor(type) { this.type = type; } draw() { console.log('Drawing a shape.'); } } class Circle extends Shape { constructor(radius) { super('Circle'); this.radius = radius; } draw() { console.log(<code>Drawing a circle with radius ${this.radius}.</code>); } } class Square extends Shape { constructor(length) { super('Square'); this.length = length; } draw() { console.log(<code>Drawing a square with length ${this.length}.</code>); } } const shapes = [new Circle(5), new Square(3)]; shapes.forEach(shape => shape.draw());
上述代碼中,Shape 類有一個構造函數 constructor 和一個方法 draw,Circle 類和 Square 類都繼承自 Shape 類,并擴展了各自的 draw 方法。使用循環遍歷一個包含不同形狀的對象數組 shapes,并調用它們的 draw 方法來實現多態。
4. 封裝
const person2 = { name: 'Bob', age: 20, get name() { console.log('Getting name.'); return this._name; }, set name(value) { console.log('Setting name.'); this._name = value; } } person2.name = 'Bobby'; // Setting name. console.log(person2.name); // Getting name. Bobby
上述代碼中,person2 對象使用 get 和 set 關鍵字封裝了它的 name 屬性,外部可以通過 person2.name 和 person2.name = 'Bobby' 的方式訪問或設置 name 屬性,但其實際操作的是通過 getter 和 setter 方法訪問或修改 _name 屬性,實現了對 _name 屬性的封裝。
總之,JavaScript 面向對象編程提供了一種更優雅、更可維護、更可擴展的編程方式,使程序更易于理解和協同開發。