js中的面向对象入门

一、JavaScript中的面向对象基础

JavaScript是一门面向对象的语言，可以使用类（class）和实例（instance）的概念来组织代码和数据，实现封装、继承和多态等面向对象的特性。在面向对象的编程中，我们通常会定义一个类，然后通过实例化该类，创建一个实例对象，再通过对象的属性和方法来处理数据、执行操作。下面是JS中定义Person类的示例代码：

// 定义Person类
class Person{
    constructor(name, age){
        this.name = name;
        this.age = age;
    }

    introduce(){
        console.log(`我叫${this.name}，今年${this.age}岁`);
    }
}

// 创建Person实例
let p1 = new Person('小明', 21);
p1.introduce();

在上面的代码中，使用class关键字定义了一个Person类，包含了构造函数constructor和方法introduce。constructor方法接收两个参数name和age，通过this关键字分别将这两个参数保存在Person类的实例中。introduce方法用来在控制台输出该人物的姓名和年龄。接着通过let关键字定义一个变量p1，表示一个Person实例，通过new关键字创建了该实例，并调用introduce方法输出该实例对象的属性值。

二、JavaScript中的继承

在面向对象编程中，继承是实现代码的重用和扩展的重要手段。JavaScript中的继承通过extends关键字来实现，我们可以创建一个子类继承于父类，来获得父类的属性和方法，并且可以在子类上新增或重写方法，以满足自己的需求。下面是一个定义Student类继承自Person类的示例代码：

// 定义Person类
class Person{
    constructor(name, age){
        this.name = name;
        this.age = age;
    }

    introduce(){
        console.log(`我叫${this.name}，今年${this.age}岁`);
    }
}

// 定义Student类继承自Person类
class Student extends Person{
    constructor(name, age, grade){
        super(name, age);
        this.grade = grade;
    }

    introduce(){
        console.log(`我叫${this.name}，今年${this.age}岁，读${this.grade}年级`);
    }
}

// 创建一个Student实例
let s1 = new Student('小红', 20, 3);
s1.introduce();

在上面的代码中，定义了两个类Person和Student，Student类继承自Person类，使用super关键字在构造函数中调用父类的构造函数，并传递参数name和age给父类。在Student类中定义了一个属性grade，表示学生的年级。另外，在Student类中重写了introduce方法，输出了自己的姓名、年龄和年级信息。接着通过let关键字定义一个变量s1，表示一个Student类的实例，通过new关键字创建了该实例，并调用introduce方法输出该实例对象的属性值。

三、示例

1、定义Rectangle类，包含长度和宽度两个属性和一个calculateArea方法，返回该矩形的面积。

class Rectangle{
    constructor(length, width){
        this.length = length;
        this.width = width;
    }

    calculateArea(){
        return this.length * this.width;
    }
}

let r1 = new Rectangle(10, 20);
console.log(r1.calculateArea());

2、定义Circle类继承自Shape类，包含一个半径属性和一个calculateArea方法，返回该圆形的面积。

class Shape{
    area(){
        console.log(`I'm a shape, but no area specified.`);
    }
}

class Circle extends Shape{
    constructor(radius){
        super();
        this.radius = radius;
    }

    area(){
        return Math.PI * this.radius * this.radius;
    }
}

let c1 = new Circle(5);
console.log(c1.area());

上述两个示例代码中分别定义了Rectangle类和Circle类，Rectangle类包含了长度和宽度两个属性和一个calculateArea方法，返回该矩形的面积。Circle类继承自Shape类，包含了一个半径属性和一个calculateArea方法，返回该圆形的面积。在代码中，使用let关键字定义了变量r1和c1，分别表示一个Rectangle实例和一个Circle实例，通过new关键字创建了这两个实例，并且调用了它们的calculateArea方法和area方法。