es6中的class类

目录

系列文章目录

前言

一、constructor类的构造函数

 二、继承

---

前言

class相当于es6中的语法糖，新的class类的写法相较于普通的构造函数更能体现对象原型，更接近于面向对象编程的语法

一、constructor类的构造函数

constructor是类的构造函数，是一个默认方法，通过new命令创建对象实例时，自动调用的方法，一个类必须有constructor，如果在声明类的时候没有定义constructor，那么会默认定义一个constructor方法，一般constructor方法返回实例对象this，也可以返回指定对象

        class GetName {
            name: any;
            constructor(name: any) {
                this.name = name; //返回实例对象this
            }
            getAge() {
                console.log('你的名字叫' + this.name);
            }
        }

        class GetAge {
            constructor() {
                return new GetName('李四'); //返回指定对象
            }
        }
        const name = new GetName('张三');
        console.log(name, 'name');
        name.getAge();

 

 二、继承

在 constructor 中必须调用 super 方法，它会执行基类的构造函数，且必须出现在this之前，因为子类没有自己的 this 对象，而是继承父类的 this 对象，然后对其进行加工,而 super 就代表了父类的构造函数。super 虽然代表了父类 A 的构造函数，但是返回的是子类 B 的实例，即 super 内部的 this 指的是 B

class GetA {}
class GetB extends GetA {
  constructor() {
    super();  // 子类没有自己的this,所以子类的构造函数必须执行一次 super 函数，否则会报错。
  }
}

       //声明一个类
        class getGTong {
            name = 2;
            constructor() {}
            getName() {
                console.log(this.name);
            }
        }
        class Child extends getGTong {
            constructor() {
                // console.log(this);//报错：访问派生类的构造函数中的 "this" 前，必须调用 "super"。
                super(); //必须在this前调用
                this.name = 4;
                console.log(this, 'this'); //返回child类 而不是父类
            }
        }
        let Tong = new getGTong();
        let child = new Child();
        console.log(Tong.name, '基类'); //返回2
        console.log(child.name, '子类'); //返回4
        child.getName(); //调用继承父类的方法