ES5、ES6 创建对象区别

JavaScript 语言中，生成实例对象的传统方法是通过构造函数,es6的class 的出现 基本上可以替代了es5的构造函数和原型,使之代码结构上更加简洁。

ES5 创建对象

       // 父类 -- 超类 -- super
        function Person(name,age){
            this.name=name
            this.age=age
        }
        Person.prototype.say=function(){
            console.log(this.name,this.age);
        }

        // 子类
        function Student(name,age,gender){
            this.gender=gender
            // call (方法借用) 可以调用一个函数，并且可以指定这个函数的`this`指向
            Person.call(this,name,age)
        }

        // 子类继承父类原型中的成员
        Student.prototype.say=Person.prototype.say

        // 创建子类对象并调用方法
        let stu=new Student('penny',18,'女')
        console.log(stu);
        stu.say()

ES6 创建对象

关键字：

1. class

2. 属性

3. 方法

4. 继承 extends

5. 构造函数 constructor

6. 方法重写 override：子类方法覆盖父类，super.父类方法()

7. 父类的构造函数 super ：子类有构造方法且使用this前，必须使用super()

        // 父类 -- 超类 -- super
        class Person {
            // constructor 添加 构造函数 -- 构造器
            constructor(name, age) {
                this.name = name
                this.age = age
            }
            //添加原型中的成员
            say() {
                console.log(this.name, this.age);
            }
        }
        // 子类 -- 继承(拥有父类所有成员)
        //继承语法 class 子类 extends 父类
        // class Student extends Person { }
        class Student extends Person { 
            constructor(name,age,gender){
                //super 调用父类构造函数
                super(name,age)
                this.gender=gender
            }
            
        }
        // 创建子类对象并调用方法
        let stu = new Student('penny', 18,'女')
        console.log(stu);
        stu.say()