Javascript 巴别塔6-异步箭头功能“;这";指向功能的点
巴别塔6与这些设置Javascript 巴别塔6-异步箭头功能“;这";指向功能的点,javascript,node.js,babeljs,Javascript,Node.js,Babeljs,巴别塔6与这些设置 require("babel-register")({ extensions: [".es6", ".es", ".jsx", ".js"], plugins: ['transform-runtime'], presets: ["es2015", "stage-0"] }); 行为意外,此引用在常规箭头函数和异步箭头函数之间存在差异。所以我的问题是,是否有人可以确认这是最新babel的bug,我应该在哪里报告这个问题 class TestClass {
require("babel-register")({
extensions: [".es6", ".es", ".jsx", ".js"],
plugins: ['transform-runtime'],
presets: ["es2015", "stage-0"]
});
行为意外,此引用在常规箭头函数和异步箭头函数之间存在差异。所以我的问题是,是否有人可以确认这是最新babel的bug,我应该在哪里报告这个问题
class TestClass
{
name = "John Doe";
testMethodSuccess()
{
return new Promise((resolve) => {
console.log(this);
setTimeout(resolve, 1000);
});
}
testMethodFailure()
{
return new Promise(async (resolve) => {
console.log(this);
setTimeout(resolve, 1000);
});
}
}
(async () => {
try{
var testObject = new TestClass();
await testObject.testMethodSuccess();
await testObject.testMethodFailure();
}catch(e){
console.error(e);
}
})();
这是上面代码的结果
"use strict";
var _regenerator = require("babel-runtime/regenerator");
var _regenerator2 = _interopRequireDefault(_regenerator);
var _asyncToGenerator2 = require("babel-runtime/helpers/asyncToGenerator");
var _asyncToGenerator3 = _interopRequireDefault(_asyncToGenerator2);
var _promise = require("babel-runtime/core-js/promise");
var _promise2 = _interopRequireDefault(_promise);
var _classCallCheck2 = require("babel-runtime/helpers/classCallCheck");
var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);
var _createClass2 = require("babel-runtime/helpers/createClass");
var _createClass3 = _interopRequireDefault(_createClass2);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var TestClass = function () {
function TestClass() {
(0, _classCallCheck3.default)(this, TestClass);
this.name = "John Doe";
}
(0, _createClass3.default)(TestClass, [{
key: "testMethodSuccess",
value: function testMethodSuccess() {
var _this = this;
return new _promise2.default(function (resolve) {
console.log(_this);
setTimeout(resolve, 1000);
});
}
}, {
key: "testMethodFailure",
value: function testMethodFailure() {
return new _promise2.default(function () {
var _this2 = this;
var ref = (0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee(resolve) {
return _regenerator2.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
console.log(_this2);
setTimeout(resolve, 1000);
case 2:
case "end":
return _context.stop();
}
}
}, _callee, _this2);
}));
return function (_x) {
return ref.apply(this, arguments);
};
}());
}
}]);
return TestClass;
}();
(0, _asyncToGenerator3.default)(_regenerator2.default.mark(function _callee2() {
var testObject;
return _regenerator2.default.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
_context2.prev = 0;
testObject = new TestClass();
_context2.next = 4;
return testObject.testMethodSuccess();
case 4:
_context2.next = 6;
return testObject.testMethodFailure();
case 6:
_context2.next = 11;
break;
case 8:
_context2.prev = 8;
_context2.t0 = _context2["catch"](0);
console.error(_context2.t0);
case 11:
case "end":
return _context2.stop();
}
}
}, _callee2, undefined, [[0, 8]]);
谢谢詹姆斯·索普
这是自12月以来的一个众所周知的错误您是否也可以发布传输的ES5?如果您查看添加的传输代码,您将发现testMethodFailure中有一个指向函数的“var\u this2=This”。当在它前面添加async时,我没想到它的引用会改变。在以前的版本中,它就像一个符咒。看起来像是巴别塔6中的一个bug,是的。网站上的“试一试”仍然是巴别塔5,行
var\u this2=this代码>是在testMethodFailure
中立即生成的,而不是在promise回调中生成的。它已经有了一个函数。这在箭头函数中被破坏了