绕过Babel重新映射ES6“this”;未定义的

Getting around Babel remapping ES6 "this" to undefined

本文关键字：this 未定义 ES6 Babel 新映射 映射 绕过      更新时间：2023-09-26

我正在将代码库移动到ES6类。

我仍然在处理一些遗留的jQuery模块，其中有init函数附加到他们，这是从html调用。代码的入口点如下所示:

import * as moduleOne from './module_one/module_one';
import * as moduleTwo from './module_two/module_two';
import * as moduleThree from './module_three/module_three';
import * as moduleFour from "./module_four/module_four";
window.initjQuery = (mod) => {
    eval(mod).init()
}

在HTML中:

<script>initjQuery('moduleFour')</script>

这样就可以工作了，moduleFour.init()被正确调用了。但是如果可能的话，我希望避免使用eval。问题是，Babel将this重新映射到undefined，所以我没有办法做这样的事情:

var _this = this;
window.initjQuery = function(mod) {
   _this[mod].init();
}

有什么办法解决这个问题吗?

这些模块名只是变量(在模块范围内)，不是任何对象的属性。请注意，模块中的this和严格函数中的undefined一样。

所以你要把这些模块对象放在一个显式对象上:

import * as moduleOne from './module_one/module_one';
import * as moduleTwo from './module_two/module_two';
import * as moduleThree from './module_three/module_three';
import * as moduleFour from "./module_four/module_four";
const modules = {moduleOne, moduleTwo, moduleThree, moduleFour};
window.initjQuery = (mod) => {
    modules[mod].init()
};
相关文章：