javascript - 如何正确地将属性分配给函数作用域？

Question

我最近一直在尝试 Typescript Decorators，以尝试解决我的应用程序中遇到的“问题”。我正在使用 JS 桥将 TS 代码提供给 Android 和 iOS，目前我们声明如下函数:

index.js

import foo from './bar'

global.App = function() {
  this.foo = foo;
};

以上将使 foo 函数在桥的 native 端可用

我想编写一个装饰器来应用于该 foo 方法，该方法将在 global.App 上“注册”自身，但我在该任务中失败了。

这是有效的装饰器:

export const Task = (target, propertyKey, descriptor) => {
    let originalMethod = descriptor.value;
    descriptor.value = (...args) => originalMethod.apply(target, args);

    if (!global.App) {
        global.App = function () { 
            this.foo = descriptor.value;
        };
    }
    
    return descriptor;
}

如何向该 global.App 函数添加另一个方法？

Answer 1

首先，foo方法只添加一次，因为第一次调用装饰器 global.App定义并添加 foo 的分支至global.App永远不会重新输入。

其次，global.App和foo每次都会被覆盖，并且不会通过重复调用装饰器来维护。

添加另一个分支，用于在第一次调用后处理添加方法并动态分配方法的名称，我相信该名称是在 propertyKey 中赋予装饰器的，将允许添加多种方法。

export const Task = (target, propertyKey, descriptor) => {
    let originalMethod = descriptor.value;
    descriptor.value = (...args) => originalMethod.apply(target, args);

    if (!global.App) {
        global.App = function () { 
            this[propertyKey] = descriptor.value;
        };
    } else {
        global.App[propertyKey] = descriptor.value;
    }
    
    return descriptor;
}

像这样的东西可能会起作用。