ES——类（Class）

实例方法

定义与生成

使用class定义，使用new生成。

//基本定义和生成实例
    class Parent{
        constructor(name='Tim'){
            this.name = name;
        }
    }

    //实例
    let  ccc = new Parent('v');
    console.log('实例',ccc);

继承

extend简单继承

//父类
class Parent{
    constructor(name='Tim'){
    this.name = name;
    }
}

//子类
//使用extends关键字，继承父类
class Child extends Parent{}

//打印子类的实例
console.log('继承',new Child());  // {name: 'Tim'}

super继承传参

super传入的参数，是用来替换父类中同名的属性的属性值。

//父类
    class Parent{
        constructor(name='Tim'){
            this.name = name;
        }
    }

    //子类使用extends关键字，继承父类
    class Child extends Parent{
        //子类创建一个构造函数，接受参数
        constructor(name='child'){

            //子类使用super关键字传入参数，用来替换父类已有的属性值
            super(name);

            //子类私有属性，必须带this！！！
            //私有属性，必须放在super的后面！！！
            this.type = 'son';
        }
    }

    //打印出来子类的实例
    console.log('继承传参',new Child());  // {name: "child" , type: 'son'}

setter、getter

其实就是对属性进行快速读、写

 class Parent{
        constructor(name='Tim'){
            this.name = name;
        }

        //读取属性
        //     ↓↓  这里是属性，不是方法
        get longName(){
            return 'smart'+this.name
        }

        //设置属性
         //     ↓↓  这里是属性，不是方法
        set longName(value){
            this.name = value;
        }
    }

    //创建实例
    let ccc = new Parent();

    //读取
    console.log(ccc.longName);  // smartTim

    //设置，然后再读取一次
    ccc.longName='Hello';
    console.log(ccc.longName); //smartHello

静态方法

静态方法就是通过类去调用，而不通过实例。

设置静态方法

语法

类{ static 名称(){} }

实例

// 静态方法
    class Parent {
        constructor(name = 'Tim') {
            this.name = name;
        }

        static tell(){
            console.log('tell');
        }
    }

    //一定要注意，这里是通过类去调用   
    Parent.tell();  // tell

设置静态属性

在类定义完以后，直接往类上写。

实例

    // 静态属性
    class Parent {
        constructor(name = 'Tim') {
            this.name = name;
        }
    }

    //↓↓定义属性
    Parent.type='tail';

                         // ↓↓一定是类，而不是实例
    console.log('静态属性',Parent.type);  // tail