天天看点

2021-05-27对ES6中类的理解

对ES6中类的理解

1.基本使用方法

ES6中引入关键词class,其基本使用方法如下:

程序一:如何在ES6中定义class。

class Rectangle {
    constructor(height, width) {
        this.height = height;
        this.width = width;
    }
    // Getter
    get area() {
        return this.calcArea();
    }
    // Method
    calcArea() {
        return this.height * this.width;
    }
}
var a = new Rectangle(10,20);
console.log(a);          //Rectangle {height: 10, width: 20}
console.log(a.calcArea());  //200
      

程序二:ES6中如何继承父类

class Animal {
    constructor(name) {
        this.name = name;
    }

    speak() {
        console.log(this.name + ' makes a noise.');
    }
}

class Dog extends Animal {
    constructor(name) {
        super(name);
    }

    speak() {
        console.log(this.name + ' barks.');
    }
}
let a = new Animal('Marry');
console.log(a);        //Animal {name: "Marry"}  Marry makes a noise.
let d = new Dog('Mitzie');
console.log(d);  //  Dog {name: "Mitzie"}
console.log(d.speak());//Mitzie barks.      

ES6中类的基本使用与类的继承与java中的类的使用方法异曲同工。在类中,均需要定义其属性个方法,ES6中的属性在 constructor构造器里面定义,方法可以使用构造器中传入的参数。同时继承的关键字使extends。