Question

我有一个非常基本的JS错误，我很惭愧无法解决它......

我正在开发ES6和Babel，我正在做一些实验。请注意我在Babel中使用这些参数：

--presets es2015 --plugins transform-es2015-modules-amd

我有一个简单的模块：

"use strict";

export default class Inspector {
    static inspect() {
        console.log(this.prototype.myMethod);
        console.log(typeof this.prototype.myMethod);
    }
}

我像这样使用这个模块：

"use strict";

import Inspector from "inspector";

class Child extends Inspector {
    myMethod() {
        console.log(`Hello from ${this.name}`);
    }
}

Child.inspect();

这里的目标非常愚蠢：只需检查原型是如何填充ES6继承的。

console.log方法中的第一个inspect()按预期显示：

function myMethod（）{ console.log（“Hello from”+ this.name）; }

继承已按预期工作，小时！但有趣的部分是第二个引发错误的console.log（console.log(typeof this.prototype.myMethod);）：

require.js：19 RangeError：超出最大调用堆栈大小（...）

我期待更像“功能”的东西，但是嘿，我想我很天真......

这个错误似乎与requirejs模块有关，但我没有线索为什么我可以记录该函数而不是它的类型。

请注意我可以在inspect方法中调用此方法：

static inspect() {
        this.prototype.myMethod();
}

这显示“来自未定义的Hello”（我原本期望“来自Child的Hello”，但因为它不是静态方法，所以这是正常的。无论如何，正确执行了调用！）。

所以，我的问题在这里：为什么我可以记录并调用方法，但我无法在其上运行typeof？

提前致谢！

编辑：您可以在下面看到已编译的文件：

inspector.js

define(["exports"], function (exports) {
    "use strict";

    Object.defineProperty(exports, "__esModule", {
        value: true
    });

    function _typeof(obj) {
        return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj === "undefined" ? "undefined" : _typeof(obj);
    }

    function _classCallCheck(instance, Constructor) {
        if (!(instance instanceof Constructor)) {
            throw new TypeError("Cannot call a class as a function");
        }
    }

    var _createClass = (function () {
        function defineProperties(target, props) {
            for (var i = 0; i < props.length; i++) {
                var descriptor = props[i];
                descriptor.enumerable = descriptor.enumerable || false;
                descriptor.configurable = true;
                if ("value" in descriptor) descriptor.writable = true;
                Object.defineProperty(target, descriptor.key, descriptor);
            }
        }

        return function (Constructor, protoProps, staticProps) {
            if (protoProps) defineProperties(Constructor.prototype, protoProps);
            if (staticProps) defineProperties(Constructor, staticProps);
            return Constructor;
        };
    })();

    var Inspector = (function () {
        function Inspector() {
            _classCallCheck(this, Inspector);
        }

        _createClass(Inspector, null, [{
            key: "inspect",
            value: function inspect() {
                this.prototype.myMethod();
                console.log(this.prototype.myMethod);
                console.log(_typeof(this.prototype.myMethod));
            }
        }]);

        return Inspector;
    })();

    exports.default = Inspector;
});

child.js

function _typeof(obj) { return obj && typeof Symbol !== "undefined" && obj.constructor === Symbol ? "symbol" : typeof obj; }

define(["inspector"], function (_inspector) {
    "use strict";

    var _inspector2 = _interopRequireDefault(_inspector);

    function _interopRequireDefault(obj) {
        return obj && obj.__esModule ? obj : {
            default: obj
        };
    }

    function _classCallCheck(instance, Constructor) {
        if (!(instance instanceof Constructor)) {
            throw new TypeError("Cannot call a class as a function");
        }
    }

    var _createClass = (function () {
        function defineProperties(target, props) {
            for (var i = 0; i < props.length; i++) {
                var descriptor = props[i];
                descriptor.enumerable = descriptor.enumerable || false;
                descriptor.configurable = true;
                if ("value" in descriptor) descriptor.writable = true;
                Object.defineProperty(target, descriptor.key, descriptor);
            }
        }

        return function (Constructor, protoProps, staticProps) {
            if (protoProps) defineProperties(Constructor.prototype, protoProps);
            if (staticProps) defineProperties(Constructor, staticProps);
            return Constructor;
        };
    })();

    function _possibleConstructorReturn(self, call) {
        if (!self) {
            throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
        }

        return call && ((typeof call === "undefined" ? "undefined" : _typeof(call)) === "object" || typeof call === "function") ? call : self;
    }

    function _inherits(subClass, superClass) {
        if (typeof superClass !== "function" && superClass !== null) {
            throw new TypeError("Super expression must either be null or a function, not " + typeof superClass);
        }

        subClass.prototype = Object.create(superClass && superClass.prototype, {
            constructor: {
                value: subClass,
                enumerable: false,
                writable: true,
                configurable: true
            }
        });
        if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass;
    }

    var Child = (function (_Inspector) {
        _inherits(Child, _Inspector);

        function Child() {
            _classCallCheck(this, Child);

            return _possibleConstructorReturn(this, Object.getPrototypeOf(Child).apply(this, arguments));
        }

        _createClass(Child, [{
            key: "myMethod",
            value: function myMethod() {
                console.log("Hello from " + this.name);
            }
        }]);

        return Child;
    })(_inspector2.default);

    Child.inspect();
});

不幸的是，异常stracktrace并不是很有用：

ea.check @ require.js：19

（匿名函数）@ require.js：23

（匿名函数）@ require.js：8

（匿名函数）@ require.js：24

x @ require.js：7

ea.emit @ require.js：24

ea.check @ require.js：20 ea.enable @ require.js:24

ea.init @ require.js：17 J @ require.js：14

h.completeLoad @ require.js：29

h.onScriptLoad @ require.js：30

EDIT2：通过查看已转换的文件，我的typeof似乎已被来自Babel的方法_typeOf替换。而且这个函数无限循环......

这是Babel的错误吗？我是否错过了编译的任何论据？

Answer 1

看起来像一个babel bug，可能就是这个：https://phabricator.babeljs.io/T6777

Answer 2

对于任何人，Babel中的错误似乎仍然存在：https://github.com/babel/babel/issues/9127

当用户报告我的代码错误时，我就碰到了它。一旦我们关闭了Bable Transpiler选项，他就使用了“超出最大呼叫堆栈大小”错误。

Babel / RequireJS + typeof“RangeError：超出最大调用堆栈大小”

2 个答案: