在项目中发现,ES6中的Array原生类的继承在TS中无法实现了,子类定义的方法不见丢失了,代码编译后其实发生了变化(在2.1.5之后),至于为什么会发生这种现象,
miscrosoft给出的解释是
In ES2015, constructors which return an object implicitly substitute the value of this for any callers of super(...). It is necessary for generated constructor code to capture any potential return value of super(...) and replace it with this.
As a result, subclassing Error, Array, and others may no longer work as expected. This is due to the fact that constructor functions for Error, Array, and the like use ECMAScript 6's new.target to adjust the prototype chain; however, there is no way to ensure a value for new.target when invoking a constructor in ECMAScript 5. Other downlevel compilers generally have the same limitation by default.
简而言之就是es6中,Error, Array和其他原生类的extends需要通过super调用来完成原型链的继承,而其中最关键的一步是通过调用构造函数的target来寻找原型链,而在es5中,没法确保构造函数的target,也就无法完整查找到当前的子类的构造函数的原型实例,从而只实现父类的继承,只会返回父类this,但是原型链确断裂了。关于new.target的了解,可以跳转MDN的介绍。
解决办法
虽然TS无法为我们实现继承,但是我们可以自己为子类实现原型的继承,这样子类依然有我们子类的方法。原理呢还是利用es5的组合继承。
在子类的构造函数中调用完父类后,再把原型链指回自身。
constructor(m: string) {
super(m);
// Set the prototype explicitly.
Object.setPrototypeOf(this, FooError.prototype);
}
这样,在在子类上定义的方法就不会丢失,因为我们又把原型指回了子类。