ECMAScript6--14.类与对象

1.类

• 类的概念
  • 基本语法
  • 类的继承
  • 静态方法
  • 静态属性
  • getter
  • setter

2.类的基本定义和生成实例

{
    //定义一个类的基本方法：class 名称{ }
    class Parent{
        constructor(name='abc'){
            this.name = name;
        }
    }
    
    /生成实例；v就是构造函数里面的参数；
    let v_parent = new Parent('v');
    console.log('构造函数和实例',v_parent); //构造函数和实例 Parent{name:"v"}
}

3.继承：extend关键字实现继承

{
    class Parent{
        constructor(name='abc'){
            this.name = name;
        }
    }
    
    //通过extends关键字实现继承,继承了Parent实例；
    class Child extends Parent{
        //怎么在自己的构造函数中把参数传递给父类；
        
    }
    
    //子类怎么去覆盖父类的默认值呢？（继承怎么传递参数）
    console.log('继承',new Child()); //继承 Child{name:"abc"}

}

 {
    class Parent{
        constructor(name='abc'){
            this.name = name;
        }
    }
    
    //通过extends关键字实现继承,继承了Parent实例；
    class Child extends Parent{
    
        //怎么在自己的构造函数中把参数传递给父类；
        constructor(name='child'){
        
            //super中参数的列表就是父类的constructor的参数列表；
            //如果在子类中super()不带任何参数，父类中构造函数的所有都会使用父类的默认值；
            super(name);
            
            //子类要增加自己的属性；
            //注意：定义自己属性的时候调用this，一定要放在super之后；
            //在继承关系中，子类的构造函数用了super传递参数的过程中，super一定是要放在构造
              函数的第一行;
            this.type ='child';
        }
    }
    
    //子类怎么去覆盖父类的默认值呢？（继承怎么传递参数）
    console.log('继承传递参数',new Child()); 
   //继承传递参数 Child{name:"child",type="child"}
    
    //带参数，参数会覆盖默认值；
    console.log('继承传递参数',new Child('Hello')); 
    //继承传递参数 Child{name:"Hello",type="child"}

}

3.类中的getter和setter

{
    class Parent{
        constructor(name='abc'){
            this.name = name;
        }
    
        //getter的写法：get 名字(){}这个是属性，不是方法；
        //读取longName属性；
        get longName(){
            return 'mk'+this.name;
        }
    
        //setter
        set longName(value){
            this.name = value;
        }
    }
    
    let v = new Parent();
    console.log('getter',v.longName); //getter mkabc
    
    v.longName ='hello';
    console.log('setter',v.longName); //setter mkhello
}

4.静态方法

{
     class Parent{
        constructor(name='abc'){
            this.name = name;
        }
        
        //静态方法的定义：static 方法名称(){ 函数要执行的具体内容 }
        //加了static这个方法就变成静态方法,static只是用来定义静态方法；
        //静态方法：通过类去调用，而不是通过类的实例调用；
        static tell(){
            console.log('tell');
        }
    }
    
    //静态方法的使用；
    Parent.tell();// tell
}

5.静态属性

{
    class Parent{
        constructor(name='abc'){
            this.name = name;
        }
        
        static tell(){
            console.log('tell');
        }
        
    }
    
    //静态属性没有关键词；
    //类定义完之后，直接在类上定义静态属性；
    //这个Parent注意一定是类，不是实例；
    Parent.type = 'test';
    
    console.log('静态属性的读取',Parent.type); //静态属性的读取 test
    
}