深入es6之class

es5定义一个类

function Parent(x) {
  // 实例属性（构造函数属性）
    this.x = x
}
var p =new Parent('欧富华')
console.log(p.x) // 欧富华

es6定义一个类

class Parent {
    constructor(x) {
 // 实例属性（构造函数属性）
        this.x = x
    }
}
var p =new Parent('欧富华')
console.log(p.x) // 欧富华

es6原型方法（内部this是实例化的类）

class Parent {
    // 实例属性
    constructor(x) {
        this.x = x
    }

    // 原型（prototype）方法
    getX() {
        return this.x
    }

    // es6 获取值
    get loop() {
        return 'loop'
    }

    // es6 设置值
    set setLoop(value) {
        this.b = value
    }

    // 静态方法
    static loop() {
        return '我是静态方法'
    }
}

let p = new Parent('欧富华')
console.log(p.getX(), p.loop)  // 欧富华，loop

静态方法（内部this是类）

 class Parent {
        // 原型方法
        l() {
            // this是实例的类
            console.log('我是原型方法')
        }

        static loop() {
            // this是Parent
            // this.l()  报错
            this.a() // 成功
            console.log('我是静态方法')
        }

        static a() {
            console.log('我是静态方法')
        }
    }
    // 调用不需要实例化
    Parent.loop() // 我是静态方法（输出2次）

继承

   class Parent {
        constructor(x) {
            this.x = x
        }

        // 原型方法
        l() {
            // this是实例的类
            console.log('我是原型方法')
            return '2'
        }

        static loop() {
            // this是Parent
            // this.l()  报错
            this.a() // 成功
            console.log('我是静态方法')
        }

        static a() {
            console.log('我是静态方法')
        }
    }

    // 调用不需要实例化
    Parent.loop() // 我是静态方法（输出2次）
    Parent.a = 1

    // 继承会把父类的原型属性和静态属性都会继承
    class Child extends Parent {
        constructor(x, type) {
            // 继承属性，必须要
            super(x)
            // 新增子类属性
            this.type = type
        }
        list(){
            console.log(super.l()) // 调用父类的方法
        }
    }

    let child = new Child()
    child.list() // 2