搜索

首页  >  问答  >  正文

javascript - Babel对于继承预定义类转换的问题

用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"
  }
曾经蜡笔没有小新曾经蜡笔没有小新2775 天前555

全部回复(1)我来回复

  • 我想大声告诉你

    我想大声告诉你2017-05-19 10:32:16

    Partial support
    Built-in subclassability should be evaluated on a case-by-case basis as classes such as HTMLElement can be subclassed while many such as Date, Array and Error cannot be due to ES5 engine limitations.

    由于浏览器引擎的限制, Babel 不支持对某些内置类的subclass的支持,例如 Date, Array, Error..., 所以根据自己的需要自己定义所需要的类型吧

    参考:https://babeljs.io/learn-es20...

    回复
    0
  • 取消回复