class

class

1. class 与es5function差异
   • class只能使用new命令执行，es5function可以直接执行
   • class类内部定义方法不可枚举
   • 继承时子类生成原理不同
2. class内部定义的属性只有通过this定义的属性是绑定在实例对象上，其他实例属性绑定在原型对象上，静态属性绑定在类对象上

    class A{
        /* 尚未完全支持*/
        static b = 1 //静态属性，绑定在类对象上
        b = 2//实例属性，绑定在实例对象上
        /* 尚未完全支持*/
        static a(){//静态方法，绑定在类对象上
            console.log(1)
        }
        constructor(){
            //实例属性，绑定在实例对象上
            this.a = ()=>console.log(2)
        }
        a(){//实例方法，绑定在原型对象上
            console.log(3)
        }
    }
    let a = new A()
    A.a()//1
    a.a()//2
    a.__proto__.a()//3
    A.prototype.a()//3
   

3. class继承原理
   • es5先使用子类构造函数生成子类实例对象this,然后修改子类实例对象的原型对象为父类实现继承
   • es6 extends继承先调用父类构造函数生成子类对象的实例this(Parent.prototype.constructor.call(this))，然后再通过子类构造函数修改this
   • 构造函数继承，Child.__proto__ === Parent
   • 原型方法继承 Child.prototype.__proto__ ===Parent.prototype
4. this
   • 静态方法的this指向类对象
   • 实例方法的this指向实例对象
5. super
   • 作为函数使用作为父类的构造函数，只能在子类构造函数里执行，只能执行一次，且必须执行
   • 作为对象使用，在普通方法中指向父类的原型对象
   • 作为对象使用，在静态方法中指向父类的类对象
   • 使用super进行赋值时，super===this

tips

1. class内部无法定义静态属性和绑定在原型对象上的属性，只能定义相应方法
2. 类

    class A{}
    class B extends A {}
    let a = new A()
    let b = new B()
    // 类的构造函数就是当前类
    A.prototype.constructor === A
    B.prototype.constructor === B
    // 实例对象的__proto__指向对应构造函数的prototype
    a.__proto__ === A.prototype
    b.__proto__ === B.prototype
    //子类的构造函数继承自父类的构造函数
    B.prototype.constructor.__proto__ === A.prototype.constructor
    B.__proto__ === A
    // 子类对象的原型方法继承自父类的原型方法
    B.prototype.__proto__ === A.prototype