用ES6写了一个继承Array的类,覆写了push方法,但是用babel转换成ES5之后发现调用的方法还是原来的push方法:
.babelrc:
:
{
"presets": [
"es2015",
"react",
"stage-3"
],
"plugins": []
}
编译前的ES6
代码:
//类的定义
class ROUTE extends Array{
constructor(position){
super();
this.push({
position: (position || [0,0,0])
})
}
push(geometry){
...//业务相关代码
}
}
经过babel编译过后的ES5
代码:
//先是几个工具方法
var _createClass=function...
var _get=function...
function _classCallCheck...
function _possibleConstructorReturn...
function _inherits...
//类的定义
var ROUTE = function (_Array) {
_inherits(ROUTE, _Array);//继承
function ROUTE(position) {
...//类的构造
}
_createClass(ROUTE, [{
key: "push",
value: function push(geometry) {
//业务相关代码,实际上不会执行
}]);
return ROUTE;
}
实际上在执行ROUTE类实例的方法时,完全不会调用_createClass方法中的那段业务逻辑代码,而仅仅是执行Array的push方法,除非在构造方法中覆写push方法。
babel版本:
"devDependencies": {
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-3": "^6.24.1"
}
由于浏览器引擎的限制, Babel 不支持对某些内置类的subclass的支持,例如 Date, Array, Error..., 所以根据自己的需要自己定义所需要的类型吧
参考:https://babeljs.io/learn-es20...