在上一节的内容中讲解了在ES6中的类的用法,在ES6中新增的class关键字和extends可以成功实现类的继承
在这里有一点补充,实际上类和构造函数是有一点不同的
类调用必须使用new关键字
super()函数的使用
在子类的constructor函数实际上指向的是父类的constructor函数,因为在子类的constructor内部的this指向的是子类实例本身,需要super去改变this指向,可以调用super()方法传递参数,动态获得父类的继承
static关键字定义静态方法
有时候我们不想让对象获取类上的某个方法,指向让这个方法通过类本身调用,这个时候我们就需要使用static关键字来定义方法
分析class的原理
使用babel,我们首先将ES6的语法转变成ES5看一下
先看一个最简单的语法
接下来为这个类添加一些属性
我们为这个类添加了私有属性,共有方法和静态方法
看一下转译之后的结果
分析一下上面的源码,_createClass方法在babel写的不太便于阅读,我们拿到vscode里分析一下其内部构造
看一下实际调用过程
这就是类的创建过程
接下来看一下继承
我们同样还是借助babel来转译成ES5的源码
我们先来看一个子类不带构造函数的
转译之后的源码
在之前的基础上又多了两个方法
我们主要关注继承的方法,将源码拿到vscode中解析一下
领取专属 10元无门槛券
私享最新 技术干货