基于jquery的ES6面向对象选项卡

Posted 2021-02-06 xingxingclassroom

ES5中的面向对象相信大家都非常熟悉，包括一系列的配置参数，方法，自定义事件等，现在简单介绍一下es6面向对象的一些知识还有一个基于jquery的es6面向对象选项卡的写法。

ES6中提供了基于类class的面向对象语法。但class实际上是ES6提供的一颗语法糖，javascript是一门基于原型的面向对象语言。

// 父类
class Test {
    // 构造器
    constructor (arg1, arg2) {
        this.arg1 = arg1;
        this.arg2 = arg2;
    }
    // 实例方法
    fn () {
        console.log(‘fn‘);
    }
    // 类方法
    static create () {
        console.log(‘create‘);
    }
}
// 子类
class Student extends People {
    constructor (arg1, arg2) {
        // super关键词继承
        super(arg1, arg2)
    }
}

上面的代码定义了一个Test类， 可以看到里面有一个constructor方法， 这就是构造方法，也可以叫做构造器，而this关键字则代表实例对象。也就是说，ES5中的构造函数Test， 对应的是E6中Test类中的constructor方法，也就是配置参数。