Question

我不是初学者，但是Javascript仍然经常使我感到困惑。有人可以告诉我我在下面做的事情是否还可以吗？

在Electron中，用于设置菜单的模板代码可能很长。我在一个多窗口应用程序中有许多菜单，我想将菜单模板代码从main.js移到一个模块中。

所以我创建了一个新文件：

const MenuTemplates = require("./app/js/menu-templates.js");

并这样称呼它：

var mainMenu = Menu.buildFromTemplate(MenuTemplates.getMainMenuFullVersion());`

这是菜单模板的截断版本：

exports.getTimelineMenuFullVersion = function () {
    return [
        {
            label: global.appName,
            submenu: [
                { label: 'About ' + global.appName, 
                  click: () => { showAboutWindow() } },

调用函数（例如showAboutWindow()会引发错误，这让我感到惊讶。我想我认为，由于MenuTemplates由main.js加载，因此它可以访问其方法。

为解决这个问题，我尝试传递this作为上下文：

var mainMenu = Menu.buildFromTemplate(MenuTemplates.getMainMenuFullVersion(this));` 

exports.getTimelineMenuFullVersion = function (context) {
    return [
        {
            label: global.appName,
            submenu: [
                { label: 'About ' + global.appName, 
                  click: () => { context.showAboutWindow() } },

那没有用-所以现在我很困惑。

Answer 1

多年以来，我在ES5中使用jQuery.proxy() https://api.jquery.com/jQuery.proxy/

但是，对于ES6，应该为您解决范围问题，粗箭头（=>）应该为您重新定义功能范围。除非我想念什么。

就个人而言，我更喜欢使用代理模式而不是传递上下文。但比这更好的是使用更新的ES6方法来解决此问题

要完全不看MenuTemplates就不可能准确回答。如果MenuTemplates将其所有方法都加载到全局名称空间（window）中，那么可以，理论上讲，您可以在任何地方访问它们。

但是我不认为加载了require的模块通常会这样做，它们通常只加载默认文件中的变量（在app / js / menu-templates.js中查找export default MenuTemplates

将“ this”作为上下文传递给模块？

1 个答案: